@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  --background: 240 20% 99%;
  --foreground: 234 40% 14%;

  --card: 0 0% 100%;
  --card-foreground: 234 40% 14%;

  --popover: 0 0% 100%;
  --popover-foreground: 234 40% 14%;

  --primary: 252 85% 60%;
  --primary-foreground: 0 0% 100%;

  --secondary: #fff;
  --secondary-foreground: 234 40% 14%;

  --muted: 240 15% 95%;
  --muted-foreground: 234 10% 48%;

  --accent: 220 90% 56%;
  --accent-foreground: 0 0% 100%;

  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;

  --border: 240 12% 91%;
  --input: 240 12% 91%;
  --ring: 252 85% 60%;

  --radius: 0.25rem;

  --gradient-primary: linear-gradient(
    135deg,
    hsl(252 85% 60%),
    hsl(220 90% 56%)
  );
  --gradient-hero: linear-gradient(
    135deg,
    hsl(252 85% 12%),
    hsl(234 60% 18%),
    hsl(220 70% 22%)
  );
  --gradient-card-border: linear-gradient(
    135deg,
    hsl(252 85% 60%),
    hsl(220 90% 56%)
  );
  --gradient-cta: linear-gradient(135deg, hsl(252 85% 55%), hsl(280 80% 55%));
  --shadow-card: 0 4px 24px -4px hsl(252 85% 60% / 0.1);
  --shadow-card-hover: 0 12px 40px -8px hsl(252 85% 60% / 0.2);
  --shadow-btn: 0 4px 16px -4px hsl(252 85% 60% / 0.4);

  --sidebar-background: 0 0% 98%;
  --sidebar-foreground: 240 5.3% 26.1%;
  --sidebar-primary: 240 5.9% 10%;
  --sidebar-primary-foreground: 0 0% 98%;
  --sidebar-accent: 240 4.8% 95.9%;
  --sidebar-accent-foreground: 240 5.9% 10%;
  --sidebar-border: 220 13% 91%;
  --sidebar-ring: 217.2 91.2% 59.8%;
}

body.primary-bg-color {
  font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
}

h1,
h2,
h3,
h4,
h5,
h6,
.card-title,
.panel-title {
  color: hsl(var(--foreground));
  font-weight: 700;
}

a {
  color: hsl(var(--accent));
}

a:hover {
  color: hsl(var(--primary));
  text-decoration: none;
}

header.header {
  background: var(--gradient-hero);
  border-bottom: 1px solid hsl(var(--border));
  box-shadow: 0 10px 30px hsl(234 40% 12% / 0.24);
}

header.header .topbar {
  background: hsl(234 35% 10% / 0.72);
  border-bottom: 1px solid hsl(0 0% 100% / 0.08);
}

header.header .navbar a,
header.header .topbar .btn,
header.header .topbar .active-client .input-group-text,
header.header .topbar .active-client .btn {
  color: #000000;
}

header.header .toolbar .nav-link,
header.header .search {
  border: 1px solid hsl(0 0% 100% / 0.18);
  background: hsl(0 0% 100% / 0.08);
  backdrop-filter: blur(4px);
}

header.header .toolbar .nav-link:hover,
header.header .search:focus-within {
  border-color: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
}

header.header .search .btn,
header.header .search .form-control,
header.header .search .form-control::placeholder {
  color: hsl(0 0% 100% / 0.8);
  background: transparent;
}

header.header .main-navbar-wrapper .navbar-collapse {
  background: hsl(0 0% 100% / 0.06);
  border: 1px solid hsl(0 0% 100% / 0.1);
  border-radius: calc(var(--radius) + 0.2rem);
}

header.header .dropdown-menu {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}

.master-breadcrumb {
  background: transparent;
  border-bottom: 0;
  padding: 0.7rem 0 0.35rem;
}

.master-breadcrumb .breadcrumb {
  margin: 0;
  padding: 0.62rem 0.9rem;
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: calc(var(--radius) - 0.1rem);
  box-shadow: 0 4px 18px hsl(240 25% 20% / 0.05);
  color: hsl(var(--muted-foreground));
}

.master-breadcrumb .breadcrumb-item {
  font-size: 0.86rem;
  font-weight: 500;
}

.master-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: ">";
  color: hsl(var(--muted-foreground));
  padding-right: 0.45rem;
}

.master-breadcrumb .breadcrumb-item a {
  color: hsl(var(--muted-foreground));
  transition: color 0.2s ease;
}

.master-breadcrumb .breadcrumb-item a:hover {
  color: hsl(var(--primary));
  text-decoration: none;
}

.master-breadcrumb .breadcrumb-item.active {
  color: hsl(var(--foreground));
  font-weight: 700;
}

@media (max-width: 767.98px) {
  .master-breadcrumb {
    padding-top: 0.45rem;
  }

  .master-breadcrumb .breadcrumb {
    padding: 0.5rem 0.7rem;
    font-size: 0.8rem;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }
}

#main-body {
  padding-top: 1.25rem;
}

.card,
.panel,
.mc-promo-manage,
.mc-promo-login,
.table-container,
.domain-checker-result-headline {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  overflow: hidden;
}

.card:hover,
.panel:hover,
.mc-promo-manage:hover,
.mc-promo-login:hover {
  box-shadow: var(--shadow-card-hover);
}

.card-header,
.panel-heading,
.table thead th {
  background: hsl(var(--secondary));
  border-color: hsl(var(--border));
  color: hsl(var(--foreground));
}

.list-group-item {
  border-color: hsl(var(--border));
}

.list-group-item.active,
.sidebar .list-group-item.active,
.sidebar .list-group-item.active:hover,
.sidebar .list-group-item.active:focus {
  background: var(--gradient-primary);
  border-color: transparent;
  color: hsl(var(--primary-foreground));
}

.sidebar .card,
.sidebar .mc-promo-manage,
.sidebar .mc-promo-login {
  background: hsl(var(--sidebar-background));
  border-color: hsl(var(--sidebar-border));
}

.sidebar .list-group-item,
.sidebar .list-group-item .badge {
  background: hsl(var(--sidebar-background));
  color: hsl(var(--sidebar-foreground));
}

.sidebar .list-group-item:hover {
  background: hsl(var(--sidebar-accent));
  color: hsl(var(--sidebar-accent-foreground));
}

.form-control,
.custom-select,
.input-group-text {
  border: 1px solid hsl(var(--input));
  border-radius: calc(var(--radius) - 0.2rem);
}

.custom-select:focus,
.btn:focus,
.btn.focus {
  border-color: hsl(var(--ring));
  box-shadow: 0 0 0 0.2rem hsl(var(--ring) / 0.22);
}

.btn {
  border-radius: 999px;
  transition: 0.25s ease;
}

.btn-primary,
.btn-outline-primary:hover,
.pagination .page-item.active .page-link,
.badge-info,
.bg-primary {
  border: 0;
  background: var(--gradient-primary);
  color: hsl(var(--primary-foreground));
  box-shadow: var(--shadow-btn);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
  filter: brightness(1.04);
}

.btn-outline-primary {
  border-color: hsl(var(--primary));
  color: hsl(var(--primary));
}

.btn-default {
  border-color: hsl(var(--border));
  background: hsl(var(--card));
  color: hsl(var(--foreground));
}

.btn-default:hover {
  background: hsl(var(--secondary));
}

.table,
.table td,
.table th {
  border-color: hsl(var(--border));
}

.table-hover tbody tr:hover {
  background: hsl(var(--secondary));
}

.alert-info {
  background: hsl(220 90% 56% / 0.1);
  border-color: hsl(220 90% 56% / 0.25);
  color: hsl(var(--foreground));
}

.alert-success {
  background: hsl(140 65% 40% / 0.1);
  border-color: hsl(140 65% 40% / 0.25);
}

.alert-danger,
.alert-warning,
.status-unpaid,
.status-cancelled,
.status-fraud {
  border-color: hsl(var(--destructive) / 0.25);
}

.status-active,
.status-paid,
.status-completed,
.status-open,
.status-accepted {
  background: hsl(142 70% 38%);
}

.status-pending,
.status-unpaid,
.status-cancelled,
.status-terminated,
.status-fraud {
  background: hsl(var(--destructive));
}

.home-domain-search {
  background: var(--gradient-hero);
  border-top: 1px solid hsl(0 0% 100% / 0.09);
  border-bottom: 1px solid hsl(0 0% 100% / 0.09);
  color: hsl(0 0% 100%);
}

.home-domain-search {
  background: var(--gradient-hero);
  border-top: 1px solid hsl(0 0% 100% / 0.09);
  border-bottom: 1px solid hsl(0 0% 100% / 0.09);
  color: hsl(0 0% 100%);
}

.home-domain-search .input-group-wrapper {
  border-radius: 999px;
  border: 1px solid hsl(0 0% 100% / 0.22);
  background: hsl(0 0% 100% / 0.08);
  box-shadow: none;
}

.home-domain-search .input-group-wrapper .form-control,
.home-domain-search .input-group-wrapper .form-control::placeholder {
  background: transparent;
  color: hsl(0 0% 100% / 0.8);
}

.home-domain-search .input-group-wrapper .input-group-append .btn {
  border-radius: 999px !important;
  min-height: 38px;
  margin-left: 0.35rem !important;
  padding-left: 1rem;
  padding-right: 1rem;
  box-shadow: none;
}

.home-domain-search .input-group-wrapper .input-group-append .btn-success {
  background: hsl(0 0% 100% / 0.16);
  border: 1px solid hsl(0 0% 100% / 0.28);
  color: #fff;
}

.home-domain-search
  .input-group-wrapper
  .input-group-append
  .btn-success:hover {
  background: hsl(0 0% 100% / 0.24);
}

.home-domain-search .row.d-sm-none .btn {
  border-radius: 999px;
  min-height: 40px;
}

.home-domain-search .tld-logos {
  color: hsl(0 0% 100% / 0.75);
}

.home-domain-search h2 {
  color: #fff;
}

.action-icon-btns a {
  border: 1px solid hsl(var(--border));
  border-top-width: 3px;
  border-radius: var(--radius);
  background: hsl(var(--card));
  box-shadow: var(--shadow-card);
}

.action-icon-btns a .ico-container i {
  color: hsl(var(--primary));
}

/* .action-icon-btns a:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-card-hover);
    color: hsl(var(--foreground));
} */

.client-home-cards .card-header,
.client-home-cards .card-footer {
  background: #fff;
}

.ph-client-stats .tile.ph-stat-tile {
  display: block;
  padding: 1rem 1.1rem;
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  background: linear-gradient(180deg, hsl(var(--card)) 0%, #fff 100%);
  color: hsl(var(--foreground));
  box-shadow: 0 10px 24px -18px hsla(var(--primary), 0.45);
  min-height: 122px;
  transition:
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.22s ease;
}

.ph-client-stats .tile.ph-stat-tile .highlight {
  display: block;
  width: 48px;
  height: 3px;
  margin: 0 0 0.75rem;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    hsl(var(--primary)) 0%,
    hsl(var(--ring)) 100%
  );
  opacity: 0.95;
}

.ph-client-stats .tile.ph-stat-tile i {
  font-size: 1.1rem;
  color: hsl(var(--primary));
  margin-bottom: 0.6rem;
  display: inline-block;
}

.ph-client-stats .tile.ph-stat-tile .stat {
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1.1;
  color: hsl(var(--foreground));
}

.ph-client-stats .tile.ph-stat-tile .title {
  margin-top: 0.35rem;
  font-size: 0.8rem;
  color: hsl(var(--muted-foreground));
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
}

.ph-client-stats .tile.ph-stat-tile:hover {
  border-color: hsl(var(--ring));
  background: linear-gradient(
    180deg,
    hsl(var(--card)) 0%,
    hsl(var(--secondary)) 100%
  );
  box-shadow: 0 18px 30px -22px hsla(var(--primary), 0.65);
  transform: translateY(-2px);
  text-decoration: none;
}

@media (max-width: 767.98px) {
  .ph-client-stats .tile.ph-stat-tile {
    min-height: 106px;
    padding: 0.9rem 0.95rem;
  }

  .ph-client-stats .tile.ph-stat-tile .stat {
    font-size: 1.45rem;
  }
}

.modal .modal-content {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  box-shadow: var(--shadow-card-hover);
}

.modal .modal-header {
  background: hsl(var(--secondary));
}

.modal-localisation .modal-content {
  background: var(--gradient-hero);
}

.modal-localisation .item-selector .item {
  border: 1px solid hsl(0 0% 100% / 0.25);
  border-radius: calc(var(--radius) - 0.25rem);
  color: hsl(0 0% 100% / 0.9);
}

.modal-localisation .item-selector .item:hover,
.modal-localisation .item-selector .item.active {
  background: hsl(0 0% 100% / 0.18);
  border-color: hsl(0 0% 100% / 0.45);
  color: #fff;
}

footer.footer {
  background: var(--gradient-hero);
  border-top: 1px solid hsl(0 0% 100% / 0.08);
}

footer.footer .nav-link,
footer.footer .copyright,
footer.footer .notices {
  color: hsl(0 0% 100% / 0.85);
}

footer.footer .btn {
  background: hsl(0 0% 100% / 0.12);
  border: 1px solid hsl(0 0% 100% / 0.2);
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#main-body .card,
#main-body .panel,
#main-body .mc-promo-manage,
#main-body .mc-promo-login,
#main-body .action-icon-btns > div {
  animation: fadeUp 0.45s ease both;
}

@media (max-width: 991.98px) {
  header.header .main-navbar-wrapper .navbar-collapse {
    margin-bottom: 0.65rem;
  }

  .home-domain-search .clearfix {
    padding: 5rem 0 !important;
  }
}

.ph-homepage {
  padding: 1.4rem 0 2.5rem;
}

.ph-section {
  margin: 0 0 2.1rem;
}

.ph-section-intro {
  padding: 0.5rem 0 0.75rem;
}

.ph-kicker {
  display: inline-block;
  margin-bottom: 0.45rem;
  padding: 0.2rem 0.75rem;
  border-radius: 999px;
  background: hsl(var(--primary) / 0.14);
  color: hsl(var(--primary));
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ph-title {
  margin-bottom: 0.5rem;
  font-size: 2rem;
  line-height: 1.15;
}

.ph-subtitle {
  max-width: 760px;
  margin: 0 auto;
  color: hsl(var(--muted-foreground));
}

.ph-feature-grid {
  margin-top: 1.45rem;
}

.ph-feature-card,
.ph-solution-card {
  height: 100%;
  padding: 1.2rem 1rem;
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  text-align: left;
}

.ph-feature-card h3,
.ph-solution-card h3 {
  margin: 0.7rem 0 0.5rem;
  font-size: 1.05rem;
}

.ph-feature-card p,
.ph-solution-card p,
.ph-plan-text {
  margin: 0;
  color: hsl(var(--muted-foreground));
  font-size: 0.92rem;
}

.ph-feature-icon,
.ph-solution-icon {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 0.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gradient-primary);
  color: #fff;
}

.ph-plan-card .card-body {
  padding: 1.2rem;
}

.ph-plan-card .card-title {
  margin-bottom: 0.55rem;
  font-size: 1.16rem;
}

.ph-solution-card .btn {
  margin-top: 1rem;
}

.ph-faq-section .accordion .card {
  overflow: hidden;
}

.ph-faq-section .card-header {
  padding: 0;
}

.ph-faq-section .btn-link {
  color: hsl(var(--foreground));
  text-decoration: none;
  padding: 0.85rem 1rem;
}

.ph-faq-section .btn-link:hover,
.ph-faq-section .btn-link:focus {
  text-decoration: none;
  background: hsl(var(--secondary));
}

@media (max-width: 767.98px) {
  .ph-homepage {
    padding-top: 0.8rem;
  }

  .ph-title {
    font-size: 1.55rem;
  }

  .ph-subtitle {
    font-size: 0.95rem;
  }

  .ph-feature-card,
  .ph-solution-card,
  .ph-plan-card .card-body {
    padding: 1rem;
  }
}

/* Color consistency layer for legacy WHMCS utility classes */
.text-muted,
.text-secondary,
small,
.small {
  color: hsl(var(--muted-foreground)) !important;
}

.badge-primary,
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active {
  color: hsl(var(--primary-foreground)) !important;
  background: var(--gradient-primary) !important;
  border-color: transparent !important;
}

.bg-light,
.table-light,
.list-group-item-light,
.well,
.tile,
.panel-default > .panel-heading {
  background-color: hsl(var(--secondary)) !important;
  color: hsl(var(--foreground)) !important;
}

.bg-white,
.dropdown-menu,
.popover,
.list-group-item,
.table,
.panel,
.card {
  color: hsl(var(--foreground));
}

.dropdown-item.active,
.dropdown-item:active {
  background: var(--gradient-primary) !important;
  color: hsl(var(--primary-foreground)) !important;
}

.badge-secondary,
.badge-light {
  background: hsl(var(--muted));
  color: hsl(var(--muted-foreground));
}

.badge-success,
.label-success {
  background: hsl(142 70% 38%) !important;
  color: #fff !important;
}

.badge-danger,
.label-danger,
.badge-warning,
.label-warning,
.badge-important {
  background: hsl(var(--destructive)) !important;
  color: #fff !important;
}

.alert,
.network-issue-alert,
.verification-banner {
  border-radius: calc(var(--radius) - 0.2rem);
  border-color: hsl(var(--border));
}

.alert-warning {
  background: hsl(var(--destructive) / 0.08) !important;
  color: hsl(var(--foreground)) !important;
}

.alert-danger {
  background: hsl(var(--destructive) / 0.1) !important;
  color: hsl(var(--foreground)) !important;
}

.alert-success {
  color: hsl(var(--foreground)) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: hsl(var(--secondary) / 0.58);
}

.pagination .page-link {
  color: hsl(var(--primary));
  border-color: hsl(var(--border));
  background: hsl(var(--card));
}

.pagination .page-link:hover {
  color: hsl(var(--accent));
  background: hsl(var(--secondary));
}

.page-item.disabled .page-link {
  color: hsl(var(--muted-foreground));
  background: hsl(var(--muted));
  border-color: hsl(var(--border));
}

/* .card-accent-gold,
.card-accent-green,
.card-accent-red,
.card-accent-blue,
.card-accent-orange,
.card-accent-pink,
.card-accent-purple,
.card-accent-lime,
.card-accent-magenta,
.card-accent-teal,
.card-accent-turquoise,
.card-accent-emerald,
.card-accent-amethyst,
.card-accent-wet-asphalt,
.card-accent-midnight-blue,
.card-accent-sun-flower,
.card-accent-pomegranate,
.card-accent-silver,
.card-accent-asbestos,
.card-accent-brand-cpanel-orange,
.card-accent-brand-xovinow-blue {
    border-top: 3px solid hsl(var(--primary)) !important;
} */

.bg-color-gold,
.bg-color-green,
.bg-color-red,
.bg-color-blue,
.bg-color-orange,
.bg-color-pink,
.bg-color-purple,
.bg-color-lime,
.bg-color-magenta,
.bg-color-teal,
.bg-color-turquoise,
.bg-color-emerald,
.bg-color-amethyst,
.bg-color-wet-asphalt,
.bg-color-midnight-blue,
.bg-color-sun-flower,
.bg-color-pomegranate,
.bg-color-silver,
.bg-color-asbestos,
.label-default,
.status-onhold,
.status-payment-pending,
.status-delivered {
  background: var(--gradient-primary) !important;
  color: #fff !important;
}

/* Domain pricing + table list consistency */
.domain-pricing .featured-tld {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}

.domain-pricing .featured-tld .img-container {
  background: hsl(var(--secondary));
  border-bottom: 1px solid hsl(var(--border));
}

.domain-pricing .featured-tld .price,
.domain-pricing .featured-tld .price.blog,
.domain-pricing .featured-tld .price.club,
.domain-pricing .featured-tld .price.com,
.domain-pricing .featured-tld .price.couk,
.domain-pricing .featured-tld .price.host,
.domain-pricing .featured-tld .price.live,
.domain-pricing .featured-tld .price.name,
.domain-pricing .featured-tld .price.net,
.domain-pricing .featured-tld .price.online,
.domain-pricing .featured-tld .price.rocks,
.domain-pricing .featured-tld .price.shop,
.domain-pricing .featured-tld .price.social,
.domain-pricing .featured-tld .price.store,
.domain-pricing .featured-tld .price.tech,
.domain-pricing .featured-tld .price.tv,
.domain-pricing .featured-tld .price.website {
  background: var(--gradient-primary) !important;
  color: #fff;
}

.tld-filters a.badge {
  border: 1px solid hsl(var(--border));
  background: hsl(var(--muted));
  color: hsl(var(--muted-foreground));
}

.tld-filters a.badge.badge-success {
  background: var(--gradient-primary);
  border-color: transparent;
  color: #fff;
}

.dataTables_wrapper table.table-list thead th,
table.table-list thead th {
  background: hsl(var(--secondary));
  color: hsl(var(--foreground));
  border-color: hsl(var(--border));
}

.dataTables_wrapper table.table-list tbody td,
table.table-list tbody td {
  border-color: hsl(var(--border));
}

.table-list > tbody > tr:hover,
.table-list > tbody > tr:hover > td {
  background: hsl(var(--secondary));
}

/* Support + KB + announcements consistency */
.announcements .announcement article,
.kb-category,
.kb-article-item,
.view-ticket .ticket-reply,
.view-ticket .attachments,
.ticketfeedbackstaffcont {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: calc(var(--radius) - 0.15rem);
}

.kb-category a,
.kb-article-item {
  color: hsl(var(--foreground));
}

.kb-category a:hover,
.kb-article-item:hover {
  background: hsl(var(--secondary));
}

.view-ticket .posted-by,
.view-ticket .requestor-badge {
  color: hsl(var(--muted-foreground));
}

.ticket-reply .rating span.star:before,
.ticket-reply .rating-done span.star:before {
  color: hsl(var(--primary));
}

/* Invoice + quote page consistency */
body .invoice-container {
  background: hsl(var(--background));
  color: hsl(var(--foreground));
}

.invoice-container .invoice-header,
.invoice-container .invoice-status,
.invoice-container .transactions-container,
.invoice-container .card,
.invoice-container .panel {
  color: hsl(var(--foreground));
}

.invoice-container .invoice-status span,
.invoice-container .invoice-status .paid,
.invoice-container .invoice-status .draft,
.invoice-container .invoice-status .unpaid,
.invoice-container .invoice-status .cancelled,
.invoice-container .invoice-status .collections,
.invoice-container .invoice-status .refunded {
  border-radius: 999px;
  border: 1px solid hsl(var(--border));
  padding: 0.28rem 0.8rem;
}

.invoice-container .invoice-status .paid {
  background: hsl(142 70% 38% / 0.14);
  border-color: hsl(142 70% 38% / 0.36);
  color: hsl(142 70% 28%);
}

.invoice-container .invoice-status .unpaid,
.invoice-container .invoice-status .cancelled,
.invoice-container .invoice-status .collections {
  background: hsl(var(--destructive) / 0.12);
  border-color: hsl(var(--destructive) / 0.36);
  color: hsl(0 72% 38%);
}

.invoice-container .invoice-status .draft,
.invoice-container .invoice-status .refunded {
  background: hsl(var(--secondary));
  color: hsl(var(--foreground));
}

.invoice-container .table,
.invoice-container .table td,
.invoice-container .table th,
.invoice-summary-table td {
  border-color: hsl(var(--border));
}

.invoice-container .total-row,
tr.masspay-total td,
tr.masspay-invoice-detail td {
  background: hsl(var(--secondary));
}

/* Auth pages consistency */
.login-form .card,
#registration .card,
.password-reset-container .card,
.two-factor-container .card,
.user-profile .card,
.user-security .card {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}

.login-form .card-footer,
#registration .card-footer {
  background: hsl(var(--secondary));
  border-top: 1px solid hsl(var(--border));
}

/* Custom top navigation */
header.header.ph-header {
  background: #fff;
  border-bottom: 0;
  box-shadow: none;
}

.ph-navbar {
  min-height: 74px;
  display: flex;
  align-items: center;
}

.ph-logo-section {
  min-width: 270px;
  margin-right: 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: hsl(var(--foreground));
  font-weight: 700;
}

.ph-logo-text {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
}

.ph-logo-image {
  max-height: 52px;
  width: auto;
  max-width: 230px;
}

.ph-nav-center .nav-item,
.ph-nav-right .nav-item {
  margin-right: 0.45rem;
}

.ph-navbar .navbar-collapse {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  width: 100%;
}

.ph-navbar .ph-nav-center {
  flex: auto;
  justify-content: end;
  margin-left: 0;
  margin-right: 0;
}

.ph-navbar .ph-nav-right {
  flex: 0 0 auto;
  margin-left: auto;
}

.ph-nav-center .nav-link,
.ph-nav-right .nav-link {
  color: hsl(var(--foreground));
  font-weight: 600;
  padding: 0.75rem 0.85rem;
}

.ph-home-link {
  color: hsl(var(--muted-foreground)) !important;
  padding-left: 0.65rem !important;
  padding-right: 0.65rem !important;
}

.ph-home-link:hover {
  color: hsl(var(--primary)) !important;
}

.ph-nav-center .nav-link:hover,
.ph-nav-center .show > .nav-link,
.ph-nav-right .nav-link:hover {
  color: hsl(var(--primary));
}

.ph-nav-center .dropdown .nav-link {
  border-bottom: 3px solid transparent;
}

.ph-nav-center .dropdown.show .nav-link {
  border-bottom-color: hsl(var(--primary));
}

.ph-nav-btn {
  min-width: 88px;
  border-radius: 0.3rem;
  font-weight: 500;
  box-shadow: none;
}

.ph-nav-btn.btn-light {
  border: 1px solid hsl(var(--border));
  background: #fff;
  color: hsl(var(--foreground));
}

.ph-nav-btn.btn-primary {
  border-radius: 0.3rem;
  box-shadow: none;
}

.ph-cart-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.ph-cart-link .badge {
  font-size: 0.65rem;
  min-width: 1.15rem;
  border-radius: 999px;
  padding: 0.22rem 0.32rem;
  box-shadow: none;
}

.ph-currency-link {
  color: hsl(var(--muted-foreground));
}

.ph-currency-link.btn {
  border: 0;
  background: transparent;
  text-decoration: none;
  box-shadow: none;
}

.ph-currency-form {
  margin: 0;
}

.ph-currency-menu {
  min-width: 120px;
}

.ph-currency-menu .dropdown-item {
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
}

.ph-currency-menu .dropdown-item.active,
.ph-currency-menu .dropdown-item:active {
  background: hsl(var(--secondary)) !important;
  color: hsl(var(--primary)) !important;
}

.ph-nav-hero {
  height: 112px;
  background: linear-gradient(90deg, hsl(266 70% 58%), hsl(263 78% 64%));
}

.ph-menu-list {
  min-width: 310px;
  max-height: 260px;
  overflow-y: auto;
  border: 1px solid hsl(var(--border));
  border-radius: 0;
  padding: 0.35rem;
  box-shadow: 0 8px 28px hsl(240 20% 15% / 0.18);
}

.ph-menu-list .dropdown-item {
  padding: 0.62rem 0.68rem;
  border-radius: 0.2rem;
  font-weight: 500;
  color: hsl(var(--foreground));
}

.ph-menu-list .dropdown-item i {
  margin-right: 0.6rem;
  color: hsl(var(--muted-foreground));
}

.ph-menu-list .dropdown-item:hover,
.ph-menu-list .dropdown-item:focus {
  background: hsl(var(--secondary));
  color: hsl(var(--foreground));
}

@media (max-width: 991.98px) {
  .ph-navbar {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .ph-logo-section {
    min-width: 0;
    margin-right: 0;
  }

  .ph-logo-image {
    max-width: 155px;
    max-height: 40px;
  }

  .ph-navbar .ph-nav-center {
    margin-left: 0;
    margin-right: 0;
    flex: 0 0 auto;
    justify-content: flex-start;
  }

  .ph-nav-center,
  .ph-nav-right {
    margin-top: 0.8rem;
  }

  .ph-nav-right .nav-item {
    margin-right: 0;
    margin-bottom: 0.4rem;
  }

  .ph-nav-btn {
    width: 100%;
  }

  .ph-menu-list {
    min-width: 100%;
    max-height: none;
  }

  .ph-nav-hero {
    height: 78px;
  }
}

/* Final nav contrast overrides */
header.header.ph-header .ph-navbar,
header.header.ph-header .ph-navbar .navbar-collapse {
  background: #fff;
}

header.header.ph-header .navbar a.ph-logo-section,
header.header.ph-header .ph-navbar .ph-nav-center .nav-link,
header.header.ph-header .ph-navbar .ph-nav-right .nav-link,
header.header.ph-header .ph-navbar .ph-currency-link {
  color: hsl(var(--foreground)) !important;
}

header.header.ph-header .ph-navbar .ph-nav-center .nav-link:hover,
header.header.ph-header .ph-navbar .ph-nav-center .show > .nav-link,
header.header.ph-header .ph-navbar .ph-nav-right .nav-link:hover,
header.header.ph-header .ph-navbar .ph-currency-link:hover {
  color: hsl(var(--primary)) !important;
}

header.header.ph-header .ph-navbar .ph-nav-btn.btn-light {
  color: hsl(var(--foreground)) !important;
  background: #fff !important;
}

header.header.ph-header .ph-navbar .ph-nav-btn.btn-primary {
  color: #fff !important;
}

header.header.ph-header .ph-navbar .ph-cart-link,
header.header.ph-header .ph-navbar .ph-cart-link i,
header.header.ph-header .ph-navbar .ph-cart-link span {
  color: hsl(var(--muted-foreground)) !important;
}

header.header.ph-header .ph-navbar .ph-cart-link:hover,
header.header.ph-header .ph-navbar .ph-cart-link:hover i,
header.header.ph-header .ph-navbar .ph-cart-link:hover span {
  color: hsl(var(--primary)) !important;
}

header.header.ph-header .ph-navbar .ph-menu-list {
  background: #fff;
}

header.header.ph-header .ph-navbar .ph-menu-list .dropdown-item {
  color: hsl(var(--foreground)) !important;
}

header.header.ph-header .ph-navbar .ph-menu-list .dropdown-item:hover,
header.header.ph-header .ph-navbar .ph-menu-list .dropdown-item:focus {
  background: hsl(var(--secondary)) !important;
  color: hsl(var(--foreground)) !important;
}

header.header.ph-header .ph-navbar .ph-menu-list .dropdown-item i {
  color: hsl(var(--muted-foreground)) !important;
}

header.header.ph-header .ph-navbar .ph-currency-menu .dropdown-item {
  color: hsl(var(--foreground)) !important;
}

/* Nav vertical alignment fix */
header.header.ph-header .ph-navbar,
header.header.ph-header .ph-navbar .navbar-collapse,
header.header.ph-header .ph-navbar .navbar-nav {
  align-items: center;
}

header.header.ph-header .ph-navbar .ph-nav-center,
header.header.ph-header .ph-navbar .ph-nav-right {
  display: flex;
  align-items: center;
}

header.header.ph-header .ph-navbar .ph-nav-center .nav-item,
header.header.ph-header .ph-navbar .ph-nav-right .nav-item {
  display: flex;
  align-items: center;
}

header.header.ph-header .ph-navbar .ph-nav-center .nav-link,
header.header.ph-header .ph-navbar .ph-nav-right .nav-link,
header.header.ph-header .ph-navbar .ph-nav-btn,
header.header.ph-header .ph-navbar .ph-cart-link,
header.header.ph-header .ph-navbar .ph-currency-link {
  height: 42px;
  display: inline-flex;
  align-items: center;
  line-height: 1;
  padding-top: 0;
  padding-bottom: 0;
}

header.header.ph-header .ph-navbar .ph-nav-btn {
  justify-content: center;
}

header.header.ph-header .ph-navbar .ph-cart-link {
  justify-content: center;
}

header.header.ph-header .ph-navbar .ph-cart-link .badge {
  align-self: center;
  background: hsl(var(--primary)) !important;
  color: #fff !important;
  border: 1px solid hsl(var(--primary));
}

header.header.ph-header .ph-navbar .ph-cart-link:hover .badge {
  background: hsl(var(--accent)) !important;
  color: #fff !important;
  border-color: hsl(var(--accent));
}

header.header.ph-header .ph-navbar .ph-nav-center .dropdown-toggle::after,
header.header.ph-header .ph-navbar .ph-currency-link::after {
  margin-top: 0;
  vertical-align: middle;
}

@media (max-width: 991.98px) {
  header.header.ph-header .ph-navbar .navbar-collapse,
  header.header.ph-header .ph-navbar .ph-nav-center,
  header.header.ph-header .ph-navbar .ph-nav-right {
    align-items: stretch;
  }

  header.header.ph-header .ph-navbar .ph-nav-center .nav-item,
  header.header.ph-header .ph-navbar .ph-nav-right .nav-item {
    display: block;
  }
}

/* Final mobile header responsiveness */
@media (max-width: 991.98px) {
  header.header.ph-header .ph-navbar {
    min-height: 62px;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
  }

  header.header.ph-header .ph-logo-section {
    max-width: calc(100% - 56px);
  }

  header.header.ph-header .ph-logo-text {
    min-height: 34px;
  }

  header.header.ph-header .ph-logo-image {
    max-height: 34px;
    max-width: 145px;
  }

  header.header.ph-header .navbar-toggler {
    border: 1px solid hsl(var(--border));
    border-radius: 0.45rem;
    padding: 0.3rem 0.52rem;
    color: hsl(var(--foreground));
    background: hsl(var(--card));
  }

  header.header.ph-header .navbar-toggler:focus {
    outline: 0;
    box-shadow: 0 0 0 0.18rem hsl(var(--ring) / 0.2);
  }

  header.header.ph-header .ph-navbar .navbar-collapse {
    margin-top: 0.65rem;
    padding: 0.6rem;
    border: 1px solid hsl(var(--border));
    border-radius: calc(var(--radius) - 0.1rem);
    background: hsl(var(--card));
  }

  header.header.ph-header .ph-navbar .ph-nav-center,
  header.header.ph-header .ph-navbar .ph-nav-right {
    width: 100%;
    margin-top: 0;
    display: block;
  }

  header.header.ph-header .ph-navbar .ph-nav-center .nav-item,
  header.header.ph-header .ph-navbar .ph-nav-right .nav-item {
    margin-right: 0;
    margin-bottom: 0.2rem;
  }

  header.header.ph-header .ph-navbar .ph-nav-center .nav-link,
  header.header.ph-header .ph-navbar .ph-nav-right .nav-link,
  header.header.ph-header .ph-navbar .ph-nav-btn,
  header.header.ph-header .ph-navbar .ph-cart-link,
  header.header.ph-header .ph-navbar .ph-currency-link {
    width: 100%;
    min-height: 42px;
    height: auto;
    justify-content: flex-start;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
  }

  header.header.ph-header .ph-navbar .ph-menu-list,
  header.header.ph-header .ph-navbar .ph-currency-menu {
    position: static;
    float: none;
    transform: none !important;
    width: 100%;
    min-width: 100%;
    margin-top: 0.25rem;
    border-radius: 0.4rem;
    box-shadow: none;
  }
}

/* Fix mobile collapse toggle behavior */
header.header.ph-header .ph-navbar .navbar-collapse {
  width: 100%;
  flex: 1 1 auto;
}

@media (max-width: 991.98px) {
  header.header.ph-header .ph-navbar .navbar-collapse {
    display: none !important;
  }

  header.header.ph-header .ph-navbar .navbar-collapse.show {
    display: block !important;
  }
}

@media (min-width: 992px) {
  header.header.ph-header .ph-navbar .navbar-collapse {
    display: flex !important;
    align-items: center;
  }
}