/* Gato Gordo UI palette — added 2026-09-21. Revert: restore custom.css.pre-brand-20260921-2315 */
:root {
  --el-color-success: #f9c900;
  --el-color-success-light-3: #fbe06a;
  --el-color-success-light-5: #fcef9e;
  --el-color-success-light-7: #fff6cf;
  --el-color-success-light-8: #fff9e3;
  --el-color-success-light-9: #fffcef;
  --el-color-success-dark-2: #e5b800;
}
.el-button--success {
  --el-button-bg-color: #f9c900;
  --el-button-border-color: #f9c900;
  --el-button-text-color: #171717;
  --el-button-hover-bg-color: #e5b800;
  --el-button-hover-border-color: #e5b800;
  --el-button-hover-text-color: #171717;
  --el-button-active-bg-color: #d7aa00;
  --el-button-active-border-color: #d7aa00;
  --el-button-active-text-color: #171717;
}
.btn-green {
  background-color: #f9c900 !important;
  border-color: #f9c900 !important;
  color: #171717 !important;
}
.btn-green:hover, .btn-green:focus {
  background-color: #e5b800 !important;
  border-color: #e5b800 !important;
  color: #171717 !important;
}
.el-menu-item.is-active, .el-tabs__item.is-active, .el-dropdown-menu__item.is-active, .el-select-dropdown__item.selected {
  color: #171717 !important;
  background-color: #fff6cf !important;
}

/* Homepage join cards: solid brand action treatment */
.join-sections .el-button--success.is-plain {
  --el-button-bg-color: #f9c900;
  --el-button-border-color: #f9c900;
  --el-button-text-color: #171717;
  --el-button-hover-bg-color: #e5b800;
  --el-button-hover-border-color: #e5b800;
  --el-button-hover-text-color: #171717;
}

/* Account navigation: neutral selected states; yellow remains reserved for actions. */
.el-menu-item.is-active, .el-tabs__item.is-active, .el-dropdown-menu__item.is-active, .el-select-dropdown__item.selected {
  color: #242424 !important;
  background-color: #f3f4f6 !important;
}
.router-link-active, .router-link-exact-active {
  color: #242424 !important;
  background-color: #f3f4f6 !important;
  border-left: 3px solid #f9c900;
}
.profile-menu .active, .account-menu .active, .account-sidebar .active, .profile-nav .active {
  background-color: #242424 !important;
  border-color: #242424 !important;
  color: #ffffff !important;
}
.profile-menu .active *, .account-menu .active *, .account-sidebar .active *, .profile-nav .active * {
  color: inherit !important;
}

/* Final interaction cleanup: never use success green in account navigation or CTA hover. */
.join-sections .el-button--success.is-plain:hover, .join-sections .el-button--success.is-plain:focus, .join-sections .el-button--success.is-plain:active {
  color: #171717 !important;
  background-color: #e5b800 !important;
  border-color: #e5b800 !important;
}
.active:not(.btn):not(.el-button), .selected:not(.btn):not(.el-button), [aria-current=page] {
  color: #242424 !important;
  background-color: #f3f4f6 !important;
}
.active:not(.btn):not(.el-button) *, .selected:not(.btn):not(.el-button) *, [aria-current=page] * {
  color: inherit !important;
}
.active.bg-success:not(.btn), .selected.bg-success:not(.btn), .active.success:not(.btn), .selected.success:not(.btn) {
  background-color: #242424 !important;
  border-color: #242424 !important;
  color: #ffffff !important;
}
.active.bg-success:not(.btn) *, .selected.bg-success:not(.btn) *, .active.success:not(.btn) *, .selected.success:not(.btn) * {
  color: inherit !important;
}

/* Navigation hover: delivery-bag red, not success green. */
.dropdown-menu a:hover, .dropdown-menu a:focus, .dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item:focus {
  color: #d9263c !important;
  background-color: #fff4f5 !important;
}
.dropdown-menu a:hover *, .dropdown-menu a:focus *, .dropdown-menu .dropdown-item:hover *, .dropdown-menu .dropdown-item:focus * {
  color: inherit !important;
}

/* Profile sub-navigation: warm delivery-bag red for the current section. */
.el-tabs__item.is-active, .el-menu-item.is-active, [role=tab][aria-selected=true], .profile-tabs .active, .profile-content .active, .profile-settings .active, .account-content .active, .account-settings .active, .settings-menu .active, .settings-menu .selected, .menu-settings .active {
  background-color: #c92b3d !important;
  border-color: #c92b3d !important;
  color: #ffffff !important;
}
.el-tabs__item.is-active *, .el-menu-item.is-active *, [role=tab][aria-selected=true] *, .profile-tabs .active *, .profile-content .active *, .profile-settings .active *, .account-content .active *, .account-settings .active *, .settings-menu .active *, .settings-menu .selected *, .menu-settings .active * {
  color: inherit !important;
}

/* Theme sub-menu: replace the legacy green selected fill. */
ul.sub-menu li.active a {
  background-color: #343a40 !important;
  border-color: #343a40 !important;
  color: #ffffff !important;
}
ul.sub-menu li.active a:hover, ul.sub-menu li.active a:focus {
  background-color: #24282d !important;
  border-color: #24282d !important;
  color: #ffffff !important;
}
ul.sub-menu li a:hover, ul.sub-menu li a:focus {
  color: #c92b3d !important;
  background-color: #fff4f5 !important;
}
ul.sub-menu li a:hover * , ul.sub-menu li a:focus * {
  color: inherit !important;
}

/* Selected sub-menu contrast: force every nested label and icon to white. */
ul.sub-menu li.active a, ul.sub-menu li.active a *, ul.sub-menu li.active a i, ul.sub-menu li.active a span {
  color: #ffffff !important;
}

/* Active sub-menu item owns both the background and foreground colour. */
ul.sub-menu li.active, ul.sub-menu li.active *, ul.sub-menu li.active a, ul.sub-menu li.active a * {
  color: #ffffff !important;
}

/* Higher specificity than the generic active-state rule. */
ul.sub-menu li.active.active, ul.sub-menu li.active.active a, ul.sub-menu li.active.active a *, ul.sub-menu li.active.active i, ul.sub-menu li.active.active span {
  color: #ffffff !important;
}