/* Restaurant layout. All brand colors come from config/brands.php.
 * The shared theme also serves Grupo Plaza and future brands.
 */
@import url("./brand-color.css");

:root {
  --bs-primary: var(--brand-primary);
  --bs-primary-rgb: var(--brand-primary-rgb);
  --bs-success: var(--brand-primary);
  --bs-success-rgb: var(--brand-primary-rgb);
  --bs-success-text-emphasis: var(--brand-primary);
  --bs-success-bg-subtle: var(--brand-soft);
  --bs-success-border-subtle: var(--brand-border);
  --bs-danger: var(--brand-danger);
  --bs-danger-rgb: var(--brand-danger-rgb);
  --bs-link-color: var(--brand-link);
  --bs-link-color-rgb: var(--brand-link-rgb);
  --bs-link-hover-color: var(--brand-primary-hover);
  --bs-link-hover-color-rgb: var(--brand-primary-hover-rgb);
}

/* Bootstrap success utilities are used throughout the existing screens. */
.btn-primary,
.btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--brand-primary);
  --bs-btn-border-color: var(--brand-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--brand-primary-hover);
  --bs-btn-hover-border-color: var(--brand-primary-hover);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--brand-primary-dark);
  --bs-btn-active-border-color: var(--brand-primary-dark);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--brand-primary);
  --bs-btn-disabled-border-color: var(--brand-primary);
  --bs-btn-focus-shadow-rgb: var(--brand-primary-hover-rgb);
  color: #fff;
}

.btn-outline-primary,
.btn-outline-success {
  --bs-btn-color: var(--brand-primary);
  --bs-btn-border-color: var(--brand-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--brand-primary);
  --bs-btn-hover-border-color: var(--brand-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--brand-primary-hover);
  --bs-btn-active-border-color: var(--brand-primary-hover);
  --bs-btn-disabled-color: var(--brand-primary);
  --bs-btn-disabled-border-color: var(--brand-primary);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-focus-shadow-rgb: var(--brand-primary-hover-rgb);
}

.light-theme .btn-outline-primary:is(:hover, :focus, :active, .active, .current),
.light-theme .btn-outline-success:is(:hover, :focus, :active, .active, .current) {
  color: #fff;
}

.btn-success:is(:focus, :active),
.btn-outline-success:is(:focus, :active) {
  box-shadow: 0 0 0 0.25rem rgba(var(--brand-primary-hover-rgb), 0.3);
}

.text-success,
.text-success-emphasis,
.greendollar {
  color: rgba(var(--brand-primary-rgb), var(--bs-text-opacity, 1)) !important;
}

.bg-success,
.text-bg-success {
  background-color: rgba(var(--brand-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-success {
  color: #fff !important;
}

.border-success {
  border-color: rgba(var(--brand-primary-rgb), var(--bs-border-opacity, 1)) !important;
}

.bg-success-subtle,
.background-icon-box {
  background-color: var(--brand-soft) !important;
}

.border-success-subtle {
  border-color: var(--brand-border) !important;
}

.link-success {
  color: var(--brand-link) !important;
  text-decoration-color: currentColor !important;
}

.link-success:is(:hover, :focus) {
  color: var(--brand-primary-hover) !important;
}

.alert-success {
  --bs-alert-color: var(--brand-primary);
  --bs-alert-bg: var(--brand-soft);
  --bs-alert-border-color: var(--brand-border);
  --bs-alert-link-color: var(--brand-primary);
}

.table-success {
  --bs-table-color: var(--brand-primary);
  --bs-table-bg: var(--brand-soft);
  --bs-table-border-color: var(--brand-border);
  --bs-table-striped-bg: var(--brand-card);
  --bs-table-striped-color: var(--brand-primary);
  --bs-table-active-bg: var(--brand-border);
  --bs-table-active-color: var(--brand-primary);
  --bs-table-hover-bg: var(--brand-card);
  --bs-table-hover-color: var(--brand-primary);
}

.btn-danger {
  --bs-btn-bg: var(--brand-danger);
  --bs-btn-border-color: var(--brand-danger);
  --bs-btn-hover-bg: var(--brand-danger-hover);
  --bs-btn-hover-border-color: var(--brand-danger-hover);
  --bs-btn-active-bg: var(--brand-danger-hover);
  --bs-btn-active-border-color: var(--brand-danger-hover);
}

.form-control.is-valid,
.was-validated .form-control:valid,
.form-select.is-valid,
.was-validated .form-select:valid {
  border-color: var(--brand-primary-hover);
}

.form-control.is-valid,
.was-validated .form-control:valid {
  background-image: var(--brand-validation-icon);
}

.valid-feedback,
.form-check-input.is-valid ~ .form-check-label,
.was-validated .form-check-input:valid ~ .form-check-label {
  color: var(--brand-primary);
}

.form-check-input.is-valid,
.was-validated .form-check-input:valid {
  border-color: var(--brand-primary-hover);
}

.form-check-input.is-valid:checked,
.was-validated .form-check-input:valid:checked,
.valid-tooltip {
  background-color: var(--brand-primary);
}

.light-theme input[type=checkbox]:checked,
.light-theme input[type=radio]:checked {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
}

.is-valid:focus,
.was-validated :valid:focus {
  box-shadow: 0 0 0 0.25rem rgba(var(--brand-primary-hover-rgb), 0.25);
}

.page-link {
  color: var(--brand-primary);
}

.active > .page-link,
.page-link.active,
.list-group-item.active {
  color: #fff;
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
}

/* Brand surfaces: the sidebar carries the dominant navy color. */
.main-logo .brand-header-logo {
  width: 225px;
  max-height: 58px;
  object-fit: contain;
}

.mobile-logo img {
  max-height: 48px;
  width: auto;
  object-fit: contain;
}

.light-theme {
  background-color: var(--brand-surface);
  color: var(--brand-text);
}

.light-theme .header {
  border-bottom: 3px solid var(--brand-primary);
}

.main-sidebar,
.light-theme .main-sidebar,
.light-theme .main-sidebar.horizontal-menu {
  background-color: var(--brand-primary);
}

.main-sidebar::after,
.light-theme .main-sidebar::after {
  background: rgba(var(--brand-primary-rgb), 0.96);
}

.light-theme .main-sidebar .sidebar-link-group-title {
  color: #fff;
  background: var(--brand-primary-hover);
}

.light-theme .main-sidebar .sidebar-item {
  border-color: rgba(255, 255, 255, 0.12);
}

.light-theme .main-sidebar .sidebar-item .sidebar-link,
.light-theme .main-sidebar .sidebar-item .sidebar-link .nav-icon,
.light-theme .main-sidebar.sidebar-hover .sidebar-item .sidebar-link .nav-icon {
  color: #fff;
}

.light-theme .main-sidebar .sidebar-item .sidebar-link:is(:hover, .active, .show),
.light-theme .main-sidebar .sidebar-item .sidebar-link:is(:hover, .active, .show) .nav-icon {
  color: #fff !important;
  background-color: var(--brand-primary-hover) !important;
}

.light-theme .main-sidebar .sidebar-item .sidebar-link.active::after {
  background: var(--brand-accent) !important;
}

.light-theme .main-sidebar .sidebar-dropdown-menu,
.light-theme .main-sidebar.horizontal-menu .sidebar-link-group {
  background: var(--brand-primary);
}

.light-theme .main-sidebar .sidebar-link.has-sub::after {
  border-color: #fff;
}

.light-theme .panel .panel-header h5,
.light-theme .panel-title {
  color: var(--brand-primary);
}

.main-content.login-panel,
.light-theme .main-content.login-panel {
  background: linear-gradient(251deg, var(--brand-primary-dark) 34.5%, var(--brand-primary-hover) 83%);
}

.main-content.login-panel .login-body {
  background: #fff;
  border-top: 4px solid var(--brand-primary);
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(var(--brand-primary-rgb), 0.25);
}

.main-content.login-panel .login-body .top {
  height: auto;
  min-height: 160px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.main-content.login-panel .login-body .top .logo img {
  width: 160px;
  max-width: 100%;
  height: auto;
}

.main-content.login-panel .login-body .login-options {
  flex-wrap: wrap;
  gap: 10px 16px;
}

.main-content.login-panel .login-body .top a {
  color: var(--brand-primary);
}

.main-content.login-panel .footer,
.main-content.login-panel .footer .text-success {
  color: #fff !important;
}

.light-theme .main-content.login-panel .footer {
  background: var(--brand-primary);
  border-top-color: rgba(255, 255, 255, 0.15);
}

.light-theme .main-content.login-panel .footer p {
  color: #fff;
}

.main-content.login-panel .footer .text-success {
  border-bottom: 2px solid var(--brand-accent);
}

.brand-welcome-banner {
  display: block;
  width: min(100%, 780px);
  height: auto;
  margin: 24px auto;
  border-radius: 16px;
}


.swal2-icon.swal2-success {
  border-color: var(--brand-primary-hover);
  color: var(--brand-primary);
}

.swal2-icon.swal2-success .swal2-success-ring {
  border-color: rgba(var(--brand-primary-hover-rgb), 0.3);
}

.swal2-icon.swal2-success [class^=swal2-success-line],
.dtp div.dtp-date,
.dtp div.dtp-time {
  background: var(--brand-primary);
}