/* PeppermintProfile custom overrides */
/* Slim the horizontal second-row menu so it doesn't hog vertical space. */
.layout-menu-horizontal { min-height: 44px !important; }
.layout-menu-horizontal .menu-inner { min-height: 44px; align-items: center; }
.layout-menu-horizontal .menu-inner > .menu-item > .menu-link,
.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link {
  padding-top: .35rem;
  padding-bottom: .35rem;
  line-height: 1.2;
}

/* Pin the brand to the far-left at every viewport width; force the right-side
   utility cluster to the far-right. Prevents Vuexy horizontal-menu quirks from
   floating the logo into the middle at intermediate widths. */
.layout-navbar > .container-xxl { flex-wrap: nowrap; justify-content: flex-start; }
.layout-navbar .navbar-brand.app-brand.demo {
  order: -100 !important;
  margin-right: 1rem !important;
  flex-shrink: 0;
}
.layout-navbar #navbar-collapse {
  order: 100 !important;
  margin-left: auto !important;
}

/* Top category buttons only: soften inactive Profile, Dining, Services, and
   My Office without changing their existing hover/focus or active states. */
[data-bs-theme='light'] .layout-navbar .navbar-nav.d-xl-flex > .nav-item > .btn-label-secondary,
[data-bs-theme='light'] .pp-team-tabs > .btn-label-secondary {
  --bs-btn-color: #434449;
  --bs-btn-bg: #cff2d0de;
  --bs-btn-border-color: #d5f0e0;
}
[data-bs-theme='dark'] .layout-navbar .navbar-nav.d-xl-flex > .nav-item > .btn-label-secondary,
[data-bs-theme='dark'] .pp-team-tabs > .btn-label-secondary {
  --bs-btn-color: #434449;
  --bs-btn-bg: #cfcde4;
  --bs-btn-border-color: #cfcde4;
  --bs-btn-hover-color: #fff;
}

/* Global light-theme text hierarchy. Keep semantic component colours and the
   dark theme untouched while replacing Vuexy's overly pale body/muted tokens. */
[data-bs-theme='light'] {
  --bs-emphasis-color: #202225;
  --bs-emphasis-color-rgb: 32, 34, 37;
  --bs-heading-color: #292b2f;
  --bs-body-color: #434449;
  --bs-body-color-rgb: 67, 68, 73;
  --bs-secondary-color: #62666a;
  --bs-secondary-color-rgb: 98, 102, 106;
  --bs-tertiary-color: rgba(67, 68, 73, .68);
  --bs-tertiary-color-rgb: 67, 68, 73;
  --bs-highlight-color: #434449;
  --bs-menu-color: var(--bs-heading-color);
  --bs-menu-color-rgb: 41, 43, 47;
  --bs-menu-hover-color: var(--bs-heading-color);
  --bs-menu-sub-active-color: var(--bs-heading-color);
}

/* Ordinary component text that Vuexy hard-codes instead of inheriting the
   light theme tokens above. Semantic colours and interactive states excluded. */
[data-bs-theme='light'] .accordion {
  --bs-accordion-btn-color: var(--bs-heading-color);
  --bs-accordion-active-color: var(--bs-heading-color);
}
[data-bs-theme='light'] .card {
  --bs-card-subtitle-color: var(--bs-secondary-color);
}
[data-bs-theme='light'] .figure-caption,
[data-bs-theme='light'] .text-lighter {
  color: var(--bs-secondary-color) !important;
}
[data-bs-theme='light'] .text-lightest {
  color: var(--bs-tertiary-color) !important;
}
[data-bs-theme='light'] .fc .fc-list .fc-list-table .fc-list-event:hover .fc-list-day th {
  color: var(--bs-heading-color);
}
[data-bs-theme='light'] .footer.bg-white {
  --bs-footer-color: var(--bs-body-color);
  --bs-footer-text-color: var(--bs-heading-color);
  --bs-footer-brand-color: var(--bs-heading-color);
}

/* Work uses a familiar blue-and-gray palette, kept separate from personal pages. */
[data-bs-theme='light'] body.pp-workspace-page {
  background-color: #e9ebee;
}

/* The work rail does not inherit the site-wide green navigation selection. */
.pp-workspace-page .pp-myoffice-sidebar .list-group-item.pp-leaf-active {
  background-color: #4267b3 !important;
  border-color: #4267b3 !important;
  color: #fff !important;
}
.pp-workspace-page .pp-myoffice-sidebar .list-group-item.pp-leaf-active i {
  color: #fff !important;
}
.pp-workspace-page .pp-myoffice-sidebar .list-group-item-action:hover,
.pp-workspace-page .pp-myoffice-sidebar .list-group-item-action:focus {
  background-color: #e9ebee !important;
  color: #4267b3 !important;
}
.pp-workspace-page .pp-myoffice-sidebar .list-group-item-action:hover i,
.pp-workspace-page .pp-myoffice-sidebar .list-group-item-action:focus i {
  color: #4267b3 !important;
}

/* Employee module tiles and access badges use the work blue pair. */
.pp-workspace-page .avatar-initial.bg-label-primary,
.pp-workspace-page .badge.bg-label-primary {
  background-color: #e9ebee !important;
  color: #4267b3 !important;
}

[data-bs-theme='dark'] body.pp-workspace-page { background-color: #20242d; }
[data-bs-theme='dark'] .pp-workspace-navbar {
  background-color: #2d3b56 !important;
  border-bottom-color: #4267b3;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .28);
}
[data-bs-theme='dark'] .pp-workspace-page .card,
[data-bs-theme='dark'] .pp-workspace-page .pp-myoffice-sidebar { background-color: #2d323d; border-color: #424a59; }
[data-bs-theme='dark'] .pp-workspace-page .pp-myoffice-sidebar .list-group-item.pp-leaf-active,
[data-bs-theme='dark'] .pp-workspace-page .avatar-initial.bg-label-primary,
[data-bs-theme='dark'] .pp-workspace-page .badge.bg-label-primary {
  background-color: #4267b3 !important;
  border-color: #4267b3 !important;
  color: #fff !important;
}

/* PeppermintProfile brand logo: two theme variants, only the matching one shows. */
.navbar-brand .pp-brand-img { height: 40px; width: auto; display: block; }
[data-bs-theme='dark']  .pp-brand-light { display: none; }
[data-bs-theme='light'] .pp-brand-dark  { display: none; }

/* Custom brand palette — matches the PeppermintProfile logo per theme. */
:root, [data-bs-theme='light'] {
  --bs-primary:            #0C951B ;
  --bs-primary-rgb:        4, 91, 6;
  --bs-primary-text-emphasis: #0C951B ;
  --bs-primary-bg-subtle:  #489685;
  --bs-primary-border-subtle: #489685;
}
[data-bs-theme='dark'] {
  --bs-primary:            #4fA651;
  --bs-primary-rgb:        79, 166, 81;
  --bs-primary-text-emphasis: #4fA651;
  --bs-primary-bg-subtle:  #8FDDCC;
  --bs-primary-border-subtle: #8FDDCC;
}

/* Unified PeppermintProfile brand palette — 4fA651 as primary for both themes.
   Active buttons force white text on primary background. */
:root, [data-bs-theme='light'], [data-bs-theme='dark'] {
  --bs-primary:               #4fA651;
  --bs-primary-rgb:           79, 166, 81;
  --bs-primary-text-emphasis: #4fA651;
  --bs-primary-bg-subtle:     #8FDDCC;
  --bs-primary-border-subtle: #8FDDCC;
}

/* Buttons in the primary/active state use white text on the primary green. */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn.active,
.nav-link.active,
.badge.bg-primary,
.list-group-item.active {
  color: #fff !important;
}

/* Second-row (horizontal) menu: active item styled like the top-nav primary button. */
.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link,
.layout-menu-horizontal .menu-inner > .menu-item.active.open > .menu-link {
  background-color: var(--bs-primary) !important;
  color: #fff !important;
}
.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link .menu-icon,
.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link .menu-icon::before {
  color: #fff !important;
}

/* Vertical category sidebar (list-group):
   - ALL active items: bold green text/icon, transparent bg (no border on parent).
   - The DEEPEST clicked item (.pp-leaf-active): 1px green border + shifted right. */
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  color: #4fA651 !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.list-group-item.active .icon-base,
.list-group-item.active i {
  color: #4fA651 !important;
}
.list-group-item.pp-leaf-active,
.list-group-item.pp-leaf-active:hover,
.list-group-item.pp-leaf-active:focus {
  border: 1px solid #4fA651 !important;
  border-radius: .375rem !important;
  transform: translateX(6px);
  transition: transform .15s ease;
}

/* Price / money in brand green. */
.pp-price { color: #4fA651 !important; }
.pp-price-lg { color: #4fA651 !important; font-weight: 700; }


/* Sub-category leaf-active: keep green border + shift, add teal fill. */
.list-group-item.pp-leaf-active,
.list-group-item.pp-leaf-active:hover,
.list-group-item.pp-leaf-active:focus {
  background-color: #4fA651 !important;
  color: #fff !important;
}
.list-group-item.pp-leaf-active .icon-base,
.list-group-item.pp-leaf-active i {
  color: #fff !important;
}

/* Portfolio button (banner-right, 6+ businesses) + portfolio page hero */
.pp-portfolio-btn {
  background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
  border: none;
  color: #fff !important;
  font-weight: 500;
  box-shadow: 0 2px 8px rgba(139,92,246,.35);
  transition: transform .15s ease, box-shadow .15s ease, background .2s ease;
}
.pp-portfolio-btn:hover, .pp-portfolio-btn:focus, .pp-portfolio-btn:active {
  background: linear-gradient(135deg, #7C3AED 0%, #DB2777 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(236,72,153,.4);
  color: #fff !important;
}
.pp-portfolio-hero {
  background: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
}
.pp-portfolio-header { border: none; }
.pp-portfolio-card { transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.pp-portfolio-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.06); border-color: var(--bs-primary); }

/* Back-to-top button (bottom-center, visible after 400px scroll) */
.pp-to-top {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%) translateY(24px);
  opacity: 0;
  pointer-events: none;
  z-index: 1030;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #4fA651;
  color: #fff;
  border: none;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,.22);
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}
.pp-to-top:hover, .pp-to-top:focus { background: #3d8a40; color: #fff; outline: none; }
.pp-to-top.pp-show { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }

/* Mobile submenu strip — replaces the off-canvas aside below xl */
.pp-mobile-submenu {
  background: var(--bs-body-bg);
  border-bottom: 1px solid var(--bs-border-color);
  position: relative;
  z-index: 3;
}
.pp-mobile-submenu-scroll { scrollbar-width: none; -ms-overflow-style: none; }
.pp-mobile-submenu-scroll::-webkit-scrollbar { display: none; }
@media (min-width: 1200px) { .pp-mobile-submenu { display: none !important; } }
/* Below xl: the horizontal aside is off-canvas (drawer). Strip is an always-visible
   shortcut; the hamburger drawer stays available. Do NOT hide .layout-menu-toggle. */

/* ---- Sticky submenu (desktop aside + mobile strip) ----
   Ancestors (.layout-wrapper/.layout-container/.layout-page/.content-wrapper)
   have no overflow, so position:sticky resolves against the viewport.
   Sticky keeps the element in normal flow, so it reserves its own space and
   page content can no longer slide underneath it. */
#layout-menu.layout-menu-horizontal,
.pp-mobile-submenu {
  position: sticky !important;
  inset-block-start: var(--pp-navbar-height, 3.5rem);
  top: var(--pp-navbar-height, 3.5rem);
  z-index: 1010;          /* above page content + cards, below navbar dropdowns (1020+) */
  transform: translateY(0);
  transition: transform 160ms ease;
  will-change: transform;
}
#layout-menu.layout-menu-horizontal.pp-submenu-hidden,
.pp-mobile-submenu.pp-submenu-hidden {
  transform: translateY(calc(-100% - 2px));
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  #layout-menu.layout-menu-horizontal,
  .pp-mobile-submenu { transition: none; }
}
/* Opaque background so scrolling content cannot show through the bar */
#layout-menu.layout-menu-horizontal {
  background: var(--bs-body-bg);
  border-bottom: 1px solid var(--bs-border-color);
}

/* Light theme only: the responsive second/category menu bar. */
[data-bs-theme='light'] #layout-menu.layout-menu-horizontal,
[data-bs-theme='light'] .pp-mobile-submenu {
  background: #fff;
}
[data-bs-theme='light'] #layout-menu.layout-menu-horizontal {
  --bs-menu-color: #434449;
}
[data-bs-theme='light'] .pp-mobile-submenu .btn-label-secondary {
  --bs-btn-color: #434449;
}

/* Light theme only: marketplace browse/similar listing cards stay pure white. */
[data-bs-theme='light'] .pp-item-card {
  background: #fff;
}

/* My Office workspace shell: persistent desktop navigation adapted from the
   existing Marketplace list-group pattern, with an offcanvas control below xl. */
.pp-myoffice-sidebar-shell { position: relative; z-index: 2; }
.pp-myoffice-sidebar {
  position: fixed;
  inset-inline-start: max(1rem, calc((100vw - 1440px) / 2 + 1rem));
  top: calc(var(--pp-navbar-height, 3.5rem) + 1rem);
  bottom: 1rem;
  width: 248px;
  overflow: hidden;
  z-index: 1000;
  transition: top 160ms ease;
}
.pp-myoffice-sidebar-scroll {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.pp-myoffice-sidebar .list-group-item,
#ppMyOfficeNav .list-group-item {
  display: flex;
  align-items: center;
  border: 0;
}
.pp-myoffice-sidebar .list-group-item.pp-leaf-active,
#ppMyOfficeNav .list-group-item.pp-leaf-active {
  margin: .25rem .5rem;
  width: calc(100% - 1rem);
  transform: none;
}
.pp-myoffice-nav-heading {
  padding: 1.15rem 1rem .35rem;
  color: var(--bs-secondary-color);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (min-width: 1200px) {
  .pp-myoffice-sidebar-shell ~ .container-xxl {
    padding-inline-start: calc(248px + 2rem);
  }
  body:has(#layout-menu.pp-submenu-hidden) .pp-myoffice-sidebar {
    top: calc(var(--pp-navbar-height, 3.5rem) + 1rem);
  }
}
@media (prefers-reduced-motion: reduce) {
  .pp-myoffice-sidebar { transition: none; }
}

/* Dashboard widget canvas. The structure is ready for later account-level
   order/visibility persistence; no pretend drag-and-drop is exposed today. */
.pp-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}
.pp-dashboard-widget { min-width: 0; }
.pp-widget-span-4 { grid-column: span 4; }
.pp-widget-span-5 { grid-column: span 5; }
.pp-widget-span-7 { grid-column: span 7; }
.pp-widget-span-8 { grid-column: span 8; }
.pp-dashboard-tool {
  color: inherit;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.pp-dashboard-tool:hover,
.pp-dashboard-tool:focus-visible {
  border-color: var(--bs-primary) !important;
  box-shadow: 0 .25rem .75rem rgba(var(--bs-primary-rgb), .12);
  transform: translateY(-1px);
}
@media (max-width: 991.98px) {
  .pp-widget-span-4,
  .pp-widget-span-5,
  .pp-widget-span-7,
  .pp-widget-span-8 { grid-column: 1 / -1; }
}
/* Dedicated employee-workspace header. Kept here, not in the PHP partial,
   so workspace colors follow the same site-wide styling rules as every page. */
.pp-workspace-navbar {
  min-height: 56px;
  background-color: #4267b3 !important;
  border-bottom: 2px solid #294d8f;
  box-shadow: 0 2px 10px rgba(41, 77, 143, .18);
}
.pp-workspace-navbar .container-xxl { position: relative; }
.pp-workspace-actions {
  position: absolute;
  inset-inline-start: 50%;
  top: 50%;
  z-index: 1041;
  transform: translate(-50%, -50%);
}
.pp-workspace-primary { background: #294d8f; border-color: #294d8f; color: #fff; }
.pp-workspace-primary:hover, .pp-workspace-primary:focus { background: #203c70; border-color: #203c70; color: #fff; }
.pp-workspace-secondary { color: #fff; border-color: #b8c8e6; background: rgba(255, 255, 255, .12); }
.pp-workspace-secondary:hover, .pp-workspace-secondary:focus { color: #4267b3; border-color: #e9ebee; background: #e9ebee; }
.pp-workspace-utility { color: #fff; }
.pp-workspace-utility:hover, .pp-workspace-utility:focus { color: #fff; background: rgba(255, 255, 255, .16); }
.pp-workspace-navbar .pp-shortcut-tile:hover { background-color: rgba(255, 255, 255, .12); }
.pp-workspace-context {
  position: absolute;
  top: calc(100% + 7px);
  left: 50%;
  z-index: 1040;
  min-width: 240px;
  padding: .45rem .75rem;
  color: #664d03;
  text-align: center;
  white-space: nowrap;
  background: #ffe69c;
  border: 1px solid #d39e00;
  border-radius: 0 0 .45rem .45rem;
  box-shadow: 0 .35rem .8rem rgba(102, 77, 3, .14);
  transform: translateX(-50%);
}
@media (max-width: 767.98px) {
  .pp-workspace-navbar { min-height: 56px; }
  .pp-workspace-actions { gap: .25rem !important; }
  .pp-workspace-context { min-width: 205px; font-size: .78rem; }
}
/* Personal chat: retain the product theme while giving the workspace a warmer, more deliberate rhythm. */
.pp-pane { background: linear-gradient(180deg, rgba(var(--bs-primary-rgb), .025), transparent 34%); }
.pp-pane > .p-3.border-bottom { background: rgba(var(--bs-primary-rgb), .035); }
.pp-pane .list-group-item { border-inline: 0; border-top: 0; padding: .85rem 1rem; transition: background-color .16s ease, transform .16s ease; }
.pp-pane .list-group-item:hover { background: rgba(var(--bs-primary-rgb), .055); transform: translateX(2px); }
.pp-pane .list-group-item.active { border-left: 3px solid var(--bs-primary); background: rgba(var(--bs-primary-rgb), .11); color: inherit; }
.pp-pane .list-group-item.active .text-body-secondary { color: var(--bs-body-color) !important; opacity: .68; }
.pp-bubble { box-shadow: 0 1px 1px rgba(0,0,0,.025); border: 1px solid rgba(var(--bs-primary-rgb), .055); }
.pp-bubble.mine { border-color: rgba(var(--bs-primary-rgb), .14); box-shadow: 0 4px 12px rgba(var(--bs-primary-rgb), .08); }
.pp-result strong::before, .pp-pane .list-group-item strong::before { content: '•'; color: var(--bs-primary); margin-right: .45rem; }
.card > .card-header:has(+ .row) { padding: .65rem 1rem; }
.card > .card-header:has(+ .row) h4 { display: inline; font-size: 1.05rem; margin-right: .55rem !important; }
.card > .card-header:has(+ .row) h4 + small { display: inline; font-size: .8rem; }
#search-results { background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); overflow: hidden; }
#search-results .list-group-item { background: var(--bs-body-bg); }
body:has(.pp-pane) .pp-pane { min-height: 620px; }
body:has(.pp-pane) .pp-pane.d-flex.flex-column > .border-top { order: 2; background: var(--bs-body-bg); }
body:has(.pp-pane) .pp-pane.d-flex.flex-column > .pp-scroll { order: 3; }
body:has(.pp-pane) .pp-chat-placeholder-tools .btn { min-width: 2.35rem; }
@media (max-width: 991.98px) { body:has(.pp-pane) .pp-pane { min-height: 0; } }
/* SIM-only action in each public-domain submenu. */
.menu-horizontal .menu-inner > .pp-sim-action-item {
  margin-inline-start: auto;
}
.menu-horizontal .pp-sim-action-link {
  background: #b65660 !important;
  color: #fff !important;
  border-radius: .375rem;
}
.menu-horizontal .pp-sim-action-link:hover,
.menu-horizontal .pp-sim-action-item.active > .pp-sim-action-link {
  background: #8f3741 !important;
  color: #fff !important;
}
.menu-horizontal .pp-sim-action-link .menu-icon {
  color: inherit !important;
}
.pp-sim-action-mobile {
  background: #b65660 !important;
  border-color: #8f3741 !important;
  color: #fff !important;
}

/* Selected/current interactive controls use the darker active green. */
:is(
  .btn.active:not(.disabled):not(:disabled):not([aria-disabled='true']),
  .btn[aria-pressed='true']:not(.disabled):not(:disabled):not([aria-disabled='true']),
  .btn[aria-current='page']:not(.disabled):not(:disabled):not([aria-disabled='true']),
  .btn[aria-selected='true']:not(.disabled):not(:disabled):not([aria-disabled='true']),
  .btn-check:checked:not(:disabled) + .btn:not(.disabled):not(:disabled),
  .nav-link.active:not(.disabled):not([aria-disabled='true']),
  .nav-link[aria-current='page']:not(.disabled):not([aria-disabled='true']),
  .nav-link[aria-selected='true']:not(.disabled):not([aria-disabled='true']),
  .dropdown-item.active:not(.disabled):not([aria-disabled='true']),
  a.list-group-item-action.active:not(.disabled):not([aria-disabled='true']),
  button.list-group-item-action.active:not(.disabled):not(:disabled):not([aria-disabled='true']),
  a.list-group-item.pp-leaf-active:not(.disabled):not([aria-disabled='true']),
  button.list-group-item.pp-leaf-active:not(.disabled):not(:disabled):not([aria-disabled='true']),
  .menu-item.active > .menu-link:not(.disabled):not([aria-disabled='true'])
) {
  background-color: #34947d  !important;
  background-image: none !important;
  border-color: #295b2a  !important;
  color: #fff !important;
}
:is(
  .btn.active,
  .btn[aria-pressed='true'],
  .btn[aria-current='page'],
  .btn[aria-selected='true'],
  .btn-check:checked:not(:disabled) + .btn,
  .nav-link.active,
  .nav-link[aria-current='page'],
  .nav-link[aria-selected='true'],
  .dropdown-item.active,
  a.list-group-item-action.active,
  button.list-group-item-action.active,
  a.list-group-item.pp-leaf-active,
  button.list-group-item.pp-leaf-active,
  .menu-item.active > .menu-link
) :is(i, .icon-base, .menu-icon, .text-body-secondary, .text-muted) {
  color: #fff !important;
}

/* The My Office leaf selector is intentionally specific enough to supersede
   its light/dark sidebar theme rules without affecting inactive links. */
[data-bs-theme] body.pp-workspace-page .pp-myoffice-sidebar :is(a, button).list-group-item.pp-leaf-active {
  background-color: #229E87 !important;
  background-image: none !important;
  border-color: #229E87 !important;
  color: #fff !important;
}

/* Module discovery is a brand action, not a semantic success message. */
.btn.pp-myoffice-modules-link,
.btn.pp-myoffice-modules-link:hover,
.btn.pp-myoffice-modules-link:focus {
  background-color: #229E87 !important;
  border-color: #229E87 !important;
  color: #fff !important;
}
.btn.pp-myoffice-modules-link :is(i, .icon-base) {
  color: #fff !important;
}

/* Existing event-create and team-invite actions share the established brand fill. */
.pp-brand-create-action:not(:disabled):not(.disabled),
.pp-brand-create-action:not(:disabled):not(.disabled):hover,
.pp-brand-create-action:not(:disabled):not(.disabled):focus {
  background-color: #229E87 !important;
  border-color: #229E87 !important;
  color: #fff !important;
}
.pp-brand-create-action:not(:disabled):not(.disabled) :is(i, .icon-base) {
  color: #fff !important;
}

/* Only the dashboard's visible white action controls use the lighter brand fill. */
.pp-dashboard-light-action:not(:disabled):not(.disabled) {
  background-color: #3DAA95 !important;
  border-color: #3DAA95 !important;
  color: #fff !important;
}
.pp-dashboard-light-action:not(:disabled):not(.disabled):hover {
  background-color: color-mix(in srgb, #3DAA95 88%, #fff 12%) !important;
  border-color: color-mix(in srgb, #3DAA95 88%, #fff 12%) !important;
  color: #20f803 !important;
}
.pp-dashboard-light-action:not(:disabled):not(.disabled):active {
  background-color: #229E87 !important;
  border-color: #229E87 !important;
  color: #fff !important;
}
.pp-dashboard-light-action:not(:disabled):not(.disabled) :is(i, .icon-base) {
  color: inherit !important;
}

/* Public category submenu uses the same active/inactive button palette as the
   primary navigation without changing its routes or dropdown behavior. */
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item > .menu-link,
.pp-category-button-row > .btn,
.pp-buyer-order-filters > .btn {
  padding: .317rem .875rem !important;
  border-radius: .25rem !important;
  font-size: .8125rem !important;
  line-height: 1.375 !important;
}
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item > .menu-link .menu-icon {
  inline-size: 1.125rem !important;
  block-size: 1.125rem !important;
  font-size: 1.125rem !important;
}
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item:not(.active) > .menu-link,
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item:not(.active) > .menu-link:hover,
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item:not(.active) > .menu-link:focus,
.pp-category-button-row > .btn-label-secondary,
.pp-category-button-row > .btn-label-secondary:hover,
.pp-category-button-row > .btn-label-secondary:focus,
.pp-buyer-order-filters > .btn-label-secondary,
.pp-buyer-order-filters > .btn-label-secondary:hover,
.pp-buyer-order-filters > .btn-label-secondary:focus {
  background-color: #cff2d0de !important;
  background-image: none !important;
  border: 1px solid #d5f0e0 !important;
  color: #007F46 !important;
}
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item:not(.active) > .menu-link :is(i, .icon-base, .menu-icon),
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item:not(.active) > .menu-link :is(i, .icon-base, .menu-icon)::before {
  color: inherit !important;
}
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link,
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item.active.open > .menu-link,
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link:hover,
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link:focus,
.pp-category-button-row > .btn-success,
.pp-category-button-row > .btn-success:hover,
.pp-category-button-row > .btn-success:focus,
.pp-buyer-order-filters > .btn-success,
.pp-buyer-order-filters > .btn-success:hover,
.pp-buyer-order-filters > .btn-success:focus {
  background-color: #0AA14C !important;
  background-image: none !important;
  border: 1px solid #0AA14C !important;
  color: #fff !important;
}
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link :is(i, .icon-base, .menu-icon),
#layout-menu.layout-menu-horizontal .menu-inner > .menu-item.active > .menu-link :is(i, .icon-base, .menu-icon)::before {
  color: #fff !important;
}
.pp-category-button-row,
.pp-buyer-order-filters {
  gap: .375rem !important;
}
.pp-category-button-row > .btn:focus-visible,
.pp-buyer-order-filters > .btn:focus-visible {
  outline: 2px solid #0AA14C;
  outline-offset: 2px;
  box-shadow: none !important;
}
.pp-mobile-submenu .btn-label-secondary,
.pp-mobile-submenu .btn-label-secondary:hover,
.pp-mobile-submenu .btn-label-secondary:focus {
  background-color: #cff2d0de !important;
  background-image: none !important;
  border-color: #d5f0e0 !important;
  color: #007F46 !important;
}
.pp-mobile-submenu .btn-primary,
.pp-mobile-submenu .btn-primary:hover,
.pp-mobile-submenu .btn-primary:focus {
  background-color: #0AA14C !important;
  background-image: none !important;
  border-color: #0AA14C !important;
  color: #fff !important;
}
.pp-mobile-submenu :is(.btn-label-secondary, .btn-primary) :is(i, .icon-base) {
  color: inherit !important;
}


/* Canonical horizontal module tabs: Dashboard Business Health. */
html[data-template] body .layout-wrapper .content-wrapper .nav.nav-pills:not(.flex-column) :is(.nav-link.active, .btn.active, .btn.btn-primary),
html[data-template] body .layout-wrapper .content-wrapper .nav.nav-tabs:not(.flex-column) :is(.nav-link.active, .btn.active, .btn.btn-primary),
html[data-template] body .layout-wrapper .content-wrapper [class*=pp-][class*=-tabs] :is(.btn.btn-primary, .nav-link.active),
html[data-template] body .layout-wrapper .content-wrapper [role=tablist] :is(.btn[aria-selected=true], .btn[aria-pressed=true]) {
  background-color: #0aa14c !important;
  border-color: #0aa14c !important;
  color: #fff !important;
}
html[data-template] body .layout-wrapper .content-wrapper .nav.nav-pills:not(.flex-column) :is(.nav-link, .btn),
html[data-template] body .layout-wrapper .content-wrapper [class*=pp-][class*=-tabs] :is(.nav-link, .btn) {
  font-size: .8125rem;
  padding: .375rem .75rem;
  border-radius: .375rem;
  font-weight: 500;
}
html[data-template] body .layout-wrapper .content-wrapper .nav.nav-pills:not(.flex-column) :is(.nav-link, .btn):focus-visible,
html[data-template] body .layout-wrapper .content-wrapper .nav.nav-tabs:not(.flex-column) :is(.nav-link, .btn):focus-visible,
html[data-template] body .layout-wrapper .content-wrapper [class*=pp-][class*=-tabs] :is(.nav-link, .btn):focus-visible {
  outline: 2px solid #0aa14c !important;
  outline-offset: 2px;
  box-shadow: none !important;
}

/* Account settings tabs (Account, Public handles, Security, Billing & Plans, Notifications):
   the selected tab uses the primary green, same as the Upload button on those pages. */
html[data-template] body .layout-wrapper .content-wrapper .nav.nav-pills.pp-account-settings-nav .nav-link.active {
  background-color: #4fa651 !important;
  border-color: #4fa651 !important;
  color: #fff !important;
}

/* Business profile section bar (Featured / Gallery / Reviews / Contact ...) matches the
   category submenu under the top bar: same bar height, button size, colours and spacing. */
.pp-biz-actionbar { box-shadow: none !important; }
[data-bs-theme='light'] .pp-biz-actionbar { background: #fff !important; }
.pp-biz-actionbar > .container-xxl > div { height: 54px !important; }
.pp-biz-actionbar .nav.nav-pills { gap: .375rem !important; }
html body .pp-biz-actionbar .nav.nav-pills .nav-link {
  display: inline-flex; align-items: center; white-space: nowrap;
  padding: .317rem .875rem !important;
  border-radius: .25rem !important;
  font-size: .8125rem !important;
  line-height: 1.375 !important;
  font-weight: 400 !important;
  background-color: #cff2d0de !important;
  background-image: none !important;
  border: 1px solid #d5f0e0 !important;
  color: #007F46 !important;
  box-shadow: none !important;
}
html body .pp-biz-actionbar .nav.nav-pills .nav-link .icon-base {
  font-size: 1.125rem !important; inline-size: 1.125rem; block-size: 1.125rem;
  margin-inline-end: .5rem !important; color: inherit !important;
}
html body .pp-biz-actionbar .nav.nav-pills .nav-link.active,
html body .pp-biz-actionbar .nav.nav-pills .nav-link.active:hover,
html body .pp-biz-actionbar .nav.nav-pills .nav-link.active:focus {
  background-color: #0AA14C !important;
  border-color: #0AA14C !important;
  color: #fff !important;
  font-weight: 500 !important;
}
html body .pp-biz-actionbar .nav.nav-pills .nav-link:focus-visible { outline: 2px solid #0AA14C; outline-offset: 2px; }