/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

:root {
  --brand-500: #2fbf8a;
  --brand-600: #26a577;
  --brand-700: #229b6b;
  --ink-900: #111827;
  --ink-700: #374151;
  --ink-500: #6b7280;
  --surface-50: #f9fafb;
  --surface-100: #f3f4f6;
  --surface-200: #e5e7eb;
  --surface-900: #111827;
}

body {
  background-color: var(--surface-50);
  color: #4b5563;
}

a {
  color: var(--brand-600);
}
a:hover,
a:focus {
  color: var(--brand-700);
}

/* Typography alignment with website */
h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  color: var(--ink-900);
}

/* Top navigation */
.navbar-main {
  background: linear-gradient(135deg, #f8fffb 0%, #eef8f4 45%, #f4f7fb 100%) !important;
  border-bottom: 1px solid var(--surface-200) !important;
}
.navbar-main li.account {
  background-color: var(--surface-100) !important;
}
.navbar-main .navbar-nav > li > a {
  color: var(--ink-700) !important;
}
.navbar-main .navbar-nav > li > a:hover,
.navbar-main .navbar-nav > li > a:focus,
.navbar-main .navbar-nav > .active > a,
.navbar-main .navbar-nav > .active > a:hover,
.navbar-main .navbar-nav > .active > a:focus,
.navbar-main .navbar-nav > .open > a,
.navbar-main .navbar-nav > .open > a:hover,
.navbar-main .navbar-nav > .open > a:focus {
  color: var(--ink-900) !important;
  background-color: var(--surface-100) !important;
}
.navbar-main .navbar-nav .dropdown-menu > li > a:hover,
.navbar-main .navbar-nav .dropdown-menu > li > a:focus {
  color: var(--ink-900) !important;
  background-color: var(--surface-100) !important;
}

/* Buttons */
.btn-primary,
.btn-success {
  background-color: var(--brand-500);
  border-color: var(--brand-600);
  color: #ffffff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
  background-color: var(--brand-600);
  border-color: var(--brand-700);
  color: #ffffff;
}
.btn-default {
  border-color: var(--surface-200);
}
.btn-default:hover,
.btn-default:focus {
  border-color: var(--brand-500);
  color: var(--ink-900);
}

/* Softer geometry */
.panel,
.panel-heading,
.panel-footer,
.list-group-item,
.well,
.alert,
.dropdown-menu,
.modal-content,
.form-control,
.input-group-addon {
  border-radius: 12px;
}
.panel-heading + .list-group .list-group-item:first-child,
.panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}
.panel-footer + .list-group .list-group-item:last-child,
.panel-footer + .panel-collapse > .list-group .list-group-item:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}
.btn,
.btn-group > .btn,
.btn-group-vertical > .btn {
  border-radius: 10px;
}

/* Accents and highlights */
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  background-color: var(--brand-500);
  border-color: var(--brand-500);
}
a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus {
  background-color: var(--brand-500);
  border-color: var(--brand-500);
}
.label-primary,
.badge {
  background-color: var(--brand-500);
}

.panel.panel-accent-blue,
.panel.panel-accent-teal,
.panel.panel-accent-turquoise,
.panel.panel-accent-emerald {
  border-top-color: var(--brand-500);
}
.bg-color-blue,
.bg-color-teal,
.bg-color-turquoise,
.bg-color-emerald {
  background-color: var(--brand-500);
}

/* Footer */
.footer,
.main-footer,
.footer-wrap,
footer {
  background-color: var(--surface-900);
  color: #ffffff;
}

/* Header gradient (above navbar) */
section#header {
  background: linear-gradient(135deg, #f8fffb 0%, #eef8f4 45%, #f4f7fb 100%);
  border-radius: 12px 12px 0 0;
  border: 1px solid var(--surface-200);
  border-bottom: 0;
}
section#main-menu {
  background: linear-gradient(135deg, #f8fffb 0%, #eef8f4 45%, #f4f7fb 100%);
}

/* Page background fade */
section#main-body {
  background: transparent;
}
section#header .logo-text,
section#header .logo-text:hover,
section#header .logo-text:focus {
  color: var(--ink-900);
}

/* Link + text accents */
a,
.btn-link,
.text-primary,
.text-info {
  color: var(--brand-600);
}
a:hover,
a:focus,
.btn-link:hover,
.btn-link:focus {
  color: var(--brand-700);
}
.label-info,
.badge-info {
  background-color: var(--brand-500);
}

/* Top nav action buttons (login/logout/view cart) */
ul.top-nav > li.primary-action > a.btn,
ul.top-nav > li > a.btn-logged-in-admin {
  background-color: var(--brand-500) !important;
  border-color: var(--brand-600) !important;
  color: #ffffff !important;
}
ul.top-nav > li.primary-action > a.btn:hover,
ul.top-nav > li.primary-action > a.btn:focus,
ul.top-nav > li > a.btn-logged-in-admin:hover,
ul.top-nav > li > a.btn-logged-in-admin:focus {
  background-color: var(--brand-600) !important;
  border-color: var(--brand-700) !important;
  color: #ffffff !important;
}

/* Header-lined titles (e.g., Welcome Back) */
div.header-lined h1 {
  color: var(--ink-900) !important;
  border-bottom-color: var(--surface-200) !important;
}
div.header-lined small {
  color: var(--ink-500) !important;
}
div.header-lined .breadcrumb > .active {
  color: var(--ink-700) !important;
}
/* Welcome Back heading emphasis */
.clientareahome div.header-lined h1,
body.clientareahome div.header-lined h1 {
  color: var(--brand-500) !important;
  font-weight: 700 !important;
}
body.clientarea div.header-lined h1,
body.page-clientarea div.header-lined h1 {
  color: var(--brand-500) !important;
  font-weight: 700 !important;
}

/* Client area tiles: numbers should be black */
.tile .stat {
  color: var(--ink-900) !important;
}
.text-domain {
  color: var(--ink-700) !important;
}

/* Order form product pricing blocks (fix dark box) */
.products .product .pricing,
.products .product .price,
.product .pricing,
.product .price,
.product-pricing,
.product-price,
.product-price .price,
.product-pricing .price,
.product-price .cycle,
.product-pricing .cycle {
  background-color: #ffffff !important;
  color: var(--ink-900) !important;
}
.product .pricing small,
.product-pricing small,
.product-price small,
.product .price small {
  color: var(--ink-700) !important;
}
/* Standard cart specific product footer */
#order-standard_cart .products .product footer {
  background-color: #ffffff !important;
  color: var(--ink-900) !important;
}
#order-standard_cart .products .product div.product-pricing {
  background-color: #ffffff !important;
  color: var(--ink-900) !important;
}

/* Standard cart product styling */
#order-standard_cart .products .product {
  background-color: #ffffff;
}
#order-standard_cart .products .product header {
  background-color: #ffffff !important;
}
#order-standard_cart .products .product:hover {
  border-color: var(--brand-500) !important;
  background-color: #f3f4f6;
  box-shadow: 0 6px 18px rgba(47, 191, 138, 0.18);
}
#order-standard_cart .products .product:hover header,
#order-standard_cart .products .product:hover footer,
#order-standard_cart .products .product:hover div.product-pricing {
  background-color: #f3f4f6 !important;
}
#order-standard_cart .products .product:hover div.product-pricing span.price,
#order-standard_cart .products .product:hover div.product-pricing span.price * {
  background-color: #f3f4f6 !important;
}

/* Standard cart sidebar: subtle green hover only */
#order-standard_cart .cart-sidebar .list-group-item:hover,
#order-standard_cart .secondary-cart-sidebar .list-group-item:hover {
  background-color: #f3fbf7;
  border-color: #e0f2ea;
}

/* Sidebar active + hover text contrast */
.panel-sidebar a.list-group-item.active,
.panel-sidebar a.list-group-item.active:focus,
.panel-sidebar a.list-group-item.active:hover {
  background-color: #f3fbf7;
  border-color: #e0f2ea;
  color: var(--ink-900);
}
.panel-sidebar a.list-group-item.active i,
.panel-sidebar a.list-group-item.active:focus i,
.panel-sidebar a.list-group-item.active:hover i {
  color: var(--ink-700);
}
div.sidebar .list-group-item-selected {
  background-color: #f3fbf7;
  color: var(--ink-900);
}
div.sidebar .list-group-item-selected .badge {
  background-color: #e0f2ea;
  color: var(--ink-900);
}

/* Client area headings/amounts: remove bold */
.client-home-panels .panel > .panel-heading,
.client-home-panels .panel > .panel-heading .panel-title,
.client-home-panels .panel > .panel-heading .panel-title a,
.panel-sidebar .panel-title,
.panel-sidebar .panel-heading {
  font-weight: 400;
}
.client-home-panels .panel > .panel-body strong {
  font-weight: 400;
}
.panel-sidebar .panel-body strong,
.panel-sidebar .panel-footer strong,
.sidebar .panel .panel-body strong,
.sidebar .panel strong {
  font-weight: 400;
}

/* Sidebar credit balance amount should not be bold */
#Primary_Sidebar-Client_Balance-Amount h4,
#Primary_Sidebar-Client_Balance-Amount h4 strong,
#Primary_Sidebar-Client_Balance-Amount h4 b {
  font-weight: 400 !important;
}

/* Product overview pricing header (upgrade/products) */
.upgrade .products .product .header {
  background-color: #ffffff;
  color: var(--ink-900);
  border-bottom: 1px solid var(--surface-200);
}
.upgrade .products .product .header p {
  color: var(--ink-700);
}