/**
 * Goalfix Custom Branding & Theme Overrides
 * Customizes Velonic/Bastun/Kubayar with Goalfix brand colors, typography, and design elements
 */

/* ========================================
   Typography (Section 4: larger base and headings)
   ======================================== */
html {
    --goalfix-font-delta: 0px;
    font-size: 17px;
    line-height: 1.6;
}

html[data-font-size="small"] {
    --goalfix-font-delta: -2px;
    font-size: 15px;
}

html[data-font-size="large"] {
    --goalfix-font-delta: 4px;
    font-size: 21px;
}

body {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--goalfix-gray-900, #212529);
}

h1, .h1 {
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--goalfix-primary-dark);
}

h2, .h2 {
    font-size: 1.85rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--goalfix-primary-dark);
}

h3, .h3 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.4;
    color: var(--goalfix-primary-dark);
}

h4, .h4 {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.45;
    color: var(--goalfix-primary-dark);
}

/* Bastun/Kubayar section overrides */
.bastun-section h2,
.bastun-main-content h2,
.herobanner__title {
    font-size: 2.25rem;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
}

/* Hero banner title: "Financial Modelling" + "Made Simple" on two lines, larger font */
.herobanner__title--goalfix h1 {
    font-size: clamp(2.35rem, 7vw, 4.1rem) !important;
    line-height: 1.2 !important;
    color: var(--goalfix-page-title) !important;
}

/* Hero 50/50: keep description in left column only; right column image */
.herobanner__text p {
    max-width: 100%;
    color: var(--goalfix-primary-dark) !important;
}
.herobanner__right-img-wrap {
    border-radius: 1rem;
    overflow: hidden;
    display: inline-block;
    max-width: 100%;
}
.herobanner__right-img-wrap picture,
.about-img-wrap picture {
    display: block;
    max-width: 100%;
}
.herobanner__right-img {
    max-height: 480px;
    width: auto;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}

/* Public CTA band: paths relative to this CSS file (stable across page URLs).
   PNG first for older Safari/Android; WebP overrides when supported. */
.about-cta-bg {
    position: relative;
    min-height: 360px;
    background-color: #0d2137;
    background-image: url("../images/general/goalfix-fm-2.png");
    background-image: image-set(
        url("../images/general/goalfix-fm-2.webp") type("image/webp"),
        url("../images/general/goalfix-fm-2.png") type("image/png")
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.about-cta-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
}

/* Features "platform offer" section background (CSS-relative path) */
.goalfix-service-offer {
    background-color: var(--pinkcolor, #FFF0FA);
    background-image: url("../bastun/img/service/service__bg__img.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.bastun-section h3,
.bastun-main-content h3 {
    font-size: 1.5rem;
    font-weight: 600;
}

/* Platform offer CTA blocks: icon colour = hover card gradient by default, white on hover */
.service .service__single__wraper .service__img i {
    transition: color 0.35s ease, -webkit-text-fill-color 0.35s ease, background 0.35s ease;
}
.service .service__single__wraper:hover .service__img i {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: transparent !important;
}

/* Accent blocks and section backgrounds (Section 4) */
.bastun-section.bg-accent,
.bastun-main-content .bg-goalfix-accent-block {
    background: linear-gradient(135deg, rgba(31, 25, 186, 0.06) 0%, rgba(9, 218, 197, 0.06) 100%);
}

.btn-primary,
.bastun-main-content .btn-primary,
.headerarea__icon .btn-primary {
    background: var(--goalfix-gradient) !important;
    border: none !important;
}

/* Bastun public header: logo & nav aligned with site base typography (17px) */
.headerarea.headerarea--3 .bastun-public-header .headerarea__main__menu ul li a {
    font-size: 1.0625rem;
    line-height: 1.4;
    padding: 1.25rem 1.125rem;
}
@media (min-width: 992px) and (max-width: 1365px) {
    .headerarea.headerarea--3 .bastun-public-header .headerarea__main__menu ul li a {
        font-size: 1rem;
        padding: 1rem 0.75rem;
    }
}
.headerarea.headerarea--3 .bastun-public-header .goalfix-public-header-logo {
    max-height: clamp(3.25rem, 5vw, 3.75rem);
    width: auto;
}
.headerarea.headerarea--3 .bastun-public-header.headerarea__main__wrapper--4 {
    padding-top: 1.125rem;
    padding-bottom: 1.125rem;
}
.headerarea.headerarea--3 .bastun-public-header .headerarea__icon.headerarea__button ul li a.default__button {
    font-size: 1.0625rem;
}
.headerarea.headerarea--3 #bastun-mobile-menu a.d-block {
    font-size: 1.0625rem;
    font-weight: 600;
}

/* Hero / CTA buttons (light on gradient background) */
.herobanner__button .btn,
.bastun-main-content .herobanner__button .btn {
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, border-color 0.2s ease, color 0.2s ease;
}
.herobanner__button .btn:hover,
.bastun-main-content .herobanner__button .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.2);
}
.herobanner__button .btn-light:hover {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--goalfix-primary-dark);
}
.herobanner__button .btn-outline-light:hover {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--goalfix-primary-dark);
    border-color: rgba(255, 255, 255, 0.95);
}
.herobanner__button .btn:active {
    transform: translateY(0);
}

/* ========================================
   Public front pages – Bastun-style outline + reversed buttons (Goalfix colours)
   Empty with border + reversed on hover; used on home, about, features, pricing, contact
   ======================================== */
.bastun-main-content .btn-goalfix-primary,
.bastun-main-content .herobanner__button .btn-goalfix-primary {
    background: var(--goalfix-gradient) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--borderRadius, 8px);
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    box-shadow: var(--goalfix-btn-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, color 0.2s ease, border-color 0.2s ease;
}
.bastun-main-content .btn-goalfix-primary:hover,
.bastun-main-content .herobanner__button .btn-goalfix-primary:hover {
    background: var(--goalfix-gradient-hover) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: var(--goalfix-btn-shadow-hover);
}
.bastun-main-content .btn-goalfix-primary:active,
.bastun-main-content .herobanner__button .btn-goalfix-primary:active {
    transform: translateY(0);
}

/* Outline (empty with border) – reversed on hover: fill with gradient, white text */
.bastun-main-content .btn-goalfix-outline,
.bastun-main-content .herobanner__button .btn-goalfix-outline {
    background: transparent !important;
    color: var(--goalfix-primary-dark) !important;
    border: 2px solid var(--goalfix-primary-dark) !important;
    border-radius: var(--borderRadius, 8px);
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, color 0.2s ease, border-color 0.2s ease;
}
.bastun-main-content .btn-goalfix-outline:hover,
.bastun-main-content .herobanner__button .btn-goalfix-outline:hover {
    background: var(--goalfix-gradient) !important;
    color: #fff !important;
    border-color: transparent !important;
    transform: translateY(-2px);
    box-shadow: var(--goalfix-btn-shadow-hover);
}
.bastun-main-content .btn-goalfix-outline:active,
.bastun-main-content .herobanner__button .btn-goalfix-outline:active {
    transform: translateY(0);
}

/* Outline light (for dark/gradient backgrounds): white border, reversed on hover */
.bastun-main-content .btn-goalfix-outline-light,
.bastun-main-content .herobanner__button .btn-goalfix-outline-light {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid rgba(255, 255, 255, 0.9) !important;
    border-radius: var(--borderRadius, 8px);
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, color 0.2s ease, border-color 0.2s ease;
}
.bastun-main-content .btn-goalfix-outline-light:hover,
.bastun-main-content .herobanner__button .btn-goalfix-outline-light:hover {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--goalfix-primary-dark) !important;
    border-color: rgba(255, 255, 255, 0.95) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.2);
}
.bastun-main-content .btn-goalfix-outline-light:active,
.bastun-main-content .herobanner__button .btn-goalfix-outline-light:active {
    transform: translateY(0);
}

/* Filled light (white) for dark backgrounds – platform accent on hover */
.bastun-main-content .btn-goalfix-light,
.bastun-main-content .herobanner__button .btn-goalfix-light {
    background: #fff !important;
    color: var(--goalfix-primary-dark) !important;
    border: none !important;
    border-radius: var(--borderRadius, 8px);
    padding: 14px 28px;
    font-weight: 600;
    font-size: 1rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, color 0.2s ease;
}
.bastun-main-content .btn-goalfix-light:hover,
.bastun-main-content .herobanner__button .btn-goalfix-light:hover {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--goalfix-primary-dark) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.2);
}
.bastun-main-content .btn-goalfix-light:active,
.bastun-main-content .herobanner__button .btn-goalfix-light:active {
    transform: translateY(0);
}

/* Consistent size for hero/CTA button groups */
.bastun-main-content .herobanner__button .btn.btn-lg,
.bastun-main-content .herobanner__button .btn-goalfix-primary,
.bastun-main-content .herobanner__button .btn-goalfix-outline,
.bastun-main-content .herobanner__button .btn-goalfix-outline-light,
.bastun-main-content .herobanner__button .btn-goalfix-light {
    padding: 14px 28px;
}
.bastun-main-content .herobanner__button .btn-goalfix-primary.btn-lg,
.bastun-main-content .herobanner__button .btn-goalfix-outline.btn-lg,
.bastun-main-content .herobanner__button .btn-goalfix-outline-light.btn-lg,
.bastun-main-content .herobanner__button .btn-goalfix-light.btn-lg {
    padding: 14px 32px;
}

/* Small variant for cards / inline actions */
.bastun-main-content .btn-goalfix-primary.btn-sm,
.bastun-main-content .btn-goalfix-outline.btn-sm {
    padding: 0.4rem 0.9rem;
    font-size: 0.875rem;
}

/* ========================================
   Goalfix Brand Color Variables
   ======================================== */
:root {
    /* Primary Brand Colors */
    --goalfix-primary-dark: #1f19ba;    /* Navy Blue */
    --goalfix-primary-light: #09dac5;   /* Teal/Cyan */
    --goalfix-accent: #12b3ef;          /* Bright Blue */
    
    /* Button hover (slightly brighter gradient + shadows) */
    --goalfix-gradient-hover: linear-gradient(135deg, #2d24d0 0%, #0ee4ce 100%);
    --goalfix-btn-shadow: 0 4px 14px rgba(31, 25, 186, 0.35);
    --goalfix-btn-shadow-hover: 0 6px 22px rgba(31, 25, 186, 0.45);
    
    /* New Brand Colors */
    --goalfix-sidebar-bg: #020a14;      /* Dark Blue Sidebar */
    --goalfix-sidebar-active: #29ABE2;  /* Active Sidebar Items */
    --goalfix-page-title: #007ba9;      /* Page Title Color */
    
    /* Gradient Definitions */
    --goalfix-gradient: linear-gradient(135deg, #1f19ba 0%, #09dac5 100%);
    --goalfix-gradient-reverse: linear-gradient(135deg, #09dac5 0%, #1f19ba 100%);
    --goalfix-gradient-vertical: linear-gradient(to bottom, #1f19ba, #09dac5);
    
    /* Semantic Colors */
    --goalfix-success: #0acf97;
    --goalfix-warning: #ffbc00;
    --goalfix-danger: #fa5c7c;
    --goalfix-info: #12b3ef;
    
    /* Neutral Colors */
    --goalfix-light: #f7f7f7;
    --goalfix-dark: #1a2942;
    --goalfix-gray-100: #f8f9fa;
    --goalfix-gray-200: #e9ecef;
    --goalfix-gray-300: #dee2e6;
    --goalfix-gray-700: #495057;
    --goalfix-gray-900: #212529;
    
    /* Financial Model Specific */
    --label-color: #000000;
    --kfi-color: #2c698d;
    --left-header-width: 180px;
    --column-min-width: 90px;
    --column-max-width: 120px;
}

/* ========================================
   Override Velonic Primary Colors
   ======================================== */
.btn-primary {
    background: var(--goalfix-gradient);
    border: none;
    color: white;
    box-shadow: var(--goalfix-btn-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease;
}

.btn-primary:hover {
    background: var(--goalfix-gradient-hover);
    color: white;
    transform: translateY(-2px);
    box-shadow: var(--goalfix-btn-shadow-hover);
}

.btn-primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(26, 20, 150, 0.3);
}

/* ========================================
   Global Button Hover Styling (all themes)
   ======================================== */
.btn {
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.25s ease;
}

.btn:hover {
    transform: translateY(-2px);
}

.btn:active {
    transform: translateY(0);
}

.btn-outline-primary {
    border-width: 2px;
    color: var(--goalfix-primary-dark);
    border-color: var(--goalfix-primary-dark);
    background: transparent;
}

.btn-outline-primary:hover {
    background: var(--goalfix-gradient);
    color: white;
    border-color: transparent;
    box-shadow: var(--goalfix-btn-shadow-hover);
}

.btn-success {
    box-shadow: 0 2px 10px rgba(5, 150, 105, 0.3);
}

.btn-success:hover {
    box-shadow: 0 4px 16px rgba(5, 150, 105, 0.4);
}

.btn-danger:hover {
    box-shadow: 0 4px 16px rgba(220, 38, 38, 0.35);
}

.bg-primary {
    background: var(--goalfix-gradient) !important;
}

.text-primary {
    color: var(--goalfix-accent) !important;
}

.badge.bg-primary {
    background: var(--goalfix-accent) !important;
}

/* User/role tags – app blue */
.badge-user-tag,
.badge.bg-goalfix-primary {
    background-color: var(--goalfix-primary-dark) !important;
    color: #fff !important;
}

/* ========================================
   Sidebar Customization
   ======================================== */
.leftside-menu {
    background: #ffffff !important;
    border-right: 1px solid #e3e8ef;
}

.leftside-menu .side-nav .side-nav-link {
    color: #6c757d;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.leftside-menu .side-nav .side-nav-link i {
    color: #6c757d;
}

.leftside-menu .side-nav .side-nav-link:hover {
    color: #29ABE2;
    background-color: rgba(41, 171, 226, 0.1);
}

.leftside-menu .side-nav .side-nav-link.active {
    color: #29ABE2 !important;
    background: rgba(41, 171, 226, 0.15);
    border-left: 3px solid #29ABE2;
}

.leftside-menu .side-nav .side-nav-link.active i {
    color: #29ABE2 !important;
}

.leftside-menu .side-nav .side-nav-link:hover i {
    color: #29ABE2;
}

.leftside-menu .side-nav-title {
    color: #98a6ad;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
}

.logo-box {
    background: rgba(255, 255, 255, 1);
    border-bottom: 1px solid #e3e8ef;
}

.leftside-menu .logo {
    background: transparent;
    height: auto !important;
    padding: 20px !important;
}

.leftside-menu .logo .logo-lg {
    height: auto !important;
    line-height: normal !important;
}

.leftside-menu .logo .logo-lg img {
    max-height: 200px !important;
    height: auto !important;
    width: auto !important;
    max-width: 100%;
}

.leftside-menu .logo-topbar {
    background: transparent;
}

/* Ensure logo area stays white when sidebar is condensed/closed */
html[data-sidenav-size=condensed]:not([data-layout=topnav]) .wrapper .leftside-menu .logo {
    background: #ffffff !important;
}


/* ========================================
   Kubayar Admin: Sidebar & Top Bar
   ======================================== */
/* Nav header: logos bigger; white background to match sidebar menu */
#main-wrapper .nav-header {
    background: #fff !important;
}
#main-wrapper .nav-header .brand-logo {
    display: flex;
    align-items: center;
    padding: 0.75rem 1rem;
    background: #fff !important;
    border: none !important;
    box-shadow: none !important;
}
#main-wrapper .nav-header .brand-logo .brand-title,
#main-wrapper .nav-header .brand-logo .logo-abbr {
    width: auto;
    height: auto;
    max-height: 56px;
    object-fit: contain;
    background: transparent !important;
}
#main-wrapper .nav-header .brand-logo .brand-title {
    max-height: 56px;
}
/* Collapsed sidebar: show favicon from images/, hide full logo; collapsed logo bigger */
#main-wrapper .nav-header .brand-logo .logo-abbr {
    display: none !important;
    max-height: 48px;
}
#main-wrapper.menu-toggle .nav-header .brand-logo .brand-title {
    display: none !important;
}
#main-wrapper.menu-toggle .nav-header .brand-logo .logo-abbr {
    display: block !important;
    max-height: 48px;
}
/* Mobile: always show collapsed menu logo next to hamburger (nav-header is narrow) */
@media (max-width: 767px) {
    #main-wrapper .nav-header .brand-logo .brand-title {
        display: none !important;
    }
    #main-wrapper .nav-header .brand-logo .logo-abbr {
        display: block !important;
        max-height: 40px;
    }
}

/* ========================================
   Kubayar mobile menu & top bar fixes
   ======================================== */
@media (max-width: 767px) {
    /* Top bar: fixed at top so it stays visible; leave room for nav-header (hamburger + logo) */
    .content-body .header {
        position: fixed !important;
        top: 0 !important;
        left: 3.75rem !important;
        right: 0 !important;
        z-index: 1000 !important;
        background: #fff !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    }
    /* Prevent content from sliding under the fixed top bar */
    .content-body {
        padding-top: 4rem !important;
    }
    /* Menu items: more space between icon and text so they don’t feel cramped */
    #main-wrapper .deznav .metismenu li a {
        padding: 0.65rem 1rem !important;
        min-height: 2.75rem;
        display: flex !important;
        align-items: center !important;
    }
    #main-wrapper .deznav .metismenu li a i {
        margin-right: 0.75rem !important;
        width: 1.25rem;
        flex-shrink: 0;
    }
    #main-wrapper .deznav .metismenu li a .nav-text {
        flex: 1;
        min-width: 0;
    }
    /* Sub-menus: clear separation so they don’t overlap the next main menu item */
    #main-wrapper .deznav .metismenu > li {
        margin-bottom: 0.125rem;
    }
    #main-wrapper .deznav .metismenu ul {
        margin-top: 0.25rem !important;
        margin-bottom: 0.5rem !important;
        padding: 0.25rem 0 !important;
        background: #f8f9fa !important;
        border-radius: 0.375rem;
        list-style: none;
    }
    #main-wrapper .deznav .metismenu ul a {
        padding: 0.5rem 1rem 0.5rem 2.25rem !important;
        font-size: 0.9375rem;
        display: block;
    }
    #main-wrapper .deznav .metismenu ul ul a {
        padding-left: 2.75rem !important;
    }
    /* Overlay menu: solid background and high z-index so page content doesn’t show through */
    #main-wrapper .deznav {
        background: #fff !important;
        z-index: 999 !important;
        box-shadow: 4px 0 12px rgba(0, 0, 0, 0.1);
    }
}
/* Hamburger / nav-control: match theme primary */
.deznav .metismenu li a i {
    width: 1.25rem;
    text-align: center;
    margin-right: 0.5rem;
    opacity: 0.9;
}
.deznav .metismenu li.mm-active > a i,
.deznav .metismenu li a:hover i {
    opacity: 1;
}
/* Submenu item icons (optional spacing) */
.deznav .metismenu ul li a i.me-2 {
    margin-right: 0.75rem !important;
}

/* Portal (Kubayar) sidebar submenus: space between icon and name, smaller indent (all viewports) */
#main-wrapper .deznav .metismenu ul a {
    display: flex !important;
    align-items: center !important;
    gap: 0.85rem !important;
    padding-left: 1.5rem !important;
    padding-right: 1rem !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}
#main-wrapper .deznav .metismenu ul a i {
    width: 1.15rem;
    min-width: 1.15rem;
    margin-right: 0 !important;
    text-align: center;
    flex-shrink: 0;
}
#main-wrapper .deznav .metismenu ul ul a {
    padding-left: 2rem !important;
}
[direction="rtl"] #main-wrapper .deznav .metismenu ul a {
    padding-left: 1rem !important;
    padding-right: 1.5rem !important;
}
[direction="rtl"] #main-wrapper .deznav .metismenu ul ul a {
    padding-right: 2rem !important;
    padding-left: 1rem !important;
}

/* Collapsed sidebar: clear hover flyouts (labels + submenu items) */
#main-wrapper.menu-toggle .deznav {
    overflow: visible !important;
    z-index: 1020;
}
#main-wrapper.menu-toggle .deznav .deznav-scroll,
#main-wrapper.menu-toggle .deznav .slimScrollDiv {
    overflow: visible !important;
}
#main-wrapper.menu-toggle .deznav .metismenu {
    overflow: visible !important;
}
#main-wrapper.menu-toggle .deznav .metismenu > li {
    position: relative !important;
    flex-direction: row !important;
    align-items: stretch;
    justify-content: center;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative;
    width: 100% !important;
    height: 2.75rem !important;
    min-height: 2.75rem;
    padding: 0 !important;
    margin: 0.1rem 0 !important;
    border-radius: 0.5rem;
    white-space: nowrap;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > a i {
    flex-shrink: 0;
    margin: 0 !important;
    width: auto;
    font-size: 1.15rem;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > a.has-arrow:after {
    display: none !important;
}

/* Hide labels/submenus until hover or keyboard focus */
#main-wrapper.menu-toggle .deznav .metismenu .nav-text,
#main-wrapper.menu-toggle .deznav .badge {
    display: none !important;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > ul,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul.mm-collapse,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul.mm-show,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul.mm-collapse.mm-show {
    display: none !important;
    position: absolute !important;
    left: calc(100% + 0.35rem) !important;
    top: 0 !important;
    bottom: auto !important;
    width: 16rem !important;
    min-width: 16rem;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0.4rem 0 !important;
    overflow: visible !important;
    z-index: 1002;
    background: #fff !important;
    border: 1px solid #e2e8f0;
    border-radius: 0 0.5rem 0.5rem 0.5rem;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
}

/* Invisible bridge so the pointer can move from icon -> flyout without closing */
#main-wrapper.menu-toggle .deznav .metismenu > li:hover::after,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within::after {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    width: 0.5rem;
    height: 100%;
    min-height: 2.75rem;
    z-index: 1001;
}

/* Leaf item label flyout */
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > a:not(.has-arrow) .nav-text,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > a:not(.has-arrow) .nav-text {
    display: flex !important;
    align-items: center;
    position: absolute;
    left: calc(100% + 0.35rem);
    top: 50%;
    transform: translateY(-50%);
    min-width: 12rem;
    height: 2.85rem;
    padding: 0 1.1rem !important;
    margin: 0;
    background: #fff;
    color: #1f19ba !important;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
    z-index: 1003;
}

/* Parent item: title row + submenu card */
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > a.has-arrow .nav-text,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > a.has-arrow .nav-text {
    display: flex !important;
    align-items: center;
    position: absolute;
    left: calc(100% + 0.35rem);
    top: 0;
    transform: none;
    min-width: 16rem;
    width: 16rem;
    height: 2.85rem;
    padding: 0 1.1rem !important;
    margin: 0;
    background: #eef0ff;
    color: #1f19ba !important;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    border: 1px solid #e2e8f0;
    border-bottom: 1px solid #d8daf5;
    border-radius: 0.5rem 0.5rem 0 0;
    box-shadow: none;
    z-index: 1003;
}
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > ul,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > ul,
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > ul.mm-collapse,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > ul.mm-collapse,
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > ul.mm-show,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > ul.mm-show {
    display: block !important;
    top: 2.85rem !important;
    visibility: visible !important;
    opacity: 1 !important;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a {
    display: flex !important;
    align-items: center !important;
    gap: 0.85rem !important;
    min-height: 2.75rem;
    padding: 0.6rem 1.1rem !important;
    margin: 0 !important;
    width: 100% !important;
    height: auto !important;
    line-height: 1.35 !important;
    font-size: 0.95rem !important;
    font-weight: 500;
    color: #334155 !important;
    background: transparent !important;
    border-radius: 0 !important;
    white-space: normal;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a i {
    width: 1.15rem;
    min-width: 1.15rem;
    margin: 0 !important;
    color: #64748b;
    text-align: center;
    flex-shrink: 0;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a:hover,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a:focus,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul li.active > a,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a.active {
    background: #eef0ff !important;
    color: #1f19ba !important;
}
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a:hover i,
#main-wrapper.menu-toggle .deznav .metismenu > li > ul a:focus i {
    color: #1f19ba;
}
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > a,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > a {
    background: #eef0ff !important;
    color: #1f19ba !important;
}
#main-wrapper.menu-toggle .deznav .metismenu > li:hover > a i,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > a i {
    color: #1f19ba !important;
}
/* Keep last items' flyouts on-screen */
#main-wrapper.menu-toggle .deznav .metismenu > li:hover:nth-last-child(-n+2) > ul,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within:nth-last-child(-n+2) > ul {
    top: auto !important;
    bottom: 0 !important;
    border-radius: 0.5rem 0.5rem 0.5rem 0;
}
#main-wrapper.menu-toggle .deznav .metismenu > li:hover:nth-last-child(-n+2) > a.has-arrow .nav-text,
#main-wrapper.menu-toggle .deznav .metismenu > li:focus-within:nth-last-child(-n+2) > a.has-arrow .nav-text {
    top: auto;
    bottom: 100%;
    border-radius: 0.5rem 0.5rem 0 0;
}
[direction="rtl"] #main-wrapper.menu-toggle .deznav .metismenu > li > ul,
[direction="rtl"] #main-wrapper.menu-toggle .deznav .metismenu > li:hover > a .nav-text,
[direction="rtl"] #main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > a .nav-text {
    left: auto !important;
    right: calc(100% + 0.35rem) !important;
}
@media (max-width: 767px) {
    /* Mobile uses overlay menu — keep full labels, skip desktop flyouts */
    #main-wrapper.menu-toggle .deznav .metismenu .nav-text {
        display: inline !important;
    }
    #main-wrapper.menu-toggle .deznav .metismenu > li > ul.mm-show {
        display: block !important;
        position: static !important;
        width: auto !important;
        box-shadow: none !important;
        border: none !important;
    }
    #main-wrapper.menu-toggle .deznav .metismenu > li:hover > a .nav-text,
    #main-wrapper.menu-toggle .deznav .metismenu > li:focus-within > a .nav-text {
        position: static !important;
        transform: none !important;
        min-width: 0 !important;
        width: auto !important;
        height: auto !important;
        padding: 0 !important;
        border: none !important;
        box-shadow: none !important;
        background: transparent !important;
    }
}
@media (prefers-reduced-motion: reduce) {
    #main-wrapper.menu-toggle .deznav .metismenu > li > ul,
    #main-wrapper.menu-toggle .deznav .metismenu > li > a .nav-text {
        transition: none;
    }
}
/* Keep content-body (and header) within viewport so profile stays on page; top bar flush with top */
#main-wrapper .content-body {
    width: calc(100vw - 17.1875rem) !important;
    max-width: calc(100vw - 17.1875rem);
    box-sizing: border-box;
    padding-top: 0 !important;
    margin-top: 0 !important;
}
#main-wrapper.menu-toggle .content-body {
    width: calc(100vw - 3.75rem) !important;
    max-width: calc(100vw - 3.75rem);
}
/* Ensure top bar (header) is flush with top of page - no gap above */
#main-wrapper .content-body .header {
    margin-top: 0 !important;
}
#main-wrapper {
    padding-top: 0 !important;
    /* Force full-width layout: prevent boxed max-width so admin portal uses full viewport */
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box;
}
/* Kubayar content area: use full available width; tighter side padding for wide tables */
.content-body .container-fluid {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
/* Mobile: admin portal full width – content-body uses full viewport, no narrow column */
@media (max-width: 767px) {
    #main-wrapper .content-body {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
    }
    .content-body .container-fluid {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
}
@media (max-width: 575px) {
    .content-body .container-fluid {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
}
/* Header: full width of content-body, profile always visible; gap after collapse button only */
.content-body .header {
    padding-left: 3.75rem !important;
    padding-right: 1rem !important;
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
    overflow: visible;
    position: relative;
    z-index: 2;
}
.content-body .header.border-bottom {
    border-bottom: 1px solid var(--border, #e9ecef) !important;
}
.content-body .header .header-content {
    min-height: 4rem;
    padding-left: 0.5rem !important;
    padding-right: 0 !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow: visible;
}
.content-body .header .navbar,
.content-body .header .navbar-collapse {
    width: 100%;
    min-width: 0;
    overflow: visible;
}
.content-body .header .header-left {
    min-width: 0;
    flex: 1 1 auto;
}
.content-body .header .header-right {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    flex-shrink: 0;
    flex-grow: 0;
    height: 100%;
}
.content-body .header .header-right .nav-item {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
@media (min-width: 576px) {
    .content-body .header .header-content {
        padding-left: 0.75rem !important;
    }
}
/* Small viewports: show only profile avatar in topbar (match Kubayar) */
@media (max-width: 575px) {
    .content-body .header .header-right .header-profile .header-info {
        display: none;
    }
    .content-body .header .header-right .header-profile .nav-link .ms-auto.me-1 {
        display: none;
    }
}
.content-body .header .header-left .dashboard_bar {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--goalfix-page-title, #007ba9);
    margin: 0;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Fullscreen toggle (left of profile menu) */
.content-body .header .header-right .header-help {
    display: flex;
    align-items: center;
}
.content-body .header .header-right .header-help-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0.5rem;
    background: transparent;
    color: #495057;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}
.content-body .header .header-right .header-help-btn:hover,
.content-body .header .header-right .header-help-btn:focus {
    background: rgba(0, 0, 0, 0.04);
    color: var(--goalfix-page-title, #007ba9);
    outline: none;
}
.content-body .header .header-right .header-help-btn i {
    font-size: 1.05rem;
}
.content-body .header .header-right .header-fullscreen {
    display: flex;
    align-items: center;
}
.content-body .header .header-right .header-fullscreen-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0.5rem;
    background: transparent;
    color: #495057;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}
.content-body .header .header-right .header-fullscreen-btn:hover,
.content-body .header .header-right .header-fullscreen-btn:focus {
    background: rgba(0, 0, 0, 0.04);
    color: var(--goalfix-page-title, #007ba9);
    outline: none;
}
.content-body .header .header-right .header-fullscreen-btn.active {
    color: var(--goalfix-page-title, #007ba9);
}
.content-body .header .header-right .header-fullscreen-btn i {
    font-size: 1.05rem;
}
/* Font size dropdown (left of profile menu) */
.content-body .header .header-right .header-font-size {
    display: flex;
    align-items: center;
}
.content-body .header .header-right .header-font-size.dropdown {
    position: relative;
}
.content-body .header .header-right .header-font-size-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0.5rem;
    background: transparent;
    color: #495057;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}
.content-body .header .header-right .header-font-size-btn:hover,
.content-body .header .header-right .header-font-size-btn:focus {
    background: rgba(0, 0, 0, 0.04);
    color: var(--goalfix-page-title, #007ba9);
    outline: none;
}
.content-body .header .header-right .header-font-size-btn i {
    font-size: 1.05rem;
}
.content-body .header .header-right .header-font-size .dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    bottom: auto;
    transform: none;
    min-width: 9rem;
    padding: 0.35rem 0;
    margin-top: 0.125rem;
    z-index: 1055;
    display: none;
}
.content-body .header .header-right .header-font-size .dropdown-menu.show,
.content-body .header .header-right .header-font-size.show .dropdown-menu {
    display: block !important;
}
.content-body .header .header-right .header-font-size .dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}
.content-body .header .header-right .header-font-size .dropdown-item.active {
    color: var(--goalfix-page-title, #007ba9);
    font-weight: 500;
}
.content-body .header .header-right .header-font-size .dropdown-item .font-size-check {
    visibility: hidden;
    font-size: 0.75rem;
}
.content-body .header .header-right .header-font-size .dropdown-item.active .font-size-check {
    visibility: visible;
}
/* Profile area in top bar (match Kubayar theme) */
.content-body .header .header-right .header-profile {
    border-left: 1px solid var(--border, #e9ecef);
    margin-left: 0.5rem;
}
.content-body .header .header-right .header-profile .nav-link {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    transition: background 0.2s;
    width: 100%;
}
.content-body .header .header-right .header-profile .nav-link:hover {
    background: rgba(0, 0, 0, 0.04);
}
.content-body .header .header-right .header-profile .header-info {
    line-height: 1.25;
}
.content-body .header .header-right .header-profile .header-info span {
    display: block;
    font-weight: 500;
    color: #333;
}
.content-body .header .header-right .header-profile .header-info small {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
}
/* Avatar placeholder when no image (icon inside circle) */
.header-profile-avatar {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 50%;
    background: var(--goalfix-gradient);
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}
.header-profile .dropdown-menu .card-header .header-profile-avatar {
    width: 42px;
    height: 42px;
    min-width: 42px;
    font-size: 1.125rem;
}
/* Profile dropdown: ensure it appears above content and is not clipped */
.content-body .header .header-right .header-profile.dropdown {
    position: relative;
}
/* Single caret for profile (no Bootstrap dropdown-toggle caret) */
.content-body .header .header-right .header-profile .header-profile-caret {
    display: inline-flex;
    align-items: center;
    font-size: 0.7rem;
    color: #6c757d;
    transition: transform 0.2s;
}
.content-body .header .header-right .header-profile.show .header-profile-caret {
    transform: rotate(180deg);
}
.content-body .header .header-right .header-profile .dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    min-width: 240px;
    padding: 0;
    z-index: 1055;
    display: none;
    margin-top: 0.125rem;
    pointer-events: auto;
}
.content-body .header .header-right .header-profile .dropdown-menu .dropdown-item {
    pointer-events: auto;
    cursor: pointer;
}
.content-body .header .header-right .header-profile .dropdown-menu.show,
.content-body .header .header-right .header-profile.show .dropdown-menu {
    display: block !important;
}
.header-profile .dropdown-menu .card-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* ========================================
   Topbar Customization
   ======================================== */
.navbar-custom {
    background: white;
    border-bottom: 1px solid var(--goalfix-gray-200);
    margin-bottom: 20px;
}

/* Mobile: Reduce navbar margin for more space */
@media (max-width: 768px) {
    .navbar-custom {
        margin-bottom: 12px;
    }
}

@media (max-width: 576px) {
    .navbar-custom {
        margin-bottom: 8px;
    }
}

.page-title,
.page-title-box h4,
h4.page-title {
    color: #007ba9 !important;
}

/* Contextual Navigation in Topbar */
.topbar .btn-group-sm .btn {
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 6px;
    font-weight: 500;
    transition: all 0.2s ease;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.topbar .btn-group-sm .btn i {
    font-size: 14px;
}

.topbar .btn-group-sm .btn-primary {
    background: var(--goalfix-gradient);
    border: none;
    color: white;
    box-shadow: 0 2px 8px rgba(31, 25, 186, 0.3);
}

.topbar .btn-group-sm .btn-outline-secondary {
    border: 1px solid var(--goalfix-gray-300);
    color: var(--goalfix-gray-700);
    background: white;
}

.topbar .btn-group-sm .btn-outline-secondary:hover {
    border-color: var(--goalfix-accent);
    color: var(--goalfix-accent);
    background: rgba(18, 179, 239, 0.05);
    transform: translateY(-1px);
}

/* Responsive topbar navigation */
@media (max-width: 1399px) {
    .topbar .btn-group-sm .btn span {
        display: none !important;
    }
    
    .topbar .btn-group-sm .btn {
        padding: 6px 10px;
    }
}

@media (max-width: 991px) {
    .topbar .btn-group-sm {
        display: none !important;
    }
}

/* Main content padding from topbar */
.content-page .content {
    padding-top: 20px;
    padding-left: 15px;
    padding-right: 15px;
}

/* Add margin to main row containers */
.content-page .content .row {
    margin-bottom: 20px;
}

.content-page .content .row:last-child {
    margin-bottom: 0;
}

/* Mobile: Reduce row margins */
@media (max-width: 768px) {
    .content-page .content .row {
        margin-bottom: 12px;
    }
}

@media (max-width: 576px) {
    .content-page .content .row {
        margin-bottom: 8px;
    }
}

/* Better utilization of available width */
.content-page .content .container-fluid {
    max-width: none;
    padding-left: 15px;
    padding-right: 15px;
}

/* Mobile: Reduce content padding for more data space */
@media (max-width: 768px) {
    .content-page .content {
        padding-top: 12px;
        padding-left: 8px;
        padding-right: 8px;
    }
    
    .content-page .content .container-fluid {
        padding-left: 8px;
        padding-right: 8px;
    }
}

@media (max-width: 576px) {
    .content-page .content {
        padding-top: 10px;
        padding-left: 5px;
        padding-right: 5px;
    }
    
    .content-page .content .container-fluid {
        padding-left: 5px;
        padding-right: 5px;
    }
}

/* ========================================
   Card Enhancements
   ======================================== */
.card {
    border: 1px solid var(--goalfix-gray-200);
    box-shadow: 0 0 20px rgba(31, 25, 186, 0.05);
    transition: all 0.3s ease;
}

/* Mobile: Reduce card body padding for more space */
@media (max-width: 768px) {
    .card-body {
        padding: 12px;
    }
}

@media (max-width: 576px) {
    .card-body {
        padding: 10px;
    }
}

.card:hover {
    box-shadow: 0 5px 25px rgba(31, 25, 186, 0.1);
}

.card-header {
    background: var(--goalfix-gray-100);
    border-bottom: 2px solid var(--goalfix-gray-200);
}

/* ========================================
   Form Inputs (Financial Model)
   ======================================== */
.form-control:focus {
    border-color: var(--goalfix-accent);
    box-shadow: 0 0 0 0.2rem rgba(18, 179, 239, 0.25);
}

.form-control {
    border-color: var(--goalfix-gray-300);
}

/* ========================================
   Navigation Tabs - REMOVED (Now using sidebar)
   Tab content styling only
   ======================================== */
.tab-content {
    background-color: var(--goalfix-gray-100, #f8f9fa);
    padding: 1rem 0.75rem 1.5rem;
    min-height: 500px;
}

.model-page .model-tab-content {
    padding: 0.75rem 0.35rem 1.25rem;
}

.model-page.model-input-active .model-tab-content {
    padding: 0;
    background: transparent;
    min-height: 0;
}

/* Mobile: Reduce tab-content padding */
@media (max-width: 768px) {
    .tab-content {
        padding: 0.75rem 0.35rem 1rem;
    }

    .model-page .model-tab-content {
        padding: 0.5rem 0.15rem 0.85rem;
    }
}

@media (max-width: 576px) {
    .tab-content {
        padding: 0.5rem 0.15rem 0.75rem;
    }
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: block;
}

/* ========================================
   Project Settings – Kubayar theme
   ======================================== */
#project_settings {
    padding-top: 0.5rem;
}
#project_settings .project-settings-card {
    background: #fff;
    border: 1px solid var(--goalfix-gray-200);
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(31, 25, 186, 0.06);
    overflow: hidden;
}
#project_settings .project-settings-card-body {
    padding: 1.75rem 2rem;
}
#project_settings .project-settings-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    margin-bottom: 0.5rem;
}
#project_settings .project-settings-title i {
    color: var(--goalfix-primary-light);
}
#project_settings .project-settings-subtitle {
    color: var(--goalfix-gray-700);
    font-size: 0.9375rem;
    line-height: 1.5;
    margin-bottom: 2rem;
}
#project_settings .project-settings-fields {
    margin-top: 0.5rem;
}
#project_settings .project-settings-fields .input-label {
    font-weight: 600;
    color: var(--goalfix-dark);
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}
#project_settings .input-modern {
    padding: 0.625rem 1rem;
    border: 1px solid var(--goalfix-gray-300);
    border-radius: 8px;
    font-size: 0.9375rem;
    transition: border-color 0.2s, box-shadow 0.2s;
}
#project_settings .input-modern:focus {
    border-color: var(--goalfix-primary-dark);
    box-shadow: 0 0 0 3px rgba(31, 25, 186, 0.12);
}
#project_settings .input-modern:disabled {
    background: var(--goalfix-gray-100);
    color: var(--goalfix-gray-700);
}
@media (max-width: 768px) {
    #project_settings .project-settings-card-body {
        padding: 1.25rem 1.25rem;
    }
}

/* ========================================
   ONBOARDING WIZARD – responsive layout
   ======================================== */

/* Pull wizard up closer to the app header */
.content-body:has(.wizard-container) > .container-fluid {
    padding-top: 0.5rem !important;
}

.wizard-container {
    --wizard-gap: 1.25rem;
    --wizard-radius: 14px;
    --wizard-step-size: 2rem;
    max-width: 920px;
    margin: 0 auto;
    padding: 0 clamp(0.5rem, 2vw, 1rem) 2.5rem;
    width: 100%;
    box-sizing: border-box;
    scroll-margin-top: 1rem;
}

.wizard-container .wizard-step {
    min-height: 0;
    animation: wizardFadeIn 0.28s ease;
}

@keyframes wizardFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Progress header – compact modern stepper */
.wizard-container .progress-indicator {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    padding: 0.7rem 0.85rem 0.75rem;
    border-radius: 12px;
    border: 1px solid rgba(31, 25, 186, 0.08);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    margin-bottom: 0.85rem;
}

.wizard-container .wizard-steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    align-items: start;
    padding: 0 0.15rem;
}

/* Connecting progress track behind step numbers */
.wizard-container .wizard-steps-track {
    position: absolute;
    left: calc(100% / 14);
    right: calc(100% / 14);
    top: calc(var(--wizard-step-size) / 2);
    height: 3px;
    margin-top: -1.5px;
    border-radius: 999px;
    background: #e2e8f0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wizard-container .wizard-steps-track-fill {
    height: 100%;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(90deg, #1f19ba 0%, #09dac5 100%);
    transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.wizard-container .wizard-step-pill {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    text-align: center;
    padding: 0 0.15rem;
}

.wizard-container .wizard-step-pill .wizard-step-num {
    width: var(--wizard-step-size);
    height: var(--wizard-step-size);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0;
    background: #fff;
    color: #64748b;
    border: 2px solid #cbd5e1;
    box-shadow: 0 0 0 4px #f8fafc;
    line-height: 1;
    transition:
        background 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.wizard-container .wizard-step-pill .wizard-step-label {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    letter-spacing: 0.01em;
    transition: color 0.2s ease, font-weight 0.2s ease;
}

/* Completed steps – filled + checkmark */
.wizard-container .wizard-step-pill.is-done .wizard-step-num {
    background: linear-gradient(135deg, #1f19ba 0%, #09dac5 100%);
    color: transparent;
    border-color: transparent;
    box-shadow: 0 0 0 4px #f8fafc;
    position: relative;
    font-size: 0;
}

.wizard-container .wizard-step-pill.is-done .wizard-step-num::after {
    content: "";
    position: absolute;
    inset: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.5 8.2 6.4 11l6.1-6.5' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.wizard-container .wizard-step-pill.is-done .wizard-step-label {
    color: #475569;
    font-weight: 600;
}

/* Active / current step */
.wizard-container .wizard-step-pill.is-active .wizard-step-num {
    background: linear-gradient(135deg, #1f19ba 0%, #12b3ef 100%);
    color: #fff;
    border-color: transparent;
    transform: scale(1.08);
    box-shadow:
        0 0 0 4px #f8fafc,
        0 0 0 6px rgba(31, 25, 186, 0.35),
        0 4px 12px rgba(31, 25, 186, 0.2);
    font-size: 0.75rem;
}

.wizard-container .wizard-step-pill.is-active .wizard-step-num::after {
    content: none;
}

.wizard-container .wizard-step-pill.is-active .wizard-step-label {
    color: #1f19ba;
    font-weight: 800;
}

/* Upcoming steps stay muted */
.wizard-container .wizard-step-pill:not(.is-active):not(.is-done) .wizard-step-num {
    background: #fff;
    color: #94a3b8;
    border-color: #e2e8f0;
}

/* Step headers */
.wizard-container .wizard-step-header {
    margin-bottom: clamp(1.25rem, 3vw, 1.75rem);
}

.wizard-container .wizard-step-header h2,
.wizard-container .project-settings-title {
    font-size: clamp(1.2rem, 2.5vw, 1.5rem);
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    margin-bottom: 0.4rem;
    line-height: 1.3;
}

.wizard-container .project-settings-title i {
    color: var(--goalfix-primary-light);
}

.wizard-container .wizard-step-header p,
.wizard-container .project-settings-subtitle {
    color: var(--goalfix-gray-700);
    font-size: 0.9375rem;
    line-height: 1.5;
    margin-bottom: 0;
    max-width: 42rem;
}

/* Cards */
.wizard-container .project-settings-card,
.wizard-container .wizard-step-card,
.wizard-container .settings-card {
    background: #fff;
    border: 1px solid var(--goalfix-gray-200);
    border-radius: var(--wizard-radius);
    box-shadow: 0 2px 12px rgba(31, 25, 186, 0.05);
    overflow: hidden;
}

.wizard-container .settings-card {
    padding: clamp(1.1rem, 2.5vw, 1.5rem);
    margin-bottom: 1.25rem;
}

.wizard-container .settings-card:hover {
    box-shadow: 0 2px 12px rgba(31, 25, 186, 0.05);
    transform: none;
}

.wizard-container .project-settings-card-body {
    padding: clamp(1.15rem, 3vw, 1.75rem);
}

.wizard-container .wizard-section-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    margin-bottom: 0.35rem;
}

.wizard-container .wizard-section-desc {
    font-size: 0.8125rem;
    color: var(--goalfix-gray-700);
    margin-bottom: 1rem;
    line-height: 1.45;
}

.wizard-container .wizard-readonly-value {
    padding: 0.7rem 0;
    font-weight: 600;
    color: var(--goalfix-dark);
    font-size: 0.9375rem;
}

.wizard-container .expense-field-grid--two {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
}

.wizard-container .input-group .input-group-text--end {
    border-right: none;
    border-left: 1px solid var(--goalfix-gray-200);
    border-radius: 0;
    order: 2;
}

.wizard-container .input-group .input-modern + .input-group-text--end,
.wizard-container .input-group .input-modern:has(+ .input-group-text--end) {
    border-radius: 0;
}

.wizard-container .input-group:has(.input-group-text--end) .input-modern {
    order: 1;
    border-radius: 0;
}

/* Field grid – stacked labels, never side-by-side label/value rows */
.wizard-container .wizard-field-grid,
.wizard-container .project-settings-fields,
.wizard-container .wizard-step-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wizard-gap);
    margin-top: 0.25rem;
}

.wizard-container .wizard-field,
.wizard-container .wizard-field-grid > [class*="col-"],
.wizard-container .project-settings-fields > [class*="col-"],
.wizard-container .wizard-step-fields > [class*="col-"] {
    min-width: 0;
    width: 100%;
    max-width: none;
    flex: none;
    padding: 0;
}

.wizard-container .wizard-field--full,
.wizard-container .wizard-field-grid > .col-12,
.wizard-container .project-settings-fields > .col-12,
.wizard-container .wizard-step-fields > .col-12 {
    grid-column: 1 / -1;
}

.wizard-container .input-label,
.wizard-container .wizard-field-label {
    display: block;
    font-weight: 600;
    color: var(--goalfix-dark);
    font-size: 0.8125rem;
    margin-bottom: 0.4rem;
    line-height: 1.35;
    white-space: normal;
}

.wizard-container .wizard-field-hint,
.wizard-container .wizard-field small.text-muted,
.wizard-container .project-settings-fields small.text-muted,
.wizard-container .wizard-step-fields small.text-muted {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--goalfix-gray-700);
}

.wizard-container .input-modern {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0.7rem 0.9rem;
    border: 1px solid var(--goalfix-gray-300);
    border-radius: 10px;
    font-size: 0.9375rem;
    line-height: 1.4;
    margin-bottom: 0;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.wizard-container .input-modern:focus {
    border-color: var(--goalfix-primary-dark);
    box-shadow: 0 0 0 3px rgba(31, 25, 186, 0.12);
    outline: none;
}

.wizard-container .input-modern:disabled {
    background: var(--goalfix-gray-100);
    color: var(--goalfix-gray-700);
}

.wizard-container select.input-modern {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%236c757d' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    background-size: 14px 14px;
    padding-right: 2.5rem;
}

.wizard-container .input-group {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    min-width: 0;
    border: 1px solid var(--goalfix-gray-300);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.wizard-container .input-group:focus-within {
    border-color: var(--goalfix-primary-dark);
    box-shadow: 0 0 0 3px rgba(31, 25, 186, 0.12);
}

.wizard-container .input-group .input-group-text {
    flex: 0 0 auto;
    background: var(--goalfix-gray-100);
    border: none;
    border-radius: 0;
    border-right: 1px solid var(--goalfix-gray-200);
    padding: 0.7rem 0.85rem;
    font-weight: 600;
    color: var(--goalfix-dark);
    white-space: nowrap;
    line-height: 1.4;
}

.wizard-container .input-group .input-modern {
    flex: 1 1 auto;
    min-width: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.wizard-container .input-group .input-modern:focus {
    border: none;
    box-shadow: none;
}

/* Override legacy settings-item horizontal rows inside wizard */
.wizard-container .settings-item {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.4rem;
    padding: 0;
    background: transparent;
    border-radius: 0;
    margin-bottom: 0;
}

.wizard-container .settings-item-label {
    flex: none;
    font-weight: 600;
    font-size: 0.8125rem;
    color: var(--goalfix-dark);
    line-height: 1.35;
}

.wizard-container .settings-item-label .text-muted {
    font-weight: 500;
    margin-top: 0.15rem;
}

.wizard-container .settings-item-value {
    min-width: 0;
    width: 100%;
}

/* Product / metric fields */
.wizard-container .wizard-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wizard-gap);
}

/* Business type cards */
.wizard-container .business-type-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.wizard-container .business-type-card {
    padding: clamp(1.1rem, 2.5vw, 1.5rem) 1rem;
    border: 2px solid var(--goalfix-gray-200);
    border-radius: var(--wizard-radius);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s, background 0.2s;
    height: 100%;
    background: #fff;
    min-width: 0;
}

.wizard-container .business-type-card:hover {
    border-color: var(--goalfix-accent);
    box-shadow: 0 4px 16px rgba(18, 179, 239, 0.12);
    transform: translateY(-2px);
}

.wizard-container .business-type-card.selected {
    border-color: var(--goalfix-accent);
    background: rgba(18, 179, 239, 0.06);
}

.wizard-container .business-type-card-disabled {
    cursor: not-allowed;
    opacity: 0.72;
    pointer-events: none;
}

.wizard-container .business-type-card-disabled:hover {
    transform: none;
    border-color: var(--goalfix-gray-200);
    box-shadow: none;
}

.wizard-container .business-type-card i {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    color: var(--goalfix-accent);
    line-height: 1;
}

.wizard-container .business-type-card-disabled i {
    opacity: 0.65;
}

.wizard-container .business-type-card h5 {
    color: var(--goalfix-dark);
    margin: 0.75rem 0 0.35rem;
    font-size: 0.95rem;
    line-height: 1.3;
}

.wizard-container .business-type-card p {
    font-size: 0.8125rem;
    margin: 0;
    line-height: 1.4;
}

/* Expense rows – compact grouped tables */
.wizard-container .wizard-expense-stack {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
}

.wizard-container .wizard-expense-group {
    border: 1px solid var(--goalfix-gray-200);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.wizard-container .wizard-expense-group-head {
    padding: 0.55rem 0.9rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--goalfix-primary-dark);
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid var(--goalfix-gray-200);
}

.wizard-container .wizard-expense-rows {
    display: flex;
    flex-direction: column;
}

.wizard-container .wizard-expense-row {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(8.5rem, 11rem) 2.5rem;
    gap: 0.65rem;
    align-items: center;
    padding: 0.55rem 0.9rem;
    border-bottom: 1px solid var(--goalfix-gray-100);
    background: transparent;
    margin: 0;
    border-radius: 0;
}

.wizard-container .wizard-expense-row:last-child {
    border-bottom: 0;
}

.wizard-container .wizard-expense-row--head {
    padding: 0.4rem 0.9rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    background: #fff;
}

.wizard-container .wizard-expense-row--head span:last-child {
    width: 2.5rem;
}

.wizard-container .wizard-expense-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--goalfix-dark);
    line-height: 1.3;
}

.wizard-container .wizard-expense-name-cell .input-modern {
    margin: 0;
    padding: 0.5rem 0.7rem;
}

.wizard-container .wizard-expense-amount-cell .input-group {
    max-width: 11rem;
    margin-left: auto;
}

.wizard-container .wizard-expense-action-cell {
    display: flex;
    justify-content: flex-end;
    min-height: 2rem;
}

.wizard-container .wizard-expense-action-cell .btn {
    padding: 0.25rem 0.4rem;
    min-width: 0;
}

.wizard-container .wizard-summary-rows {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

/* Legacy per-item card (capex/funding still use expense-field) */
.wizard-container .expense-field:not(.wizard-expense-row) {
    background: #fff;
    padding: 0.85rem;
    border: 1px solid var(--goalfix-gray-200);
    border-radius: 12px;
    margin-bottom: 0.75rem;
}

.wizard-container .expense-field-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: end;
}

.wizard-container .expense-field-actions {
    display: flex;
    align-items: center;
    min-height: 2.75rem;
}

.wizard-container .expense-field-actions:empty {
    display: none;
}

.wizard-container .expense-field .btn {
    white-space: nowrap;
    min-width: 2.5rem;
}

/* Preview / summary */
.wizard-container .preview-box {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid var(--goalfix-gray-200);
    border-radius: 12px;
    padding: clamp(1rem, 2.5vw, 1.25rem);
}

.wizard-container .preview-title {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--goalfix-dark);
    margin-bottom: 0.75rem;
}

.wizard-container .wizard-preview-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    text-align: center;
}

.wizard-container .wizard-preview-stats .h5 {
    font-size: clamp(0.95rem, 2.4vw, 1.15rem);
    word-break: break-word;
}

.wizard-container .wizard-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem 1.5rem;
}

.wizard-container .wizard-review-grid p {
    margin-bottom: 0.35rem;
    word-break: break-word;
}

/* Navigation */
.wizard-container .wizard-navigation {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-top: clamp(1.5rem, 3vw, 2.25rem);
    padding-top: 1.25rem;
    border-top: 1px solid var(--goalfix-gray-200);
}

.wizard-container .wizard-nav-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
    margin-left: auto;
}

.wizard-container .wizard-navigation .btn {
    white-space: nowrap;
}

/* Responsive breakpoints */
@media (max-width: 900px) {
    .wizard-container {
        --wizard-step-size: 1.75rem;
    }

    .wizard-container .wizard-step-pill .wizard-step-label {
        font-size: 0.625rem;
    }
}

@media (max-width: 768px) {
    .content-body:has(.wizard-container) > .container-fluid {
        padding-top: 0.35rem !important;
    }

    .wizard-container .progress-indicator {
        padding: 0.55rem 0.5rem 0.6rem;
        margin-bottom: 0.7rem;
    }

    .wizard-container {
        --wizard-step-size: 1.65rem;
    }

    .wizard-container .wizard-field-grid,
    .wizard-container .project-settings-fields,
    .wizard-container .wizard-step-fields,
    .wizard-container .wizard-metrics,
    .wizard-container .wizard-review-grid,
    .wizard-container .wizard-preview-stats {
        grid-template-columns: 1fr;
    }

    .wizard-container .wizard-preview-stats {
        text-align: left;
    }

    .wizard-container .wizard-preview-stats > div {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 0.75rem;
        padding: 0.45rem 0;
        border-bottom: 1px solid var(--goalfix-gray-200);
    }

    .wizard-container .wizard-preview-stats > div:last-child {
        border-bottom: 0;
    }

    .wizard-container .expense-field-grid,
    .wizard-container .expense-field-grid--two {
        grid-template-columns: 1fr;
    }

    .wizard-container .expense-field-grid .expense-field-actions {
        justify-self: start;
    }

    .wizard-container .wizard-expense-row {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "name action"
            "amount amount";
        gap: 0.4rem 0.65rem;
        padding: 0.7rem 0.85rem;
    }

    .wizard-container .wizard-expense-row--head {
        display: none;
    }

    .wizard-container .wizard-expense-name-cell {
        grid-area: name;
    }

    .wizard-container .wizard-expense-amount-cell {
        grid-area: amount;
    }

    .wizard-container .wizard-expense-amount-cell .input-group {
        max-width: none;
        margin-left: 0;
    }

    .wizard-container .wizard-expense-action-cell {
        grid-area: action;
    }

    .wizard-container .wizard-step-pill .wizard-step-label {
        display: none;
    }

    .wizard-container .wizard-step-pill.is-active::after {
        content: attr(data-label);
        display: block;
        margin-top: 0.35rem;
        font-size: 0.7rem;
        font-weight: 700;
        color: #1f19ba;
        white-space: nowrap;
    }

    .wizard-container .wizard-navigation {
        flex-direction: column;
        align-items: stretch;
    }

    .wizard-container .wizard-nav-actions {
        margin-left: 0;
        width: 100%;
    }

    .wizard-container .wizard-nav-actions .btn,
    .wizard-container .wizard-navigation > .d-flex .btn {
        flex: 1 1 auto;
    }

    .wizard-container .wizard-preview-stats .text-muted {
        font-size: 0.75rem;
    }
}

@media (max-width: 480px) {
    .wizard-container .business-type-grid {
        grid-template-columns: 1fr;
    }
}

/* Model Parameters – About section spacing */
#model_parameters .model-parameters-help {
    padding: 1.25rem 1.5rem;
    margin-top: 0.5rem;
}
#model_parameters .model-parameters-help-title {
    margin-bottom: 1.25rem;
    font-size: 1.125rem;
    font-weight: 600;
}
#model_parameters .model-parameters-help p {
    margin-bottom: 1.25rem;
    line-height: 1.5;
}
#model_parameters .model-parameters-help p:last-child {
    margin-bottom: 0;
}

/* Scenario Settings – flat layout (no nested cards) */
#scenario_settings .scenario-settings-page {
    padding-top: 0.25rem;
}
#scenario_settings .scenario-settings-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    margin-bottom: 0.5rem;
}
#scenario_settings .scenario-settings-title i {
    color: var(--goalfix-primary-light);
}
#scenario_settings .scenario-settings-intro {
    color: var(--goalfix-gray-700);
    font-size: 0.9375rem;
    margin-bottom: 2rem;
}
#scenario_settings .scenario-section {
    padding: 1.25rem 0;
    border-bottom: 1px solid var(--goalfix-gray-200);
}
#scenario_settings .scenario-section:last-of-type {
    border-bottom: 0;
}
#scenario_settings .scenario-section-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}
#scenario_settings .scenario-section-heading {
    margin: 0;
    font-weight: 600;
    font-size: 1rem;
    color: var(--goalfix-dark);
}
#scenario_settings .scenario-section-desc {
    color: var(--goalfix-gray-700);
    font-size: 0.875rem;
    margin-bottom: 2.5rem;
}
#scenario_settings .scenario-section .asset-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.125rem;
    flex-shrink: 0;
}
#scenario_settings .scenario-icon-baseline {
    background: linear-gradient(135deg, #6b7280, #4b5563);
}
#scenario_settings .scenario-icon-best {
    background: linear-gradient(135deg, #10b981, #059669);
}
#scenario_settings .scenario-icon-worst {
    background: linear-gradient(135deg, #ef4444, #dc2626);
}
#scenario_settings .scenario-section .settings-item {
    margin-bottom: 0.75rem;
}
#scenario_settings .scenario-field-hint {
    font-size: 0.75rem;
    margin-top: 0.75rem;
    margin-bottom: 0.6rem;
    line-height: 1.4;
}
#scenario_settings .scenario-upgrade-alert {
    margin-top: 1rem;
}

/* Section header in model tool */
#current-section-title {
    color: var(--goalfix-primary-dark);
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 5px;
}

#current-section-breadcrumb {
    color: var(--goalfix-gray-700);
    font-size: 13px;
    display: block;
}

/* Card header for model tool */
.card-header.bg-white {
    background-color: white !important;
    border-bottom: 2px solid var(--goalfix-gray-200);
    padding: 15px 20px;
}

/* Mobile: Reduce card header padding */
@media (max-width: 768px) {
    .card-header.bg-white {
        padding: 10px 12px;
    }
}

@media (max-width: 576px) {
    .card-header.bg-white {
        padding: 8px 10px;
    }
}

.card-header.bg-white h5 {
    margin: 0;
    line-height: 1.4;
}

/* Model page: full-width layout for model input tabs */
.model-page.model-input-active .model-page-card {
    border: 0;
    box-shadow: none;
    background: transparent;
    margin-bottom: 0;
}

.model-page.model-input-active {
    margin-left: -0.75rem;
    margin-right: -0.75rem;
    width: calc(100% + 1.5rem);
    max-width: none;
}

@media (max-width: 767px) {
    .model-page.model-input-active {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        width: calc(100% + 1.5rem);
    }
}

@media (max-width: 575px) {
    .model-page.model-input-active {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        width: calc(100% + 1rem);
    }
}

.content-body .header .header-left .dashboard_bar .model-page-subtitle,
.dashboard_bar .header-section-divider {
    color: #64748b;
    font-weight: 500;
}

.model-input-header-actions,
.product-table-header-actions,
.fixed-expenses-header-actions {
    align-items: center;
}

.model-input-header-actions #btnSave,
.product-table-header-actions #btnSave,
.fixed-expenses-header-actions #btnSave {
    white-space: nowrap;
}

/* Model card header: title left, Save Model button right (Kubayar layout) */
.model-card-header .model-header-actions {
    margin-left: auto;
}
.model-card-header .d-flex {
    gap: 1rem;
}
.card-header #btnSave {
    white-space: nowrap;
}

/* Section info icon */
.card-header .text-muted i {
    vertical-align: middle;
    margin-right: 4px;
}

/* Scenario controls bar (Sensitivity / KFI etc.): alignment, colouring, description */
#scenarioControlsBar.scenario-controls-bar {
    padding: 1.25rem 1.5rem !important;
    background: linear-gradient(180deg, #f0f4ff 0%, #f8fafc 100%) !important;
    border-bottom: 1px solid #e2e8f0;
    border-left: 4px solid var(--goalfix-accent, #667eea);
}

/* Description: bigger and bolder */
.scenario-bar-description {
    font-size: 1rem;
    font-weight: 600;
    color: #334155;
    line-height: 1.4;
}

.scenario-bar-icon {
    color: var(--goalfix-accent, #667eea);
    font-size: 1.25rem;
}

/* All blocks same height and alignment */
.scenario-bar-inputs {
    align-items: stretch;
}

#scenarioControlsBar .input-group {
    min-width: 0;
    min-height: 40px;
}

#scenarioControlsBar .input-group-text,
#scenarioControlsBar .form-control,
#scenarioControlsBar .form-select {
    min-height: 40px;
    height: 40px;
    font-size: 0.9375rem;
    border: 1px solid #cbd5e1;
    background-color: #fff;
    color: #1e293b;
}

#scenarioControlsBar .input-group-text {
    font-weight: 600;
    background-color: #f1f5f9;
    border-right: 0;
    color: #475569;
}

#scenarioControlsBar .input-group .form-control,
#scenarioControlsBar .input-group .form-select {
    border-left: 1px solid #cbd5e1;
}

#scenarioControlsBar .input-group .form-select {
    flex: 1;
    min-width: 0;
}

#scenarioControlsBar .input-group:focus-within .input-group-text,
#scenarioControlsBar .input-group:focus-within .form-control,
#scenarioControlsBar .input-group:focus-within .form-select {
    border-color: var(--goalfix-accent, #667eea);
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.2);
}

/* Responsive header on mobile */
@media (max-width: 768px) {
    .card-header.bg-white .d-flex,
    .model-card-header .d-flex {
        flex-direction: column;
        align-items: stretch !important;
        gap: 10px;
    }
    
    .model-card-header .model-header-actions {
        margin-left: 0;
    }
    
    .card-header #btnSave {
        width: 100%;
    }
}

/* ========================================
   Gradient Backgrounds
   ======================================== */
.bg-gradient-primary {
    background: var(--goalfix-gradient) !important;
}

.bg-gradient-vertical {
    background: var(--goalfix-gradient-vertical) !important;
}

/* Auth pages background — CSS-relative paths (stable across clean URLs) */
.auth-bg {
    min-height: 100vh;
    width: 100%;
    background-color: #0d2137;
    background-image: url("../images/auth-bg.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* ========================================
   Tables - Kubayar themed (fonts & look)
   ======================================== */

/* Base table styling - aligned to Kubayar */
.table {
    font-family: var(--font-family-base, Roboto, sans-serif);
    font-size: 0.875rem;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    margin-bottom: 1rem;
    color: var(--text, #888888);
}

/* Table headers - Kubayar style */
.table thead th {
    background-color: transparent;
    color: var(--text-dark, #0b141b);
    font-weight: 500;
    font-size: 1rem;
    text-transform: capitalize;
    letter-spacing: 0.0313rem;
    padding: 0.9375rem 0.625rem;
    border-top: none;
    border-bottom: 0.0625rem solid var(--border, #EAE9ED);
    position: sticky;
    top: 0;
    z-index: 10;
    white-space: nowrap;
    text-align: right;
}

.table thead th:first-child {
    text-align: left;
    border-top-left-radius: 0.5rem;
}

.table thead th:last-child {
    border-top-right-radius: 0.5rem;
    text-align: right !important;
}

/* Sub-headers (if any) */
.table thead tr:nth-child(2) th {
    background-color: var(--light, #f4f4f6);
    font-size: 0.9375rem;
    padding: 0.625rem 0.9375rem;
    text-transform: capitalize;
    color: var(--text-dark, #0b141b);
}

/* Table body cells - Kubayar spacing & borders */
.table tbody td {
    padding: 0.9375rem 0.625rem;
    border-bottom: 0;
    border-color: var(--border, #EAE9ED);
    color: var(--text-dark, #0b141b);
    font-size: 0.875rem;
    font-weight: 400;
    text-align: right;
    vertical-align: middle;
    transition: all 0.15s ease;
}

.table tbody td:first-child {
    text-align: left;
    font-weight: 500;
    color: var(--text-dark, #0b141b);
}

/* Striped rows - Kubayar light bg */
.table tbody tr:nth-child(even) {
    background-color: var(--l-bg, #f2f4fa);
}

/* Hover effect - Kubayar style */
.table-hover tbody tr:hover {
    background-color: var(--l-bg, #f2f4fa);
    cursor: pointer;
}

.table-hover tbody tr:hover td {
    color: var(--primary, #5A45AA);
}

/* Bold/subtotal rows - Kubayar primary tint */
.table tbody tr.subtotal td,
.table tbody tr.total td,
.table tbody tr[style*="font-weight: bold"] td,
.table tbody td.leftHeadingLabel,
.table tbody td.subTotal {
    font-weight: 700;
    background-color: var(--rgba-primary-1, rgba(90, 69, 170, 0.1));
    border-top: 0.0625rem solid var(--border, #EAE9ED);
    border-bottom: 0.0625rem solid var(--border, #EAE9ED);
}

/* Category headers within table body - Kubayar primary */
.table tbody tr.category-header td {
    background: var(--rgba-primary-1, rgba(90, 69, 170, 0.1));
    font-weight: 700;
    color: var(--primary-dark, #20193d);
    font-size: 0.8125rem;
    padding: 0.875rem 0.625rem;
    border-top: 0.125rem solid var(--border, #EAE9ED);
    text-transform: capitalize;
    letter-spacing: 0.0313rem;
}

/* Numerical columns - Kubayar text gray for numbers */
.table tbody td:not(:first-child) {
    font-variant-numeric: tabular-nums;
    color: var(--text-gray, #717579);
}

/* Number formatting hints */
.table tbody td[style*="color: red"],
.table tbody td.negative {
    color: var(--secondary, #F84646) !important;
    font-weight: 600;
}

.table tbody td.positive {
    color: #09BD3C !important;
}

/* Right-align numerical columns */
.table tbody td:not(:first-child),
.table thead th:not(:first-child) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Better spacing for month/year columns */
.table th[colspan] {
    border-bottom: 0.0625rem solid var(--border, #EAE9ED);
}

/* Indented rows (sub-items) */
.table tbody td.indented,
.table tbody td[style*="padding-left"] {
    padding-left: 1.875rem !important;
    font-size: 0.8125rem;
    color: var(--text-gray, #717579);
}

/* Table container - Kubayar card look */
.tab-pane table,
.card-body > table {
    border-radius: 0.5rem;
    overflow: hidden;
    border: 0.0625rem solid var(--border, #EAE9ED);
}

/* Scrollable tables - Kubayar style */
.table-responsive {
    border-radius: 0.5rem;
    border: 0.0625rem solid var(--border, #EAE9ED);
}

/* Loading state placeholder */
.table tbody tr.loading td {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Focus state for accessibility - Kubayar primary */
.table tbody tr:focus-within {
    outline: 0.125rem solid var(--primary, #5A45AA);
    outline-offset: -0.125rem;
}

/* List-users / admin tables - Kubayar themed header (table-light override) */
.table.table-light thead th,
.table thead.table-light th {
    background-color: var(--light, #f4f4f6);
    color: var(--text-dark, #0b141b);
    font-weight: 500;
    font-size: 1rem;
    text-transform: capitalize;
    letter-spacing: 0.0313rem;
    border-bottom: 0.0625rem solid var(--border, #EAE9ED);
}

/* DataTable / display tables - Kubayar font and spacing */
table.dataTable,
.table.display {
    font-size: 0.875rem;
    color: var(--text-gray, #717579);
}

table.dataTable thead th,
.table.display thead th {
    padding: 1rem 0.9375rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--text-dark, #0b141b);
}

table.dataTable tbody td,
.table.display tbody td {
    padding: 0.85rem 0.9375rem;
    font-size: 0.875rem;
    font-weight: 400;
}

/* Print-friendly styling */
@media print {
    .table {
        font-size: 10px;
    }
    
    .table thead th {
        background: var(--primary, #5A45AA) !important;
        color: #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    
    .table tbody tr:hover {
        background: none !important;
    }
}

/* ========================================
   RESPONSIVE BREAKPOINTS - Financial Statements
   ======================================== */

/* Extra Large Screens (1400px+) - Use more space */
@media (min-width: 1400px) {
    :root {
        --column-min-width: 110px;
        --column-max-width: 140px;
        --left-header-width: 220px;
    }
    
    .monthLabel,
    .revenueLabel,
    .subTotal {
        font-size: calc(14px + var(--goalfix-font-delta));
    }
    
    .leftHeadingLabel {
        font-size: calc(14px + var(--goalfix-font-delta));
    }
}

/* Large Screens (1200px - 1399px) - Standard desktop */
@media (min-width: 1200px) and (max-width: 1399px) {
    :root {
        --column-min-width: 100px;
        --column-max-width: 130px;
        --left-header-width: 200px;
    }
}

/* Medium Screens (992px - 1199px) - Small desktop/large tablet landscape */
@media (min-width: 992px) and (max-width: 1199px) {
    :root {
        --column-min-width: 85px;
        --column-max-width: 110px;
        --left-header-width: 160px;
    }
    
    .monthLabel,
    .revenueLabel,
    .subTotal {
        font-size: calc(12px + var(--goalfix-font-delta));
        padding: 8px;
    }
}

/* Small Screens (768px - 991px) - Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    :root {
        --column-min-width: 75px;
        --column-max-width: 95px;
        --left-header-width: 140px;
    }
    
    .monthLabel {
        font-size: calc(10px + var(--goalfix-font-delta));
        padding: 10px 6px;
    }
    
    .revenueLabel,
    .subTotal {
        font-size: calc(11px + var(--goalfix-font-delta));
        padding: 8px 6px;
    }
    
    .leftHeadingLabel,
    .leftSubHeadingLabel {
        font-size: calc(12px + var(--goalfix-font-delta));
    }
    
    .tab-pane {
        padding: 15px;
    }
}

/* Extra Small Screens (576px - 767px) - Mobile landscape */
@media (min-width: 576px) and (max-width: 767px) {
    :root {
        --column-min-width: 65px;
        --column-max-width: 80px;
        --left-header-width: 120px;
    }
    
    .monthLabel {
        font-size: calc(9px + var(--goalfix-font-delta));
        padding: 8px 5px;
        letter-spacing: 0;
    }
    
    .revenueLabel,
    .subTotal {
        font-size: calc(10px + var(--goalfix-font-delta));
        padding: 6px 4px;
    }
    
    .leftHeadingLabel,
    .leftSubHeadingLabel {
        font-size: calc(11px + var(--goalfix-font-delta));
        margin-left: 10px;
    }
    
    .tab-pane {
        padding: 10px;
    }
    
    .tab-pane > h3 {
        font-size: 18px;
    }
}

/* Very Small Screens (< 576px) - Mobile portrait */
@media (max-width: 575px) {
    :root {
        --column-min-width: 60px;
        --column-max-width: 70px;
        --left-header-width: 100px;
    }
    
    .monthLabel {
        font-size: calc(8px + var(--goalfix-font-delta));
        padding: 6px 4px;
        letter-spacing: 0;
    }
    
    .revenueLabel,
    .subTotal {
        font-size: calc(9px + var(--goalfix-font-delta));
        padding: 5px 3px;
    }
    
    .leftHeadingLabel,
    .leftSubHeadingLabel {
        font-size: calc(10px + var(--goalfix-font-delta));
        margin-left: 5px;
    }
    
    .tab-pane {
        padding: 8px;
    }
    
    .tab-pane > h3 {
        font-size: 16px;
        padding: 10px 0;
    }
    
    .leftSubHeadingLabel::before {
        display: none; /* Hide arrow on very small screens */
    }
}

/* Responsive table adjustments - Kubayar spacing */
@media (max-width: 768px) {
    .table {
        font-size: 0.8125rem;
    }
    
    .table thead th,
    .table tbody td {
        padding: 0.5rem 0.375rem;
    }
    
    .table thead th {
        font-size: 0.875rem;
    }
}

/* ========================================
   Table Utility Classes
   ======================================== */

/* Compact table variant - Kubayar spacing */
.table-compact {
    font-size: 0.8125rem;
}

.table-compact thead th,
.table-compact tbody td {
    padding: 0.5rem 0.625rem;
}

/* Bordered table - Kubayar border */
.table-bordered {
    border: 0.0625rem solid var(--border, #EAE9ED);
}

.table-bordered thead th,
.table-bordered tbody td {
    border-color: var(--border, #EAE9ED);
}

/* Centered numbers */
.table-centered tbody td {
    text-align: center !important;
}

/* Highlight specific columns - Kubayar primary tint */
.table tbody td.highlight,
.table tbody td.year-total {
    background-color: var(--rgba-primary-1, rgba(90, 69, 170, 0.1));
    font-weight: 600;
}

/* Special styling for KFI tables - Kubayar border */
.kfi-table tbody tr {
    border-bottom: 0.0625rem solid var(--border, #EAE9ED);
}

.kfi-table tbody tr:last-child {
    border-bottom: 0.125rem solid var(--primary, #5A45AA);
}

/* Better percentage display */
.table tbody td.percentage::after {
    content: '%';
    margin-left: 2px;
    color: var(--text-gray, #717579);
    font-size: 0.75rem;
}

/* Currency symbol styling - REMOVED per user request */
/* .table tbody td.currency::before {
    content: 'R ';
    color: var(--goalfix-gray-700);
    font-weight: normal;
} */

/* Table section dividers */
.table tbody tr.section-divider td {
    height: 1.25rem;
    background: var(--light, #f4f4f6);
    border: none;
    padding: 0;
}

/* Empty state */
.table tbody tr.empty-state td {
    text-align: center;
    padding: 2.5rem;
    color: var(--text-gray, #717579);
    font-style: italic;
}

/* Freeze first column on horizontal scroll - Kubayar card bg */
.table-sticky-first tbody td:first-child,
.table-sticky-first thead th:first-child {
    position: sticky;
    left: 0;
    background: var(--card, #fff);
    z-index: 5;
    box-shadow: 0.125rem 0 0.25rem rgba(0, 0, 0, 0.05);
}

.table-sticky-first thead th:first-child {
    z-index: 11;
}

/* Smooth scroll for wide tables */
.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-responsive::-webkit-scrollbar {
    height: 8px;
}

.table-responsive::-webkit-scrollbar-track {
    background: var(--light, #f4f4f6);
    border-radius: 0.25rem;
}

.table-responsive::-webkit-scrollbar-thumb {
    background: var(--border, #EAE9ED);
    border-radius: 0.25rem;
}

.table-responsive::-webkit-scrollbar-thumb:hover {
    background: var(--primary, #5A45AA);
}

/* ========================================
   Pricing Cards
   ======================================== */
.pricing-card {
    border: 2px solid var(--goalfix-gray-200);
    transition: all 0.3s ease;
}

.pricing-card:hover {
    border-color: var(--goalfix-primary-light);
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(31, 25, 186, 0.15);
}

.pricing-card.featured {
    border-color: var(--goalfix-primary-light);
    background: linear-gradient(135deg, rgba(31, 25, 186, 0.02) 0%, rgba(9, 218, 197, 0.02) 100%);
}

/* ========================================
   Features page — Plans at a glance cards
   ======================================== */
.goalfix-plans-glance .goalfix-plan-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
    padding: 2rem 1.5rem 1.75rem;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.goalfix-plans-glance .goalfix-plan-card:hover {
    transform: translateY(-6px);
    border-color: rgba(31, 25, 186, 0.18);
    box-shadow: 0 16px 40px rgba(31, 25, 186, 0.12);
}

.goalfix-plans-glance .goalfix-plan-card__icon {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.15rem;
    background: linear-gradient(145deg, rgba(31, 25, 186, 0.08) 0%, rgba(9, 218, 197, 0.12) 100%);
    color: var(--goalfix-primary-dark, #1f19ba);
    font-size: 1.75rem;
    line-height: 1;
}

.goalfix-plans-glance .goalfix-plan-card__title {
    margin: 0 0 0.65rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--headingColor, #0f172a);
}

.goalfix-plans-glance .goalfix-plan-card__text {
    flex: 1 1 auto;
    margin: 0 0 1.35rem;
    font-size: 0.9375rem;
    line-height: 1.55;
    color: var(--contentColor, #5f6c76);
}

.goalfix-plans-glance .goalfix-plan-card__btn {
    width: 100%;
    max-width: 220px;
    border-radius: 10px;
    font-weight: 600;
    padding: 0.65rem 1.1rem;
}

.goalfix-plans-glance .goalfix-plan-card--featured {
    border: none;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(135deg, #1f19ba 0%, #09dac5 100%) border-box;
    border: 2px solid transparent;
    box-shadow: 0 18px 48px rgba(31, 25, 186, 0.16);
    padding-top: 2.35rem;
    transform: translateY(-4px);
}

.goalfix-plans-glance .goalfix-plan-card--featured:hover {
    transform: translateY(-10px);
    box-shadow: 0 24px 56px rgba(31, 25, 186, 0.2);
}

.goalfix-plans-glance .goalfix-plan-card--featured .goalfix-plan-card__icon {
    background: linear-gradient(135deg, #1f19ba 0%, #09dac5 100%);
    color: #fff;
    box-shadow: 0 8px 20px rgba(31, 25, 186, 0.28);
}

.goalfix-plans-glance .goalfix-plan-card__badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.9rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #fff;
    background: linear-gradient(135deg, #1f19ba 0%, #09dac5 100%);
    box-shadow: 0 6px 16px rgba(31, 25, 186, 0.28);
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .goalfix-plans-glance .goalfix-plan-card--featured {
        transform: none;
    }
    .goalfix-plans-glance .goalfix-plan-card--featured:hover {
        transform: translateY(-6px);
    }
}

/* ========================================
   Badges & Tags
   ======================================== */
.badge-goalfix {
    background: var(--goalfix-gradient);
    color: white;
}

/* ========================================
   Financial Model Specific Styling - ENHANCED
   ======================================== */

/* Financial statement container */
.tab-content .tab-pane {
    position: relative;
}

/* Container for label-based layouts */
.tab-pane > h3 {
    color: var(--goalfix-primary-dark);
    font-weight: 700;
    margin-bottom: 10px;
    padding: 15px 0;
    border-bottom: 3px solid var(--goalfix-primary-light);
    font-size: 20px;
    text-transform: capitalize;
}

/* Status indicator (e.g., "In Balance") */
.tab-pane > label.monthLabel[style*="color:blue"] {
    background: linear-gradient(135deg, rgba(31, 25, 186, 0.1) 0%, rgba(9, 218, 197, 0.1) 100%);
    color: var(--goalfix-primary-dark) !important;
    padding: 8px 16px;
    border-radius: 6px;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 20px;
    border: 2px solid var(--goalfix-primary-light);
}

/* Keep existing functional styles from css.css */
[id^=productSell], [id^=productCost] {
    width: 100px;
}

[id^=product] {
    margin-bottom: 10px;
}

[id^=month] {
    margin-bottom: 10px;
    width: 80px;
    margin-left: 5px;
}

/* ENHANCED: Month/Year Column Headers - FIXED WIDTH */
.monthLabel {
    margin-left: 5px;
    text-align: right;
    width: 95px;
    font-weight: 600;
    font-size: 11px;
    color: white !important;
    background: linear-gradient(135deg, #1f19ba 0%, #1a1599 100%);
    padding: 12px 10px;
    display: inline-block;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.monthLabel:first-of-type {
    border-top-left-radius: 8px;
}

.monthLabel:last-of-type {
    border-top-right-radius: 8px;
    border-right: none;
}

/* ENHANCED: Revenue/Number Labels - FIXED WIDTH */
.revenueLabel {
    margin-left: 5px;
    text-align: right;
    width: 95px;
    color: var(--goalfix-gray-900);
    font-family: 'Courier New', 'Consolas', monospace;
    font-size: 13px;
    padding: 10px;
    display: inline-block;
    background: white;
    border-right: 1px solid var(--goalfix-gray-200);
    border-bottom: 1px solid var(--goalfix-gray-200);
    transition: all 0.2s ease;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Year totals in blue */
.revenueLabel[style*="color:blue"] {
    background: rgba(31, 25, 186, 0.05);
    font-weight: 600;
    border-right: 2px solid var(--goalfix-primary-light);
}

.fieldDescription {
    color: var(--label-color);
    width: 220px;
    margin: 0px;
}

.fieldInput {
    width: 220px;
    height: 30px;
    color: var(--goalfix-accent);
    border: none;
}

.fieldInputWide {
    width: 620px;
    height: 30px;
    color: var(--goalfix-accent);
    margin-left: 10px;
    border: none;
}

/* ENHANCED: Subtotal cells - FIXED WIDTH */
.subTotal {
    margin-left: 5px;
    text-align: right;
    width: 95px;
    color: var(--goalfix-dark);
    font-weight: 700;
    font-family: 'Courier New', 'Consolas', monospace;
    font-size: 13px;
    padding: 10px;
    display: inline-block;
    background: rgba(31, 25, 186, 0.08);
    border-right: 1px solid var(--goalfix-primary-light);
    border-bottom: 2px solid var(--goalfix-primary-light);
    border-top: 2px solid var(--goalfix-primary-light);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ENHANCED: Main category labels - FIXED WIDTH */
.leftHeadingLabel {
    margin-left: 20px;
    width: 180px;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    font-size: 13px;
    padding: 10px 0;
    display: inline-block;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.leftHeadingLabelSubTotal {
    margin-left: 20px;
    width: 180px;
    text-align: right;
    font-weight: normal;
    color: var(--goalfix-gray-700);
    padding: 10px 0;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.leftHeadingLabelEditable {
    margin-left: 20px;
    width: 180px;
    font-weight: 700;
    background: linear-gradient(90deg, rgba(31, 25, 186, 0.15) 0%, rgba(9, 218, 197, 0.10) 100%);
    color: var(--goalfix-primary-dark);
    padding: 8px 12px;
    border-radius: 4px;
    display: inline-block;
    border-left: 3px solid var(--goalfix-primary-light);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ENHANCED: Sub-category labels - FIXED WIDTH */
.leftSubHeadingLabel {
    margin-left: 20px;
    width: 180px;
    font-style: normal;
    color: var(--goalfix-gray-700);
    font-size: 13px;
    padding: 8px 0;
    padding-left: 15px;
    display: inline-block;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.leftSubHeadingLabel::before {
    content: "→";
    position: absolute;
    left: 0;
    color: var(--goalfix-primary-light);
    font-weight: bold;
}

/* ========================================
   Row-Based Layout Enhancements
   ======================================== */

/* Create visual rows with hover effects */
.tab-pane br + .leftHeadingLabel,
.tab-pane br + .leftSubHeadingLabel {
    margin-top: 2px;
}

/* Hover effect for rows - wrap groups of labels */
.tab-pane {
    line-height: 0;
}

.tab-pane br,
.tab-pane p {
    display: block;
    height: 0;
    margin: 0;
    padding: 0;
}

/* Make label rows appear as table rows */
.tab-pane > * {
    vertical-align: middle;
}

/* Alternating row colors (simulate with nth-child on breaks) */
.tab-pane br:nth-of-type(even) ~ .revenueLabel:not([style*="color:blue"]),
.tab-pane br:nth-of-type(even) ~ .subTotal {
    background-color: rgba(247, 247, 247, 0.7);
}

/* Interactive row highlighting */
.revenueLabel:hover,
.subTotal:hover {
    background-color: rgba(41, 171, 226, 0.12);
    transform: translateX(2px);
    box-shadow: 0 2px 6px rgba(31, 25, 186, 0.1);
    cursor: pointer;
    z-index: 10;
    position: relative;
}

/* Hover effect for entire row */
.leftHeadingLabel:hover,
.leftSubHeadingLabel:hover {
    color: var(--goalfix-accent);
    cursor: pointer;
}

.leftHeadingLabel:hover ~ .revenueLabel,
.leftHeadingLabel:hover ~ .subTotal {
    background-color: rgba(41, 171, 226, 0.08);
}

/* Add shadow to statement container - RESPONSIVE */
.tab-pane {
    background: white;
    padding: 1rem 0.75rem;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    max-width: 100%;
    overflow-x: visible;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    position: relative;
}

/* Mobile: Reduce tab-pane padding for more data space */
@media (max-width: 768px) {
    .tab-pane {
        padding: 0.75rem 0.4rem;
        border-radius: 6px;
    }
}

@media (max-width: 576px) {
    .tab-pane {
        padding: 0.5rem 0.25rem;
        border-radius: 4px;
    }
}

/* Spacing between sections */
.tab-pane p {
    margin: 15px 0 0 0;
}

/* Financial statement wrapper for better responsiveness */
.tab-pane::-webkit-scrollbar {
    height: 10px;
}

.tab-pane::-webkit-scrollbar-track {
    background: var(--goalfix-gray-100);
    border-radius: 5px;
}

.tab-pane::-webkit-scrollbar-thumb {
    background: var(--goalfix-primary-light);
    border-radius: 5px;
}

.tab-pane::-webkit-scrollbar-thumb:hover {
    background: var(--goalfix-primary-dark);
}

/* Download button styling */
.tab-pane button[onclick*="downloadExcel"],
.tab-pane button[onclick*="download"] {
    margin-top: 30px;
    background: var(--goalfix-gradient);
    border: none;
    color: white;
    padding: 12px 24px;
    border-radius: 6px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(31, 25, 186, 0.3);
    transition: all 0.3s ease;
}

.tab-pane button[onclick*="downloadExcel"]:hover,
.tab-pane button[onclick*="download"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(31, 25, 186, 0.4);
}

/* Negative values in red - handled via JavaScript or class-based styling */
/* Note: CSS cannot directly detect text content. Add .negative class via JS if needed */

/* Container wrapper */
.tab-content {
    min-height: 400px;
}

/* Loading state */
.tab-pane.loading {
    opacity: 0.6;
    pointer-events: none;
}

/* Print styles for financial statements */
@media print {
    .monthLabel,
    .revenueLabel,
    .subTotal,
    .leftHeadingLabel,
    .leftSubHeadingLabel {
        border: 1px solid #ddd !important;
        page-break-inside: avoid;
    }
    
    .tab-pane {
        box-shadow: none;
        padding: 10px;
    }
    
    .tab-pane button {
        display: none;
    }
}

.dropdownStyleCashCredit {
    margin-left: 20px;
    width: 75px;
    font-style: italic;
    color: black;
}

.parametersFormating {
    text-align: right;
}

/* KFI Styling */
.kfiColumnHeading {
    width: 300px;
    color: grey;
    font-weight: bold;
}

.kfiColumnHeadingYear1,
.kfiColumnHeadingYear2 {
    width: 250px;
    color: grey;
    font-weight: bold;
}

.kfiHeading {
    width: 300px;
    color: var(--label-color);
    font-weight: bold;
}

.kfiValue {
    width: 250px;
    color: var(--label-color);
    font-weight: normal;
}

.kfiHeadingPercentage {
    width: 250px;
    color: var(--kfi-color);
    font-weight: bold;
    text-align: right;
    font-style: italic;
}

.kfiValuePercentage {
    width: 250px;
    color: var(--kfi-color);
    font-weight: normal;
    font-style: italic;
    padding-left: 48px;
}

/* Sensitivity Analysis */
.sensitivityTextHeading {
    width: 200px;
    font-weight: bold;
}

.sensitivityText {
    width: 200px;
}

/* Modern Sensitivity Analysis Styling */
.sensitivity-analysis-container {
    padding: 1rem 0.75rem 1.5rem;
}

.sensitivity-analysis-container .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.sensitivity-table {
    font-size: 0.95rem;
    min-width: 900px;
    width: 100%;
}

/* Table header: square corners, flush under section header (no gap) */
.sensitivity-analysis-container .card-body.p-0 {
    padding-bottom: 1.5rem !important;
}

.sensitivity-analysis-container .card-header + .card-body .table-responsive {
    margin-top: 0;
}

/* Sensitivity table header: left-aligned, distinct colouring, square corners */
.sensitivity-thead th,
.sensitivity-table thead.sensitivity-thead th {
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 1.25rem 1rem;
    border-bottom: 2px solid #475569;
    white-space: nowrap;
    border-radius: 0 !important;
    text-align: left !important;
    background-color: #475569 !important;
    color: #f8fafc !important;
}

.sensitivity-table thead.sensitivity-thead th:first-child {
    border-top-left-radius: 0 !important;
}

.sensitivity-table thead.sensitivity-thead th:last-child {
    border-top-right-radius: 0 !important;
}

.sensitivity-table tbody td {
    padding: 1.5rem 1rem;
    vertical-align: middle;
    overflow: visible;
    line-height: 1.5;
}

.sensitivity-table tbody tr {
    transition: background-color 0.2s ease;
}

.sensitivity-table tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.02);
}

/* Sensitivity impact cell spacing */
.sensitivity-impact-cell {
    min-width: 250px;
    padding: 0.5rem 0;
}

.sensitivity-impact-cell .d-flex {
    flex-wrap: nowrap;
    gap: 0.5rem;
}

.sensitivity-impact-cell .fw-bold,
.sensitivity-impact-cell .text-muted {
    display: inline-block;
}

/* Prevent text overlap in variable column */
.sensitivity-table .icon-wrapper + div {
    flex: 1;
    min-width: 0;
}

.sensitivity-table .fw-bold {
    display: block;
    margin-bottom: 0.25rem;
}

.sensitivity-table small {
    display: block;
    line-height: 1.5;
}

.sensitivity-impact-cell .d-flex,
.sensitivity-impact-cell .fw-bold,
.sensitivity-impact-cell .text-muted {
    line-height: 1.5;
}

.bg-gradient-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

.bg-gradient-success {
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%) !important;
}

/* Sensitivity section headers: EBITDA & Bank Balance */
.sensitivity-section-header {
    padding: 1.25rem 1.5rem !important;
    border: none;
    border-radius: 0;
    margin-bottom: 0;
}

.sensitivity-section-header .sensitivity-header-icon-wrap {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.sensitivity-section-title {
    font-size: 1.375rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.sensitivity-section-subtitle {
    font-size: 0.9375rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.35;
    margin: 0.2rem 0 0 0;
}

/* EBITDA header: purple/blue gradient + icon badge */
.sensitivity-header-ebitda {
    background: linear-gradient(135deg, #5b6bc0 0%, #7c4dff 50%, #651fff 100%) !important;
    box-shadow: 0 2px 8px rgba(91, 107, 192, 0.25);
}

.sensitivity-header-ebitda .sensitivity-header-icon-wrap {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

/* Bank Balance header: teal/green gradient + icon badge */
.sensitivity-header-bank {
    background: linear-gradient(135deg, #0d9488 0%, #14b8a6 50%, #2dd4bf 100%) !important;
    box-shadow: 0 2px 8px rgba(13, 148, 136, 0.25);
}

.sensitivity-header-bank .sensitivity-header-icon-wrap {
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
}

@media (max-width: 576px) {
    .sensitivity-section-header {
        padding: 1rem 1.25rem !important;
    }
    .sensitivity-section-header .sensitivity-header-icon-wrap {
        width: 40px;
        height: 40px;
        min-width: 40px;
        font-size: 1.25rem;
    }
    .sensitivity-section-title {
        font-size: 1.2rem;
    }
    .sensitivity-section-subtitle {
        font-size: 0.875rem;
    }
}

.card.shadow-sm {
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.075) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card.shadow-sm:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Responsive adjustments for sensitivity analysis */
@media (max-width: 768px) {
    .sensitivity-table thead th,
    .sensitivity-table tbody td {
        padding: 1rem 0.5rem;
        font-size: 0.85rem;
    }
    
    .sensitivity-table .icon-wrapper {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        font-size: 0.8rem;
    }
    
    .sensitivity-impact-cell {
        min-width: 150px;
    }
    
    .sensitivity-impact-cell .fw-bold {
        font-size: 0.95rem !important;
    }
    
    .sensitivity-impact-cell .text-muted {
        font-size: 0.8rem !important;
    }
}

@media (max-width: 576px) {
    .sensitivity-table thead th,
    .sensitivity-table tbody td {
        padding: 0.75rem 0.4rem;
        font-size: 0.8rem;
    }
    
    .sensitivity-table .icon-wrapper {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        font-size: 0.75rem;
        margin-right: 0.5rem !important;
    }
    
    .sensitivity-impact-cell {
        min-width: 120px;
    }
}

/* Progress bars within sensitivity table */
.sensitivity-table .progress {
    background-color: rgba(0, 0, 0, 0.06);
}

.sensitivity-table .progress-bar {
    transition: width 0.6s ease;
}

/* Neutral (0%) impact: grey bar */
.sensitivity-table .progress-bar.bg-secondary {
    background-color: #6c757d !important;
}

/* Rank badges: distinct hierarchy (1st gold, 2nd silver, 3rd bronze, 4th grey) */
.sensitivity-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
    border-radius: 50%;
    line-height: 1;
}

.sensitivity-rank-badge.sensitivity-rank-1 {
    background: linear-gradient(135deg, #f0c14b 0%, #d4a017 100%);
    color: #1a1a1a;
    box-shadow: 0 1px 3px rgba(212, 160, 23, 0.35);
}

.sensitivity-rank-badge.sensitivity-rank-2 {
    background: linear-gradient(135deg, #a8a8a8 0%, #7a7a7a 100%);
    color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.sensitivity-rank-badge.sensitivity-rank-3 {
    background: linear-gradient(135deg, #c9a86c 0%, #a67c52 100%);
    color: #fff;
    box-shadow: 0 1px 3px rgba(166, 124, 82, 0.35);
}

.sensitivity-rank-badge.sensitivity-rank-4 {
    background: #e9ecef;
    color: #495057;
    font-weight: 600;
}

/* Icon wrapper styling */
.icon-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Key Insights: clear spacing and hierarchy */
.sensitivity-insight-card-body {
    padding: 1.25rem 1.5rem;
}

.sensitivity-insight-heading {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d !important;
    margin: 0 0 1rem 0;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
    line-height: 1.5;
}

.sensitivity-insight-block {
    margin-bottom: 1.5rem;
}

.sensitivity-insight-block:last-child {
    margin-bottom: 0;
}

.sensitivity-insight-block .sensitivity-insight-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    letter-spacing: 0.3px;
    margin-bottom: 0.35rem;
    text-transform: uppercase;
    line-height: 1.5;
}

.sensitivity-insight-block .sensitivity-insight-value {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
    line-height: 1.6;
}

/* Key insights cards (legacy h6 fallback) */
.sensitivity-analysis-container .card-body h6 {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Impact percentage in table: slightly bolder for scanability */
.sensitivity-impact-cell .fw-bold {
    font-size: 1.0625rem !important;
    font-weight: 700 !important;
}

/* Text Inputs */
.textInput {
    color: var(--goalfix-accent);
    border: none;
    text-align: right;
}

.textInputLeftAlign {
    color: var(--goalfix-accent);
    border: none;
    text-align: left;
}

/* Remove spinner from number inputs */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

/* Context Menu */
.context-menu {
    position: absolute;
    z-index: 2;
    text-align: center;
    background: white;
    border: 1px solid var(--goalfix-gray-300);
    border-radius: 4px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.context-menu ul {
    padding: 0px;
    margin: 5px;
    min-width: 150px;
    list-style: none;
}

.context-menu ul li {
    padding-bottom: 7px;
    padding-top: 7px;
    border: 0px solid black;
}

.context-menu ul li a {
    text-decoration: none;
    color: black;
}

.context-menu ul li:hover {
    background: var(--goalfix-gray-100);
}

/* ========================================
   Utility Classes
   ======================================== */
.text-goalfix-primary {
    color: var(--goalfix-primary-dark) !important;
}

.text-goalfix-accent {
    color: var(--goalfix-accent) !important;
}

.bg-goalfix-light {
    background-color: var(--goalfix-light) !important;
}

/* ========================================
   Responsive Adjustments
   ======================================== */
@media (max-width: 768px) {
    .leftHeadingLabel,
    .leftHeadingLabelSubTotal,
    .leftHeadingLabelEditable,
    .leftSubHeadingLabel {
        width: 120px;
    }
    
    .fieldInput,
    .fieldDescription {
        width: 180px;
    }
    
    .fieldInputWide {
        width: 100%;
    }
    
    .nav-tabs .nav-link {
        padding: 10px 12px;
        font-size: 14px;
    }
}

/* ========================================
   Page Title Box
   ======================================== */
.page-title-box {
    padding: 20px 0;
}

.page-title-box h4 {
    color: var(--goalfix-dark);
    font-weight: 600;
}

/* Mobile: Reduce page title box padding */
@media (max-width: 768px) {
    .page-title-box {
        padding: 12px 0;
    }
}

@media (max-width: 576px) {
    .page-title-box {
        padding: 8px 0;
    }
}

/* ========================================
   Footer
   ======================================== */
.footer {
    background: white;
    border-top: 1px solid var(--goalfix-gray-200);
    color: var(--goalfix-gray-700);
}

/* ========================================
   Loading States
   ======================================== */
.spinner-border-goalfix {
    color: var(--goalfix-accent);
}

/* ========================================
   User Tier Badge in Sidebar
   ======================================== */
.user-tier-badge-link {
    text-decoration: none;
    display: block;
    transition: all 0.3s ease;
}

.user-tier-badge-link:hover .user-tier-badge {
    background: rgba(41, 171, 226, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 2px 8px rgba(41, 171, 226, 0.3);
}

.user-tier-badge {
    background: rgba(41, 171, 226, 0.2);
    color: #29ABE2;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    margin: 10px;
    text-align: center;
    border: 1px solid rgba(41, 171, 226, 0.3);
    cursor: pointer;
    transition: all 0.3s ease;
}

/* ========================================
   Mobile Menu Button and Functionality
   ======================================== */
.button-toggle-menu {
    background: none;
    border: none;
    color: var(--goalfix-primary-dark);
    font-size: 24px;
    padding: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.button-toggle-menu:hover {
    color: var(--goalfix-accent);
    background: rgba(18, 179, 239, 0.1);
    border-radius: 4px;
}

.button-toggle-menu i {
    font-size: 24px;
    line-height: 1;
}

/* Ensure mobile menu is visible on small screens */
@media (max-width: 991px) {
    .button-toggle-menu {
        display: inline-flex !important;
    }
}

/* Mobile sidebar backdrop */
.sidebar-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1054;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    cursor: pointer;
}

/* Only show backdrop on mobile screens */
@media (max-width: 991px) {
    html.sidebar-enable .sidebar-backdrop {
        display: block;
    }
    
    /* Ensure sidebar appears above backdrop on mobile */
    html[data-sidenav-size=full].sidebar-enable .leftside-menu {
        z-index: 1055 !important;
    }
}

/* Never show backdrop on desktop */
@media (min-width: 992px) {
    .sidebar-backdrop {
        display: none !important;
    }
}

/* ========================================
   Collapsible Sidebar Menus (NEW)
   ======================================== */
.side-nav-second-level {
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
    margin-left: 0.25rem;
}

.side-nav-second-level li {
    margin: 0;
}

.side-nav-second-level li a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 8px 16px 8px 28px;
    color: #6c757d;
    font-size: 13px;
    transition: all 0.3s;
    text-decoration: none;
    font-weight: 500;
}

.side-nav-second-level li a:hover {
    color: #29ABE2;
    background: rgba(41, 171, 226, 0.1);
}

.side-nav-second-level li a.active {
    color: #29ABE2 !important;
    background: rgba(41, 171, 226, 0.15);
    font-weight: 600;
}

.side-nav-second-level li.active > a {
    color: #29ABE2 !important;
    background: rgba(41, 171, 226, 0.15);
    font-weight: 600;
}

.leftside-menu .side-nav .side-nav-link .menu-arrow {
    margin-left: auto;
}

.menu-arrow {
    float: right;
    transition: transform 0.3s;
    display: inline-block;
}

.menu-arrow::before {
    content: "\f142";
    font-family: 'remixicon';
    font-size: 16px;
}

.side-nav-link[aria-expanded="true"] .menu-arrow {
    transform: rotate(90deg);
}

/* ========================================
   Dashboard Page — Unified Layout System
   ======================================== */
.dashboard-page {
    --dash-gap: 1rem;
    --dash-pad: 1.25rem;
    --dash-radius: 12px;
    --dash-title: 0.9375rem;
    --dash-subtitle: 0.75rem;
    --dash-label: 0.6875rem;
    --dash-value: 1.5rem;
    --dash-meta: 0.8125rem;
    --dash-body: 0.875rem;
    --dash-border: rgba(31, 25, 186, 0.08);
    --dash-muted: #6c757d;
    --dash-surface: #ffffff;
    --dash-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 4px 12px rgba(31, 25, 186, 0.06);
    padding-bottom: 0.5rem;
}

.dashboard-page .dashboard-row {
    margin-bottom: var(--dash-gap);
}

.dashboard-page .dashboard-row:last-child {
    margin-bottom: 0;
}

.dashboard-page .card.dashboard-card {
    height: 100%;
    margin-bottom: 0;
    border: 1px solid var(--dash-border);
    border-radius: var(--dash-radius);
    box-shadow: var(--dash-shadow);
    background: var(--dash-surface);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.dashboard-page .card.dashboard-card:hover {
    box-shadow: 0 2px 4px rgba(16, 24, 40, 0.04), 0 8px 20px rgba(31, 25, 186, 0.08);
}

.dashboard-page .card.dashboard-card .card-body {
    padding: var(--dash-pad);
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Toolbar */
.dashboard-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
    padding-top: 0.25rem;
}

.dashboard-page-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    margin: 0 0 0.25rem;
    line-height: 1.3;
    letter-spacing: -0.01em;
}

.dashboard-page-subtitle {
    margin: 0;
    font-size: var(--dash-subtitle);
    color: var(--dash-muted);
    line-height: 1.4;
}

.dashboard-toolbar__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.dashboard-scenario-group {
    width: auto;
}

.dashboard-scenario-group .input-group-text {
    font-size: var(--dash-subtitle);
    font-weight: 500;
    background: var(--goalfix-gray-100);
    border-color: var(--goalfix-gray-300);
    color: var(--dash-muted);
    padding: 0.45rem 0.75rem;
}

.dashboard-scenario-group .form-select {
    font-size: var(--dash-body);
    min-width: 11rem;
    border-color: var(--goalfix-gray-300);
}

.dashboard-refresh-btn {
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}

/* Card header */
.dashboard-card__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.dashboard-card__title {
    font-size: var(--dash-title);
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    margin: 0;
    line-height: 1.3;
}

.dashboard-card__subtitle {
    font-size: var(--dash-subtitle);
    color: var(--dash-muted);
    font-weight: 500;
    white-space: nowrap;
}

.dashboard-card__header-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dashboard-card__menu {
    color: var(--dash-muted);
    font-size: 1.125rem;
    line-height: 1;
    padding: 0.15rem;
    border-radius: 6px;
    display: inline-flex;
}

.dashboard-card__menu:hover {
    color: var(--goalfix-primary-dark);
    background: var(--goalfix-gray-100);
}

/* KPI cards */
.dash-kpi {
    position: relative;
    overflow: hidden;
}

.dash-kpi::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--dash-kpi-accent, var(--goalfix-accent));
}

.dash-kpi--revenue { --dash-kpi-accent: var(--goalfix-primary-dark); }
.dash-kpi--gross { --dash-kpi-accent: var(--goalfix-success); }
.dash-kpi--net { --dash-kpi-accent: var(--goalfix-warning); }
.dash-kpi--cash { --dash-kpi-accent: var(--goalfix-danger); }

.dash-kpi__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.dash-kpi__label {
    font-size: var(--dash-label);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--dash-muted);
    line-height: 1.3;
}

.dash-kpi__icon {
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    background: rgba(31, 25, 186, 0.1);
    color: var(--dash-kpi-accent);
}

.dash-kpi--revenue .dash-kpi__icon {
    background: rgba(31, 25, 186, 0.1);
}

.dash-kpi--gross .dash-kpi__icon {
    background: rgba(10, 207, 151, 0.12);
}

.dash-kpi--net .dash-kpi__icon {
    background: rgba(255, 188, 0, 0.15);
}

.dash-kpi--cash .dash-kpi__icon {
    background: rgba(250, 92, 124, 0.12);
}

.dash-kpi__value {
    font-size: var(--dash-value);
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin-bottom: 0.625rem;
    font-variant-numeric: tabular-nums;
}

.dash-kpi__value.is-negative {
    color: var(--goalfix-danger);
}

.dash-kpi__spark {
    height: 36px;
    margin-bottom: 0.625rem;
}

.dash-kpi__spark canvas {
    width: 100% !important;
    height: 36px !important;
}

.dash-kpi__meta {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    font-size: var(--dash-meta);
    color: var(--dash-muted);
    line-height: 1.3;
    margin-top: auto;
}

.dash-kpi__meta-label {
    color: var(--dash-muted);
}

/* Charts */
.dashboard-page .chart-container {
    position: relative;
    width: 100%;
}

.dashboard-page .chart-container--lg {
    height: 280px;
}

.dashboard-page .chart-container--md {
    height: 260px;
}

.dashboard-page .chart-container--donut {
    height: 210px;
    margin-bottom: 0.75rem;
}

/* Expense legend under donut */
.dash-expense-legend {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: auto;
    padding-top: 0.25rem;
}

.dash-expense-legend__row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--dash-body);
    line-height: 1.3;
}

.dash-expense-legend__dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.dash-expense-legend__dot--cos { background: #1f19ba; }
.dash-expense-legend__dot--fixed { background: #09dac5; }
.dash-expense-legend__dot--variable { background: #12b3ef; }

.dash-expense-legend__label {
    color: var(--dash-muted);
    flex: 1;
}

.dash-expense-legend__value {
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    font-variant-numeric: tabular-nums;
}

/* Ratios */
.dash-ratios {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
}

.dash-ratios__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--goalfix-gray-200);
}

.dash-ratios__row:last-child {
    border-bottom: none;
}

.dash-ratios__divider {
    height: 1px;
    background: var(--goalfix-gray-300);
    margin: 0.35rem 0;
}

.dash-ratios__label {
    font-size: var(--dash-body);
    color: var(--dash-muted);
    line-height: 1.35;
}

.dash-ratios__value {
    font-size: var(--dash-body);
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.dash-ratios__value.is-negative {
    color: var(--goalfix-danger);
}

.dash-ratios__footer {
    margin-top: 1rem;
    padding-top: 0.25rem;
}

/* Quick actions */
.dash-action {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    text-align: center;
    text-decoration: none;
    padding: 1rem 0.75rem;
    border-radius: 10px;
    background: var(--goalfix-gray-100);
    border: 1px solid transparent;
    color: var(--goalfix-primary-dark);
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    min-height: 6.5rem;
}

.dash-action:hover {
    background: #fff;
    border-color: var(--dash-border);
    box-shadow: var(--dash-shadow);
    transform: translateY(-2px);
    color: var(--goalfix-primary-dark);
}

.dash-action__icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.dash-action__icon--primary {
    background: rgba(31, 25, 186, 0.1);
    color: var(--goalfix-primary-dark);
}

.dash-action__icon--success {
    background: rgba(10, 207, 151, 0.12);
    color: var(--goalfix-success);
}

.dash-action__icon--warning {
    background: rgba(255, 188, 0, 0.15);
    color: #d9a000;
}

.dash-action__icon--danger {
    background: rgba(250, 92, 124, 0.12);
    color: var(--goalfix-danger);
}

.dash-action__label {
    font-size: var(--dash-body);
    font-weight: 600;
    line-height: 1.3;
}

/* Getting started banner */
.dashboard-banner {
    position: relative;
    background: linear-gradient(135deg, #12b3ef, #0a8dc7);
    border-radius: var(--dash-radius);
    padding: 1.25rem 1.5rem;
    color: #fff;
    box-shadow: 0 4px 14px rgba(18, 179, 239, 0.25);
}

.dashboard-banner__close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    opacity: 0.85;
}

.dashboard-banner__content {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.dashboard-banner__icon {
    font-size: 2.25rem;
    opacity: 0.9;
    line-height: 1;
    flex-shrink: 0;
}

.dashboard-banner__text h2 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.25rem;
    color: #fff;
}

.dashboard-banner__text p {
    margin: 0 0 0.75rem;
    font-size: var(--dash-body);
    opacity: 0.95;
}

.dashboard-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Progress widget alignment inside dashboard */
.dashboard-page .model-progress-widget {
    margin-bottom: 0;
    border-radius: var(--dash-radius);
    padding: var(--dash-pad) 1.5rem;
}

.dashboard-page .model-progress-widget h5 {
    font-size: var(--dash-title);
    font-weight: 600;
}

.dashboard-page .progress-percentage {
    font-size: var(--dash-value);
    margin-bottom: 0.75rem;
    line-height: 1.1;
}

.dashboard-page .progress-bar-container {
    margin-bottom: 0.75rem;
    height: 8px;
}

.dashboard-page .progress-step {
    font-size: var(--dash-subtitle);
}

/* Legacy helpers still referenced elsewhere */
.widget-flat {
    position: relative;
    overflow: hidden;
}

.widget-icon {
    font-size: 1.5rem;
    color: var(--goalfix-accent);
}

.bg-success-lighten {
    background-color: rgba(10, 207, 151, 0.25);
    color: #0acf97 !important;
}

.bg-warning-lighten {
    background-color: rgba(255, 188, 0, 0.25);
    color: #ffbc00 !important;
}

.bg-danger-lighten {
    background-color: rgba(250, 92, 124, 0.25);
    color: #fa5c7c !important;
}

.card .header-title {
    color: var(--goalfix-primary-dark);
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 20px;
}

.chart-container {
    position: relative;
    height: 300px;
}

.hover-shadow {
    transition: all 0.3s ease;
    cursor: pointer;
}

.hover-shadow:hover {
    box-shadow: 0 4px 15px rgba(31, 25, 186, 0.15);
    transform: translateY(-2px);
}

/* ========================================
   Remove Old Tab Content Background Watermark
   ======================================== */
#tab-content-background {
    display: none !important;
}

#bg-text {
    display: none !important;
}

/* ========================================
   Responsive Dashboard Adjustments
   ======================================== */
@media (max-width: 991.98px) {
    .dashboard-page {
        --dash-pad: 1.125rem;
        --dash-value: 1.375rem;
    }

    .dashboard-page .chart-container--lg,
    .dashboard-page .chart-container--md {
        height: 240px;
    }
}

@media (max-width: 767.98px) {
    .dashboard-page {
        --dash-pad: 1rem;
        --dash-value: 1.25rem;
        --dash-gap: 0.75rem;
    }

    .dashboard-toolbar {
        margin-bottom: 1rem;
    }

    .dashboard-page-title {
        font-size: 1.125rem;
    }

    .dashboard-page .chart-container--lg,
    .dashboard-page .chart-container--md,
    .dashboard-page .chart-container--donut {
        height: 220px;
    }

    .dashboard-banner__content {
        align-items: flex-start;
    }

    .dash-action {
        min-height: 5.75rem;
        padding: 0.875rem 0.5rem;
    }
}

/* ========================================
   FINANCIAL STATEMENT TABLE (NEW TABLE-BASED APPROACH)
   ======================================== */

/* Statement header styling */
.financial-statement-header {
    margin-bottom: 20px;
}

.financial-statement-header h3 {
    color: var(--goalfix-primary-dark);
    font-weight: 700;
    font-size: 22px;
    padding-bottom: 15px;
    border-bottom: 3px solid var(--goalfix-primary-light);
    margin-bottom: 0;
    text-transform: capitalize;
}

/* Table scroll wrapper with custom scrollbar */
.table-scroll-wrapper {
    overflow-x: auto;
    overflow-y: visible;
    max-width: 100%;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    background: white;
    margin: 20px 0;
    position: relative;
    width: 100%;
}

.table-scroll-wrapper::-webkit-scrollbar {
    height: 12px;
}

.table-scroll-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 6px;
}

.table-scroll-wrapper::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #1f19ba, #09dac5);
    border-radius: 6px;
}

.table-scroll-wrapper::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, #09dac5, #1f19ba);
}

/* Financial statement table structure */
.financial-statement-table {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
    margin: 0;
}

/* Table headers */
.financial-statement-table thead th {
    background: linear-gradient(135deg, #1f19ba 0%, #1a1599 100%);
    color: white;
    font-weight: 600;
    font-size: 12px;
    padding: 14px 16px;
    text-align: right;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    text-transform: capitalize;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
    min-width: 100px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 0.3px;
    line-height: 1.4;
}

.financial-statement-table thead th:first-child {
    text-align: left;
    border-top-left-radius: 8px;
}

.financial-statement-table thead th:last-child {
    border-top-right-radius: 8px;
    border-right: none;
}

/* Sticky first column - ENHANCED */
.financial-statement-table:not(.schedule-data-table) .sticky-col {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 10;
    background: white;
    box-shadow: 3px 0 8px rgba(0, 0, 0, 0.12);
    font-weight: 500;
    min-width: 240px !important;
    max-width: 240px !important;
    white-space: normal !important;
    word-wrap: break-word;
    line-height: 1.4;
}

.financial-statement-table thead .sticky-col {
    z-index: 20;
    background: linear-gradient(135deg, #1f19ba 0%, #1a1599 100%);
    box-shadow: 3px 0 10px rgba(0, 0, 0, 0.2);
    white-space: nowrap !important;
}

/* Ensure sticky works on striped rows */
.financial-statement-table tbody tr:nth-child(even) .sticky-col {
    background: rgba(247, 247, 247, 0.5);
}

/* Ensure sticky works on hover */
.financial-statement-table tbody tr:hover .sticky-col {
    background: rgba(41, 171, 226, 0.08) !important;
}

/* Ensure sticky works on subtotal rows */
.financial-statement-table tbody tr.subtotal-row .sticky-col {
    background: rgba(31, 25, 186, 0.06) !important;
}

/* Year columns (Year 1, Year 2) */
.financial-statement-table .year-col {
    background: rgba(31, 25, 186, 0.04);
    font-weight: 600;
    min-width: 120px !important;
    border-right: 2px solid var(--goalfix-primary-light);
}

.financial-statement-table thead .year-col {
    background: #2d24d0;
    font-weight: 700;
}

/* Data cells */
.financial-statement-table tbody td {
    padding: 13px 16px;
    text-align: right;
    border-right: 1px solid #e9ecef;
    border-bottom: 1px solid #e9ecef;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', 'Fira Mono', 'Roboto Mono', 'Consolas', 'Courier New', monospace;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    transition: all 0.2s ease;
    white-space: nowrap;
    background: white;
    line-height: 1.4;
}

.financial-statement-table tbody td.sticky-col {
    text-align: left;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    border-right: 2px solid #dee2e6;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    vertical-align: middle;
}

/* Row label styling */
.financial-statement-table .row-label {
    color: var(--goalfix-dark);
}

/* Indented sub-items */
.financial-statement-table .row-label.indent-1 {
    padding-left: 30px;
    color: var(--goalfix-gray-700);
    font-weight: 400;
    font-size: 12px;
    line-height: 1.4;
}

.financial-statement-table .row-label.indent-1::before {
    content: "→ ";
    color: #09dac5;
    margin-right: 6px;
    font-weight: 700;
    font-size: 13px;
}

/* Striped rows */
.financial-statement-table tbody tr:nth-child(even) {
    background: rgba(247, 247, 247, 0.5);
}

.financial-statement-table tbody tr:nth-child(even) td:not(.year-col) {
    background: rgba(247, 247, 247, 0.5);
}

.financial-statement-table tbody tr:nth-child(even) .sticky-col {
    background: rgba(247, 247, 247, 0.5);
}

/* Hover effects */
.financial-statement-table tbody tr:hover {
    background: rgba(41, 171, 226, 0.08) !important;
}

.financial-statement-table tbody tr:hover td {
    background: rgba(41, 171, 226, 0.08) !important;
    color: var(--goalfix-primary-dark);
}

.financial-statement-table tbody tr:hover .sticky-col {
    background: rgba(41, 171, 226, 0.08) !important;
}

/* Subtotal rows */
.financial-statement-table tbody tr.subtotal-row {
    background: rgba(31, 25, 186, 0.06);
    border-top: 2px solid #09dac5;
    border-bottom: 2px solid #09dac5;
}

.financial-statement-table tbody tr.subtotal-row td {
    background: rgba(31, 25, 186, 0.06);
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 14px;
    line-height: 1.4;
}

.financial-statement-table tbody tr.subtotal-row .sticky-col {
    background: rgba(31, 25, 186, 0.06);
}

.financial-statement-table tbody tr.subtotal-row .year-col {
    background: rgba(31, 25, 186, 0.12);
}

/* Category header rows */
.financial-statement-table tbody tr.category-row {
    background: linear-gradient(90deg, rgba(31, 25, 186, 0.12) 0%, rgba(9, 218, 197, 0.05) 100%);
    border-top: 3px solid var(--goalfix-primary-dark);
}

.financial-statement-table tbody tr.category-row td {
    background: transparent;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    padding-top: 16px;
    padding-bottom: 16px;
}

.financial-statement-table tbody tr.category-row .sticky-col {
    background: transparent;
}

/* Negative numbers */
.financial-statement-table tbody td.negative {
    color: #fa5c7c !important;
    font-weight: 600;
}

/* Positive numbers (optional highlighting) */
.financial-statement-table tbody td.positive {
    color: #0acf97 !important;
}

/* Number cells */
.financial-statement-table tbody td.number-cell {
    cursor: default;
}

/* Editable cells (if needed in future) */
.financial-statement-table tbody td.editable {
    background: #fffaf0;
    cursor: pointer;
    position: relative;
}

.financial-statement-table tbody td.editable::after {
    content: "✎";
    position: absolute;
    top: 2px;
    right: 4px;
    font-size: 10px;
    color: #12b3ef;
    opacity: 0;
    transition: opacity 0.2s;
}

.financial-statement-table tbody td.editable:hover::after {
    opacity: 1;
}

/* Statement actions */
.statement-actions {
    display: flex;
    gap: 10px;
    padding: 15px 0;
    flex-wrap: wrap;
}

.statement-actions button {
    display: inline-flex;
    align-items: center;
}

/* Income Statement table view – layout aligned with Fixed Expenses */
.income-statement-table-view {
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

.income-statement-header-row.card-header-style {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.income-statement-title {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--goalfix-primary-dark, #1a2942);
    letter-spacing: 0.02em;
}

.income-statement-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.income-statement-year-select {
    min-width: 100px;
    font-size: 0.8125rem;
    padding: 0.35rem 1.75rem 0.35rem 0.5rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: #fff;
}

.income-statement-table-card {
    margin-bottom: 0;
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

.income-statement-table-card .table-scroll-wrapper {
    margin: 0;
    border-radius: 0;
    box-shadow: none;
}

/* Allow tooltips to extend outside without being clipped */
.income-statement-table-view .table-responsive {
    overflow-y: visible;
}
.income-statement-table-view .table-scroll-wrapper {
    overflow-y: visible;
}

.income-statement-actions {
    padding: 1rem 0 0;
    margin-top: 0;
}

/* Income statement table – same look as fixed-expenses-data-table */
.income-statement-data-table {
    --bs-table-border-color: #EAE9ED;
    font-size: 0.9375rem;
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
}

.income-statement-data-table th,
.income-statement-data-table td {
    border-color: #EAE9ED;
    vertical-align: middle;
}

.income-statement-data-table thead th {
    background: #f8f9fa !important;
    color: var(--text-dark, #1a2942);
    border: 1px solid #EAE9ED;
    border-bottom: 1px solid var(--border, #EAE9ED);
    text-transform: capitalize;
    font-size: 0.75rem;
    white-space: nowrap;
    font-weight: 500;
    letter-spacing: 0.02em;
    padding: 0.4rem 0.5rem;
}

/* Narrower month columns: 4th column onwards */
.income-statement-data-table thead th:nth-child(n+4) {
    min-width: 4.5rem;
    max-width: 4.5rem;
    width: 4.5rem;
    font-size: 0.6875rem;
    text-align: right;
}

.income-statement-data-table thead th.sticky-col,
.income-statement-data-table thead th:first-child {
    text-align: left;
}
.income-statement-data-table thead th.sticky-col {
    background: #f8f9fa !important;
    box-shadow: 2px 0 4px rgba(0,0,0,0.06);
    padding: 0.4rem 0.5rem;
    font-size: 0.8125rem;
}

.income-statement-data-table thead th.year-col {
    background: #f8f9fa !important;
    min-width: 4.25rem;
    max-width: 4.25rem;
    width: 4.25rem;
    text-align: right;
}

.income-statement-data-table.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #f2f4fa;
}

.income-statement-data-table.table-hover tbody tr:hover > * {
    background-color: #f2f4fa !important;
}

/* Row stacking: hovered row (and its tooltips) above the row below and sticky header */
.income-statement-data-table tbody tr {
    position: relative;
    z-index: 1;
}
.income-statement-data-table tbody tr:hover {
    z-index: 1100;
}

.income-statement-data-table .sticky-col {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 200px;
    background: #fff;
    box-shadow: 2px 0 4px rgba(0,0,0,0.06);
}

.income-statement-data-table thead th.sticky-col {
    z-index: 10;
}

.income-statement-data-table.table-striped tbody tr:nth-of-type(odd) .sticky-col {
    background: #f2f4fa;
}

.income-statement-data-table.table-striped tbody tr:nth-of-type(even) .sticky-col {
    background: #fff;
}

.income-statement-data-table tbody tr:hover .sticky-col {
    background: #f2f4fa !important;
}

.income-statement-data-table .year-col {
    background: rgba(0,0,0,0.02);
    font-weight: 600;
    min-width: 4.25rem;
    max-width: 4.25rem;
    width: 4.25rem;
    padding: 0.4rem 0.5rem;
}

.income-statement-data-table.table-striped tbody tr:nth-of-type(odd) .year-col {
    background: #eef0f8;
}

.income-statement-data-table.table-striped tbody tr:nth-of-type(even) .year-col {
    background: rgba(0,0,0,0.02);
}

.income-statement-data-table tbody td.sticky-col {
    text-align: left;
    font-weight: 500;
    color: var(--goalfix-primary-dark);
    border-right: 1px solid #EAE9ED;
    padding: 0.4rem 0.5rem;
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: 0.8125rem;
}

/* Data columns: tabular numbers, narrower */
.income-statement-data-table tbody td.year-col,
.income-statement-data-table tbody td.number-cell {
    font-family: 'SF Mono', 'Menlo', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', monospace;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    padding: 0.4rem 0.5rem;
    text-align: right;
}

/* Narrower month data columns */
.income-statement-data-table tbody td:nth-child(n+4) {
    min-width: 4.5rem;
    max-width: 4.5rem;
    width: 4.5rem;
}

.income-statement-data-table tbody tr.subtotal-row td {
    background: #e8eaf6;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    border-top: 2px solid #EAE9ED;
    padding: 0.4rem 0.5rem;
}

.income-statement-data-table tbody tr.subtotal-row .sticky-col {
    background: #e8eaf6 !important;
}

.income-statement-data-table tbody tr.subtotal-row .year-col {
    background: #e0e3f2 !important;
}

.income-statement-data-table .row-label.indent-1::before {
    content: "→ ";
    color: var(--goalfix-primary-dark, #1f19ba);
    margin-right: 6px;
    font-weight: 700;
    font-size: 0.8125rem;
}

.income-statement-data-table tbody td.negative {
    color: #fa5c7c !important;
    font-weight: 600;
}

/* ========== Financial statements – responsive shell (IS / BS / CF) ========== */
#income_statement.tab-pane,
#balance_sheet.tab-pane,
#cash_flow.tab-pane,
#income_summary.tab-pane,
#balance_sheet_summary.tab-pane,
#tax_summary.tab-pane {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.statement-table-view {
    --statement-label-w: 11rem;
    --statement-year-w: 6.5rem;
    --statement-month-min: 3.4rem;
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

.statement-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    margin-bottom: 0.85rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.statement-toolbar__title-group {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    min-width: 0;
}

.statement-toolbar__title {
    margin: 0;
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--goalfix-primary-dark, #1a2942);
    letter-spacing: 0.02em;
    line-height: 1.3;
}

.statement-toolbar__extra {
    color: var(--goalfix-primary-dark, #1f19ba);
    font-size: 0.875rem;
    font-weight: 500;
}

.statement-toolbar__meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

.statement-year-label {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--goalfix-gray-700, #495057);
    white-space: nowrap;
}

.statement-year-select {
    min-width: 7.5rem;
    min-height: 2.5rem;
    font-size: 0.9375rem;
    padding: 0.4rem 2rem 0.4rem 0.65rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: #fff;
}

.statement-scroll-nav {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 0 0 0.75rem;
    padding: 0.65rem 0.75rem;
    background: rgba(14, 143, 159, 0.07);
    border: 1px solid rgba(14, 143, 159, 0.22);
    border-radius: 8px;
}

.statement-scroll-nav.is-visible {
    display: flex;
}

.statement-scroll-nav__hint {
    margin: 0;
    flex: 1 1 auto;
    text-align: center;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--goalfix-primary-dark, #1a2942);
}

.statement-scroll-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 2.75rem;
    padding: 0.45rem 0.9rem;
    border: 1px solid rgba(31, 25, 186, 0.28);
    border-radius: 8px;
    background: #fff;
    color: var(--goalfix-primary-dark, #1f19ba);
    font-size: 0.9375rem;
    font-weight: 600;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(26, 41, 66, 0.06);
}

.statement-scroll-btn:hover:not(:disabled) {
    background: rgba(31, 25, 186, 0.06);
    border-color: rgba(31, 25, 186, 0.45);
    color: #1510a0;
}

.statement-scroll-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.statement-scroll-btn i {
    font-size: 1.15rem;
    line-height: 1;
}

.statement-table-card {
    margin-bottom: 0;
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

.statement-toolbar__footer {
    padding: 1rem 0 0;
}

.statement-wide-scroll {
    --statement-scroll-thumb: #1f19ba;
    --statement-scroll-track: #e8eaf6;
}

.statement-wide-scroll .wide-table-scroll-top,
.statement-wide-scroll .wide-table-scroll-body {
    scrollbar-color: var(--statement-scroll-thumb) var(--statement-scroll-track);
}

.statement-wide-scroll .wide-table-scroll-top::-webkit-scrollbar-track,
.statement-wide-scroll .wide-table-scroll-body::-webkit-scrollbar-track {
    background: var(--statement-scroll-track);
}

.statement-wide-scroll .wide-table-scroll-top::-webkit-scrollbar-thumb,
.statement-wide-scroll .wide-table-scroll-body::-webkit-scrollbar-thumb {
    background: var(--statement-scroll-thumb);
}

.statement-wide-scroll .wide-table-scroll-body::-webkit-scrollbar-thumb:hover {
    background: #1510a0;
}

.statement-wide-scroll .wide-table-scroll-top {
    height: 18px;
    margin-bottom: 4px;
}

/* Horizontal month scroll only — page scrolls vertically */
.statement-table-scroll,
.statement-wide-scroll .wide-table-scroll-body {
    max-height: none;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: auto;
}

.statement-wide-scroll.wide-table-scroll-host--footer::before,
.statement-wide-scroll.wide-table-scroll-host--footer::after {
    bottom: 14px;
}

.statement-table-view .income-statement-data-table,
.statement-table-view .balance-sheet-data-table,
.statement-table-view .cash-flow-data-table {
    table-layout: fixed;
    width: 100% !important;
    min-width: calc(
        var(--statement-label-w) + (2 * var(--statement-year-w)) + (12 * var(--statement-month-min))
    ) !important;
    max-width: none !important;
}

.statement-table-view .income-statement-data-table .sticky-col,
.statement-table-view .balance-sheet-data-table .sticky-col,
.statement-table-view .cash-flow-data-table .sticky-col,
.statement-table-view .financial-statement-table:not(.schedule-data-table) .sticky-col {
    min-width: 0 !important;
    max-width: none !important;
    width: var(--statement-label-w) !important;
    white-space: normal !important;
    word-break: break-word;
    line-height: 1.3;
    font-size: 0.8125rem;
}

.statement-table-view .income-statement-data-table .year-col,
.statement-table-view .balance-sheet-data-table .year-col,
.statement-table-view .cash-flow-data-table .year-col,
.statement-table-view .income-statement-data-table thead th.year-col,
.statement-table-view .balance-sheet-data-table thead th.year-col,
.statement-table-view .cash-flow-data-table thead th.year-col {
    min-width: var(--statement-year-w) !important;
    max-width: none !important;
    width: var(--statement-year-w) !important;
    position: sticky;
    z-index: 3;
    box-shadow: 2px 0 6px rgba(31, 25, 186, 0.08);
    overflow: visible;
    box-sizing: border-box;
}

.statement-table-view .income-statement-data-table .year-col--y1,
.statement-table-view .balance-sheet-data-table .year-col--y1,
.statement-table-view .cash-flow-data-table .year-col--y1 {
    left: var(--statement-label-w);
}

.statement-table-view .income-statement-data-table .year-col--y2,
.statement-table-view .balance-sheet-data-table .year-col--y2,
.statement-table-view .cash-flow-data-table .year-col--y2 {
    left: calc(var(--statement-label-w) + var(--statement-year-w));
}

.statement-table-view .income-statement-data-table thead th.year-col,
.statement-table-view .balance-sheet-data-table thead th.year-col,
.statement-table-view .cash-flow-data-table thead th.year-col {
    z-index: 12;
    top: 0;
}

.statement-table-view .income-statement-data-table thead th.sticky-col,
.statement-table-view .balance-sheet-data-table thead th.sticky-col,
.statement-table-view .cash-flow-data-table thead th.sticky-col {
    z-index: 13;
    top: 0;
}

.statement-table-view .income-statement-data-table thead th,
.statement-table-view .balance-sheet-data-table thead th,
.statement-table-view .cash-flow-data-table thead th {
    position: sticky;
    top: 0;
    z-index: 4;
}

.statement-table-view .income-statement-data-table .month-col,
.statement-table-view .balance-sheet-data-table .month-col,
.statement-table-view .cash-flow-data-table .month-col,
.statement-table-view .income-statement-data-table thead th:nth-child(n+4),
.statement-table-view .balance-sheet-data-table thead th:nth-child(n+4),
.statement-table-view .cash-flow-data-table thead th:nth-child(n+4),
.statement-table-view .income-statement-data-table tbody td:nth-child(n+4),
.statement-table-view .balance-sheet-data-table tbody td:nth-child(n+4),
.statement-table-view .cash-flow-data-table tbody td:nth-child(n+4) {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
}

.statement-table-view .income-statement-data-table thead th.month-col,
.statement-table-view .balance-sheet-data-table thead th.month-col,
.statement-table-view .cash-flow-data-table thead th.month-col {
    font-size: 0.75rem;
    text-align: right;
}

.statement-table-view .income-statement-data-table tbody td.month-col,
.statement-table-view .balance-sheet-data-table tbody td.month-col,
.statement-table-view .cash-flow-data-table tbody td.month-col,
.statement-table-view .income-statement-data-table tbody td.year-col,
.statement-table-view .balance-sheet-data-table tbody td.year-col,
.statement-table-view .cash-flow-data-table tbody td.year-col {
    font-size: 0.8125rem;
}

/* Keep sticky year backgrounds solid while scrolling months */
.statement-table-view .income-statement-data-table.table-striped tbody tr:nth-of-type(odd) .year-col,
.statement-table-view .balance-sheet-data-table.table-striped tbody tr:nth-of-type(odd) .year-col,
.statement-table-view .cash-flow-data-table.table-striped tbody tr:nth-of-type(odd) .year-col {
    background: #eef0f8;
}

.statement-table-view .income-statement-data-table.table-striped tbody tr:nth-of-type(even) .year-col,
.statement-table-view .balance-sheet-data-table.table-striped tbody tr:nth-of-type(even) .year-col,
.statement-table-view .cash-flow-data-table.table-striped tbody tr:nth-of-type(even) .year-col {
    background: #f7f8fc;
}

.statement-table-view .income-statement-data-table tbody tr.subtotal-row .year-col,
.statement-table-view .balance-sheet-data-table tbody tr.subtotal-row .year-col,
.statement-table-view .cash-flow-data-table tbody tr.subtotal-row .year-col {
    background: #e0e3f2 !important;
}

.statement-table-view .income-statement-data-table thead th.year-col,
.statement-table-view .balance-sheet-data-table thead th.year-col,
.statement-table-view .cash-flow-data-table thead th.year-col {
    background: #f0f1f8 !important;
}

@media (max-width: 1200px) {
    .statement-table-view {
        --statement-label-w: 10rem;
        --statement-month-min: 3.2rem;
    }
}

@media (max-width: 992px) {
    .statement-table-view {
        --statement-label-w: 9.25rem;
        --statement-month-min: 3.05rem;
    }

    .statement-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .statement-toolbar__meta {
        margin-left: 0;
        width: 100%;
    }

    .statement-year-select {
        flex: 1;
        min-width: 0;
        width: 100%;
    }

    .statement-scroll-nav {
        flex-wrap: wrap;
    }

    .statement-scroll-nav__hint {
        order: -1;
        flex: 1 1 100%;
        text-align: left;
        margin-bottom: 0.15rem;
    }

    .statement-scroll-btn {
        flex: 1 1 auto;
    }
}

@media (max-width: 767.98px) {
    .statement-table-view {
        --statement-label-w: 8.25rem;
        --statement-month-min: 2.9rem;
        font-size: 0.875rem;
    }

    .statement-scroll-btn span {
        /* Keep button labels readable for older users on phones */
        font-size: 0.875rem;
    }

    .statement-table-view .income-statement-data-table .sticky-col,
    .statement-table-view .balance-sheet-data-table .sticky-col,
    .statement-table-view .cash-flow-data-table .sticky-col {
        font-size: 0.75rem;
    }

    .statement-table-view .income-statement-data-table tbody td.month-col,
    .statement-table-view .balance-sheet-data-table tbody td.month-col,
    .statement-table-view .cash-flow-data-table tbody td.month-col,
    .statement-table-view .income-statement-data-table tbody td.year-col,
    .statement-table-view .balance-sheet-data-table tbody td.year-col,
    .statement-table-view .cash-flow-data-table tbody td.year-col {
        font-size: 0.75rem;
    }
}

@media (max-width: 576px) {
    #income_statement.tab-pane,
    #balance_sheet.tab-pane,
    #cash_flow.tab-pane,
    #income_summary.tab-pane,
    #balance_sheet_summary.tab-pane,
    #tax_summary.tab-pane {
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }

    .statement-table-view {
        --statement-label-w: 7.5rem;
        --statement-month-min: 2.75rem;
    }

    .statement-scroll-btn {
        padding: 0.45rem 0.65rem;
    }
}

/* ========== Balance Sheet, Cash Flow & Summary tabs – same layout and table styling as Income Statement ========== */
.balance-sheet-table-view,
.cash-flow-table-view,
.income-summary-table-view,
.balance-sheet-summary-table-view,
.tax-summary-table-view {
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

.balance-sheet-header-row.card-header-style,
.cash-flow-header-row.card-header-style,
.income-summary-header-row.card-header-style,
.balance-sheet-summary-header-row.card-header-style,
.tax-summary-header-row.card-header-style {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.balance-sheet-title,
.cash-flow-title,
.income-summary-title,
.balance-sheet-summary-title,
.tax-summary-title {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--goalfix-primary-dark, #1a2942);
    letter-spacing: 0.02em;
}

.balance-sheet-in-balance {
    color: var(--goalfix-primary-dark, #1f19ba);
    font-size: 0.875rem;
    margin-left: 0.5rem;
}

.balance-sheet-header-actions,
.cash-flow-header-actions,
.income-summary-header-actions,
.balance-sheet-summary-header-actions,
.tax-summary-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.balance-sheet-year-select,
.cash-flow-year-select,
.income-summary-year-select,
.balance-sheet-summary-year-select,
.tax-summary-year-select {
    min-width: 100px;
    font-size: 0.8125rem;
    padding: 0.35rem 1.75rem 0.35rem 0.5rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: #fff;
}

.balance-sheet-table-card,
.cash-flow-table-card,
.income-summary-table-card,
.balance-sheet-summary-table-card,
.tax-summary-table-card {
    margin-bottom: 0;
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

.balance-sheet-table-card .table-scroll-wrapper,
.cash-flow-table-card .table-scroll-wrapper,
.income-summary-table-card .table-scroll-wrapper,
.balance-sheet-summary-table-card .table-scroll-wrapper,
.tax-summary-table-card .table-scroll-wrapper {
    margin: 0;
    border-radius: 0;
    box-shadow: none;
}

.balance-sheet-actions,
.cash-flow-actions,
.income-summary-actions,
.balance-sheet-summary-actions,
.tax-summary-actions {
    padding: 1rem 0 0;
    margin-top: 0;
}

/* Allow tooltips to extend outside */
.balance-sheet-table-view .table-responsive,
.cash-flow-table-view .table-responsive,
.income-summary-table-view .table-responsive,
.balance-sheet-summary-table-view .table-responsive,
.tax-summary-table-view .table-responsive {
    overflow-y: visible;
}
.balance-sheet-table-view .table-scroll-wrapper,
.cash-flow-table-view .table-scroll-wrapper,
.income-summary-table-view .table-scroll-wrapper,
.balance-sheet-summary-table-view .table-scroll-wrapper,
.tax-summary-table-view .table-scroll-wrapper {
    overflow-y: visible;
}

/* Balance sheet, cash flow & summary data tables – same styling as income statement */
.balance-sheet-data-table,
.cash-flow-data-table,
.income-summary-data-table,
.balance-sheet-summary-data-table,
.tax-summary-data-table {
    --bs-table-border-color: #EAE9ED;
    font-size: 0.9375rem;
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
}

.balance-sheet-data-table th,
.balance-sheet-data-table td,
.cash-flow-data-table th,
.cash-flow-data-table td,
.income-summary-data-table th,
.income-summary-data-table td,
.balance-sheet-summary-data-table th,
.balance-sheet-summary-data-table td,
.tax-summary-data-table th,
.tax-summary-data-table td {
    border-color: #EAE9ED;
    vertical-align: middle;
}

.balance-sheet-data-table thead th,
.cash-flow-data-table thead th,
.income-summary-data-table thead th,
.balance-sheet-summary-data-table thead th,
.tax-summary-data-table thead th {
    background: #f8f9fa !important;
    color: var(--text-dark, #1a2942);
    border: 1px solid #EAE9ED;
    border-bottom: 1px solid var(--border, #EAE9ED);
    text-transform: capitalize;
    font-size: 0.75rem;
    white-space: nowrap;
    font-weight: 500;
    letter-spacing: 0.02em;
    padding: 0.4rem 0.5rem;
}

.balance-sheet-data-table thead th:nth-child(n+4),
.cash-flow-data-table thead th:nth-child(n+4),
.income-summary-data-table thead th:nth-child(n+4),
.balance-sheet-summary-data-table thead th:nth-child(n+4),
.tax-summary-data-table thead th:nth-child(n+4) {
    min-width: 4.5rem;
    max-width: 4.5rem;
    width: 4.5rem;
    font-size: 0.6875rem;
    text-align: right;
}

.balance-sheet-data-table thead th.sticky-col,
.balance-sheet-data-table thead th:first-child,
.cash-flow-data-table thead th.sticky-col,
.cash-flow-data-table thead th:first-child,
.income-summary-data-table thead th.sticky-col,
.income-summary-data-table thead th:first-child,
.balance-sheet-summary-data-table thead th.sticky-col,
.balance-sheet-summary-data-table thead th:first-child,
.tax-summary-data-table thead th.sticky-col,
.tax-summary-data-table thead th:first-child {
    text-align: left;
}
.balance-sheet-data-table thead th.sticky-col,
.cash-flow-data-table thead th.sticky-col,
.income-summary-data-table thead th.sticky-col,
.balance-sheet-summary-data-table thead th.sticky-col,
.tax-summary-data-table thead th.sticky-col {
    background: #f8f9fa !important;
    box-shadow: 2px 0 4px rgba(0,0,0,0.06);
    padding: 0.4rem 0.5rem;
    font-size: 0.8125rem;
}

.balance-sheet-data-table thead th.year-col,
.cash-flow-data-table thead th.year-col,
.income-summary-data-table thead th.year-col,
.balance-sheet-summary-data-table thead th.year-col,
.tax-summary-data-table thead th.year-col {
    background: #f8f9fa !important;
    min-width: 4.25rem;
    max-width: 4.25rem;
    width: 4.25rem;
    text-align: right;
}

.balance-sheet-data-table.table-striped > tbody > tr:nth-of-type(odd) > *,
.cash-flow-data-table.table-striped > tbody > tr:nth-of-type(odd) > *,
.income-summary-data-table.table-striped > tbody > tr:nth-of-type(odd) > *,
.balance-sheet-summary-data-table.table-striped > tbody > tr:nth-of-type(odd) > *,
.tax-summary-data-table.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #f2f4fa;
}

.balance-sheet-data-table.table-hover tbody tr:hover > *,
.cash-flow-data-table.table-hover tbody tr:hover > *,
.income-summary-data-table.table-hover tbody tr:hover > *,
.balance-sheet-summary-data-table.table-hover tbody tr:hover > *,
.tax-summary-data-table.table-hover tbody tr:hover > * {
    background-color: #f2f4fa !important;
}

.balance-sheet-data-table tbody tr,
.cash-flow-data-table tbody tr,
.income-summary-data-table tbody tr,
.balance-sheet-summary-data-table tbody tr,
.tax-summary-data-table tbody tr {
    position: relative;
    z-index: 1;
}
.balance-sheet-data-table tbody tr:hover,
.cash-flow-data-table tbody tr:hover,
.income-summary-data-table tbody tr:hover,
.balance-sheet-summary-data-table tbody tr:hover,
.tax-summary-data-table tbody tr:hover {
    z-index: 1100;
}

.balance-sheet-data-table .sticky-col,
.cash-flow-data-table .sticky-col,
.income-summary-data-table .sticky-col,
.balance-sheet-summary-data-table .sticky-col,
.tax-summary-data-table .sticky-col {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 200px;
    background: #fff;
    box-shadow: 2px 0 4px rgba(0,0,0,0.06);
}

.balance-sheet-data-table thead th.sticky-col,
.cash-flow-data-table thead th.sticky-col,
.income-summary-data-table thead th.sticky-col,
.balance-sheet-summary-data-table thead th.sticky-col,
.tax-summary-data-table thead th.sticky-col {
    z-index: 10;
}

.balance-sheet-data-table.table-striped tbody tr:nth-of-type(odd) .sticky-col,
.cash-flow-data-table.table-striped tbody tr:nth-of-type(odd) .sticky-col,
.income-summary-data-table.table-striped tbody tr:nth-of-type(odd) .sticky-col,
.balance-sheet-summary-data-table.table-striped tbody tr:nth-of-type(odd) .sticky-col,
.tax-summary-data-table.table-striped tbody tr:nth-of-type(odd) .sticky-col {
    background: #f2f4fa;
}

.balance-sheet-data-table.table-striped tbody tr:nth-of-type(even) .sticky-col,
.cash-flow-data-table.table-striped tbody tr:nth-of-type(even) .sticky-col,
.income-summary-data-table.table-striped tbody tr:nth-of-type(even) .sticky-col,
.balance-sheet-summary-data-table.table-striped tbody tr:nth-of-type(even) .sticky-col,
.tax-summary-data-table.table-striped tbody tr:nth-of-type(even) .sticky-col {
    background: #fff;
}

.balance-sheet-data-table tbody tr:hover .sticky-col,
.cash-flow-data-table tbody tr:hover .sticky-col,
.income-summary-data-table tbody tr:hover .sticky-col,
.balance-sheet-summary-data-table tbody tr:hover .sticky-col,
.tax-summary-data-table tbody tr:hover .sticky-col {
    background: #f2f4fa !important;
}

.balance-sheet-data-table .year-col,
.cash-flow-data-table .year-col,
.income-summary-data-table .year-col,
.balance-sheet-summary-data-table .year-col,
.tax-summary-data-table .year-col {
    background: rgba(0,0,0,0.02);
    font-weight: 600;
    min-width: 4.25rem;
    max-width: 4.25rem;
    width: 4.25rem;
    padding: 0.4rem 0.5rem;
}

.balance-sheet-data-table.table-striped tbody tr:nth-of-type(odd) .year-col,
.cash-flow-data-table.table-striped tbody tr:nth-of-type(odd) .year-col,
.income-summary-data-table.table-striped tbody tr:nth-of-type(odd) .year-col,
.balance-sheet-summary-data-table.table-striped tbody tr:nth-of-type(odd) .year-col,
.tax-summary-data-table.table-striped tbody tr:nth-of-type(odd) .year-col {
    background: #eef0f8;
}

.balance-sheet-data-table.table-striped tbody tr:nth-of-type(even) .year-col,
.cash-flow-data-table.table-striped tbody tr:nth-of-type(even) .year-col,
.income-summary-data-table.table-striped tbody tr:nth-of-type(even) .year-col,
.balance-sheet-summary-data-table.table-striped tbody tr:nth-of-type(even) .year-col,
.tax-summary-data-table.table-striped tbody tr:nth-of-type(even) .year-col {
    background: rgba(0,0,0,0.02);
}

.balance-sheet-data-table tbody td.sticky-col,
.cash-flow-data-table tbody td.sticky-col,
.income-summary-data-table tbody td.sticky-col,
.balance-sheet-summary-data-table tbody td.sticky-col,
.tax-summary-data-table tbody td.sticky-col {
    text-align: left;
    font-weight: 500;
    color: var(--goalfix-primary-dark);
    border-right: 1px solid #EAE9ED;
    padding: 0.4rem 0.5rem;
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: 0.8125rem;
}

.balance-sheet-data-table tbody td.year-col,
.balance-sheet-data-table tbody td.number-cell,
.cash-flow-data-table tbody td.year-col,
.cash-flow-data-table tbody td.number-cell,
.income-summary-data-table tbody td.year-col,
.income-summary-data-table tbody td.number-cell,
.balance-sheet-summary-data-table tbody td.year-col,
.balance-sheet-summary-data-table tbody td.number-cell,
.tax-summary-data-table tbody td.year-col,
.tax-summary-data-table tbody td.number-cell {
    font-family: 'SF Mono', 'Menlo', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', monospace;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    padding: 0.4rem 0.5rem;
    text-align: right;
}

.balance-sheet-data-table tbody td:nth-child(n+4),
.cash-flow-data-table tbody td:nth-child(n+4),
.income-summary-data-table tbody td:nth-child(n+4),
.balance-sheet-summary-data-table tbody td:nth-child(n+4),
.tax-summary-data-table tbody td:nth-child(n+4) {
    min-width: 4.5rem;
    max-width: 4.5rem;
    width: 4.5rem;
}

.balance-sheet-data-table tbody tr.subtotal-row td,
.cash-flow-data-table tbody tr.subtotal-row td,
.income-summary-data-table tbody tr.subtotal-row td,
.balance-sheet-summary-data-table tbody tr.subtotal-row td,
.tax-summary-data-table tbody tr.subtotal-row td {
    background: #e8eaf6;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    border-top: 2px solid #EAE9ED;
    padding: 0.4rem 0.5rem;
}

.balance-sheet-data-table tbody tr.subtotal-row .sticky-col,
.cash-flow-data-table tbody tr.subtotal-row .sticky-col,
.income-summary-data-table tbody tr.subtotal-row .sticky-col,
.balance-sheet-summary-data-table tbody tr.subtotal-row .sticky-col,
.tax-summary-data-table tbody tr.subtotal-row .sticky-col {
    background: #e8eaf6 !important;
}

.balance-sheet-data-table tbody tr.subtotal-row .year-col,
.cash-flow-data-table tbody tr.subtotal-row .year-col,
.income-summary-data-table tbody tr.subtotal-row .year-col,
.balance-sheet-summary-data-table tbody tr.subtotal-row .year-col,
.tax-summary-data-table tbody tr.subtotal-row .year-col {
    background: #e0e3f2 !important;
}

.balance-sheet-data-table tbody tr.category-row td,
.cash-flow-data-table tbody tr.category-row td,
.income-summary-data-table tbody tr.category-row td,
.balance-sheet-summary-data-table tbody tr.category-row td,
.tax-summary-data-table tbody tr.category-row td {
    background: #e8eaf6;
    font-weight: 700;
}

/* Category section headers (Receipts, Payments, Funding etc.) – full row span, left-aligned, improved typography */
.balance-sheet-data-table tbody tr.category-row td.category-row-cell,
.cash-flow-data-table tbody tr.category-row td.category-row-cell,
.income-summary-data-table tbody tr.category-row td.category-row-cell,
.balance-sheet-summary-data-table tbody tr.category-row td.category-row-cell,
.tax-summary-data-table tbody tr.category-row td.category-row-cell {
    text-align: left;
    width: 100%;
    min-width: 0;
    max-width: none;
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--goalfix-primary-dark, #1a2942);
    padding: 0.5rem 0.625rem;
    text-transform: none;
    line-height: 1.35;
}

.balance-sheet-data-table .row-label.indent-1::before,
.cash-flow-data-table .row-label.indent-1::before,
.income-summary-data-table .row-label.indent-1::before,
.balance-sheet-summary-data-table .row-label.indent-1::before,
.tax-summary-data-table .row-label.indent-1::before {
    content: "→ ";
    color: var(--goalfix-primary-dark, #1f19ba);
    margin-right: 6px;
    font-weight: 700;
    font-size: 0.8125rem;
}

.balance-sheet-data-table tbody td.negative,
.cash-flow-data-table tbody td.negative,
.income-summary-data-table tbody td.negative,
.balance-sheet-summary-data-table tbody td.negative,
.tax-summary-data-table tbody td.negative {
    color: #fa5c7c !important;
    font-weight: 600;
}

.balance-sheet-data-table .tooltip-trigger:hover,
.cash-flow-data-table .tooltip-trigger:hover,
.income-summary-data-table .tooltip-trigger:hover,
.balance-sheet-summary-data-table .tooltip-trigger:hover,
.tax-summary-data-table .tooltip-trigger:hover {
    z-index: 99999;
}
.balance-sheet-data-table .tooltip-content,
.cash-flow-data-table .tooltip-content,
.income-summary-data-table .tooltip-content,
.balance-sheet-summary-data-table .tooltip-content,
.tax-summary-data-table .tooltip-content {
    z-index: 100000;
}

/* ========== Supporting Schedules – lean table layout ========== */
.schedule-table-view {
    --dash-gap: 1rem;
    --dash-pad: 0.5rem;
    --dash-radius: 10px;
    --dash-title: 0.9375rem;
    --dash-subtitle: 0.75rem;
    --dash-label: 0.6875rem;
    --dash-body: 0.875rem;
    --dash-meta: 0.8125rem;
    --dash-border: rgba(31, 25, 186, 0.08);
    --dash-muted: #6c757d;
    --dash-surface: #ffffff;
    --schedule-row-border: var(--goalfix-gray-200, #e9ecef);
    --schedule-soft-bg: rgba(31, 25, 186, 0.04);
    --schedule-accent: var(--goalfix-primary-dark, #1f19ba);
    --schedule-year-total: #0e8f9f;
}

.schedule-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
    padding: 0;
}

.schedule-toolbar__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: var(--goalfix-primary-dark, #1a2942);
}

.schedule-toolbar__meta {
    margin-left: auto;
}

.schedule-toolbar__footer {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
    padding: 0;
}

.schedule-year-group,
.schedule-view-group {
    width: auto;
    flex-wrap: nowrap;
    min-width: 14rem;
}

.schedule-year-group .input-group-text,
.schedule-view-group .input-group-text {
    font-size: var(--dash-subtitle);
    font-weight: 500;
    background: var(--goalfix-gray-100, #f8f9fa);
    border-color: var(--goalfix-gray-300, #dee2e6);
    color: var(--dash-muted);
    padding: 0.4rem 0.65rem;
}

.schedule-year-group .form-select,
.schedule-view-group .form-select {
    font-size: var(--dash-body);
    min-width: 10.5rem;
    border-color: var(--goalfix-gray-300, #dee2e6);
    background-color: #fff;
}

.schedule-section-scroll {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-gutter: stable;
    border: 1px solid var(--dash-border);
    border-radius: 8px;
    background: #fff;
}

.schedule-section-scroll::-webkit-scrollbar {
    height: 8px;
}

.schedule-section-scroll::-webkit-scrollbar-thumb {
    background: rgba(31, 25, 186, 0.28);
    border-radius: 999px;
}

.schedule-section-scroll::-webkit-scrollbar-track {
    background: rgba(31, 25, 186, 0.06);
}

.schedule-scroll-cue {
    display: none;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    margin: 0 0 0.45rem;
    padding: 0.4rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.35; /* .tab-pane sets line-height:0 — restore readable cue text */
    color: var(--dash-muted);
    letter-spacing: 0.02em;
    position: relative;
    z-index: 2;
    background: rgba(14, 143, 159, 0.06);
    border: 1px solid rgba(14, 143, 159, 0.18);
    border-radius: 8px;
}

.schedule-scroll-cue.is-visible {
    display: inline-flex;
    align-self: flex-end;
}

.schedule-scroll-cue span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.schedule-scroll-cue span::before {
    content: "↔";
    font-size: 0.75rem;
    color: var(--schedule-year-total, #0e8f9f);
}

.schedule-sections {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.schedule-section__title {
    margin: 0 0 0.4rem;
    padding: 0;
    font-size: var(--dash-title, 0.9375rem);
    font-weight: 600;
    color: var(--schedule-year-total, #0e8f9f);
    line-height: 1.3;
    letter-spacing: -0.01em;
}

/* Schedule tabs share the tighter statement pane padding above */

/* Year view: fit columns without horizontal scroll */
.schedule-table-view.schedule-view--years .schedule-data-table,
.schedule-data-table--years {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100%;
}

.schedule-table-view.schedule-view--years .schedule-section-scroll {
    overflow-x: visible;
}

.schedule-table-view.schedule-view--years .schedule-data-table .sticky-col {
    position: static;
    box-shadow: none;
    min-width: 10rem !important;
    max-width: 14rem !important;
    width: auto !important;
}

.schedule-table-view.schedule-view--years .schedule-data-table thead th.year-col,
.schedule-table-view.schedule-view--years .schedule-data-table tbody td.year-col {
    min-width: 7.5rem !important;
    max-width: none !important;
    width: 22% !important;
}

/* Monthly view: full-width responsive; keep label/year compact, months share the rest */
.schedule-table-view .schedule-data-table--monthly {
    table-layout: fixed;
    width: 100% !important;
    min-width: calc(14.5rem + (12 * 3.75rem) + 5.5rem) !important;
    max-width: none !important;
}

.schedule-table-view .schedule-data-table--monthly col.schedule-col-label {
    width: 14.5rem;
}

.schedule-table-view .schedule-data-table--monthly col.schedule-col-month {
    width: auto; /* share remaining width equally */
}

.schedule-table-view .schedule-data-table--monthly col.schedule-col-year {
    width: 5.5rem;
}

.schedule-table-view .schedule-data-table--monthly .sticky-col {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    padding-left: 0.55rem !important;
    padding-right: 0.55rem !important;
    white-space: nowrap !important;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
}

.schedule-table-view .schedule-data-table--monthly thead th:not(.sticky-col):not(.year-col),
.schedule-table-view .schedule-data-table--monthly tbody td:not(.sticky-col):not(.year-col) {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    padding-left: 0.3rem !important;
    padding-right: 0.3rem !important;
}

.schedule-data-table--monthly thead th.year-col--trailing,
.schedule-data-table--monthly tbody td.year-col--trailing {
    position: sticky;
    right: 0;
    z-index: 3;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    box-shadow: -2px 0 8px rgba(31, 25, 186, 0.08);
    border-left: 1px solid var(--dash-border) !important;
    background: rgba(14, 143, 159, 0.08) !important;
}

.schedule-data-table--monthly thead th.year-col--trailing {
    z-index: 13;
    background: var(--schedule-year-total, #0e8f9f) !important;
    color: #ffffff !important;
}

.schedule-data-table--monthly tbody tr:nth-child(even) td.year-col--trailing {
    background: rgba(14, 143, 159, 0.12) !important;
}

.schedule-data-table--monthly tbody tr.subtotal-row td.year-col--trailing,
.schedule-data-table--monthly tbody tr:hover td.year-col--trailing {
    background: rgba(14, 143, 159, 0.16) !important;
}

/* Soft table treatment – closer to dash-ratios than Excel grid */
.schedule-data-table {
    --bs-table-bg: transparent;
    --bs-table-hover-bg: rgba(31, 25, 186, 0.04);
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--dash-body);
    margin: 0;
}

.schedule-data-table thead th {
    background: var(--goalfix-primary-dark, #1f19ba) !important;
    color: #ffffff !important;
    border: none !important;
    border-bottom: none !important;
    border-right: 1px solid rgba(255, 255, 255, 0.12) !important;
    text-transform: uppercase !important;
    font-size: var(--dash-label) !important;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 0.7rem 0.75rem !important;
    white-space: nowrap;
    vertical-align: middle;
}

.schedule-data-table thead th.sticky-col,
.schedule-data-table thead th:first-child {
    text-align: left;
    color: #ffffff !important;
    text-transform: none !important;
    font-size: var(--dash-subtitle) !important;
    letter-spacing: 0;
    background: #1813a3 !important;
}

.schedule-data-table thead th.year-col {
    background: #1510a0 !important;
    color: #ffffff !important;
}

.schedule-data-table thead th.year-col--trailing {
    background: var(--schedule-year-total, #0e8f9f) !important;
    color: #ffffff !important;
    border-left: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.schedule-data-table thead th:nth-child(n+4),
.schedule-data-table tbody td:nth-child(n+4) {
    min-width: 4.5rem;
    max-width: 4.5rem;
    width: 4.5rem;
}

.schedule-table-view .schedule-data-table--monthly thead th:nth-child(n+2),
.schedule-table-view .schedule-data-table--monthly tbody td:nth-child(n+2) {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
}

.schedule-data-table .sticky-col {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 8.5rem !important;
    max-width: 11rem !important;
    background: #fff;
    box-shadow: 2px 0 8px rgba(31, 25, 186, 0.06);
}

.schedule-data-table thead th.sticky-col {
    z-index: 12;
    background: #1813a3 !important;
    color: #ffffff !important;
}

.schedule-data-table tbody td {
    border: none !important;
    border-bottom: 1px solid var(--schedule-row-border) !important;
    padding: 0.65rem 0.75rem !important;
    vertical-align: middle;
    background: #fff;
}

.schedule-data-table tbody td.sticky-col {
    text-align: left;
    font-weight: 500;
    color: var(--goalfix-primary-dark, #1a2942);
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: var(--dash-body);
}

.schedule-data-table tbody td.year-col,
.schedule-data-table tbody td.number-cell {
    font-family: 'SF Mono', 'Menlo', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', monospace;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    text-align: right;
    font-weight: 500;
    color: var(--goalfix-primary-dark, #1a2942);
}

.schedule-data-table tbody td.year-col {
    background: var(--schedule-soft-bg);
    font-weight: 600;
    border-right: 1px solid var(--dash-border) !important;
}

.schedule-data-table thead th.year-col {
    border-right: 1px solid rgba(255, 255, 255, 0.14) !important;
}

.schedule-data-table tbody tr:nth-child(even) td:not(.year-col):not(.category-row-cell) {
    background: rgba(248, 249, 250, 0.65);
}

.schedule-data-table tbody tr:nth-child(even) td.sticky-col {
    background: rgba(248, 249, 250, 0.95);
}

.schedule-data-table tbody tr:hover td {
    background: rgba(31, 25, 186, 0.04) !important;
}

.schedule-data-table tbody tr:hover td.year-col {
    background: rgba(31, 25, 186, 0.07) !important;
}

/* Category rows – KPI-style left accent */
.schedule-data-table tbody tr.category-row > *,
.schedule-data-table.table-hover tbody tr.category-row:hover > *,
.income-summary-data-table tbody tr.category-row > *,
.balance-sheet-summary-data-table tbody tr.category-row > *,
.tax-summary-data-table tbody tr.category-row > * {
    background-color: rgba(31, 25, 186, 0.05) !important;
}

.schedule-data-table tbody tr.category-row td.category-row-cell,
.income-summary-data-table tbody tr.category-row td.category-row-cell,
.balance-sheet-summary-data-table tbody tr.category-row td.category-row-cell,
.tax-summary-data-table tbody tr.category-row td.category-row-cell {
    position: relative;
    text-align: left;
    border: none !important;
    border-bottom: 1px solid var(--dash-border) !important;
    border-left: 3px solid var(--schedule-accent) !important;
    background: rgba(31, 25, 186, 0.05) !important;
    color: var(--goalfix-primary-dark, #1a2942);
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: var(--dash-title);
    font-weight: 600;
    letter-spacing: -0.01em;
    text-transform: none;
    padding: 0.75rem 0.85rem !important;
    line-height: 1.3;
    box-shadow: none !important;
}

/* Subtotals – soft emphasis like dash ratio values */
.schedule-data-table tbody tr.subtotal-row > *,
.schedule-data-table.table-hover tbody tr.subtotal-row:hover > *,
.income-summary-data-table tbody tr.subtotal-row > *,
.balance-sheet-summary-data-table tbody tr.subtotal-row > *,
.tax-summary-data-table tbody tr.subtotal-row > * {
    background-color: rgba(31, 25, 186, 0.07) !important;
}

.schedule-data-table.financial-statement-table tbody tr.subtotal-row,
.income-summary-data-table.financial-statement-table tbody tr.subtotal-row,
.balance-sheet-summary-data-table.financial-statement-table tbody tr.subtotal-row,
.tax-summary-data-table.financial-statement-table tbody tr.subtotal-row {
    border-top: none;
    border-bottom: none;
}

.schedule-data-table tbody tr.subtotal-row td,
.income-summary-data-table tbody tr.subtotal-row td,
.balance-sheet-summary-data-table tbody tr.subtotal-row td,
.tax-summary-data-table tbody tr.subtotal-row td {
    border-top: 1px solid var(--dash-border) !important;
    border-bottom: 1px solid var(--dash-border) !important;
    font-weight: 700;
    color: var(--goalfix-primary-dark, #1a2942);
}

.schedule-data-table tbody tr.subtotal-row td.sticky-col {
    background: rgba(31, 25, 186, 0.07) !important;
}

.schedule-data-table tbody tr.schedule-divider-row td,
.income-summary-data-table tbody tr.schedule-divider-row td,
.balance-sheet-summary-data-table tbody tr.schedule-divider-row td,
.tax-summary-data-table tbody tr.schedule-divider-row td {
    height: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-bottom: 1px solid var(--dash-border) !important;
    background: transparent !important;
    line-height: 0;
    box-shadow: none !important;
}

.schedule-data-table tbody tr.schedule-spacer-row td,
.income-summary-data-table tbody tr.schedule-spacer-row td,
.balance-sheet-summary-data-table tbody tr.schedule-spacer-row td,
.tax-summary-data-table tbody tr.schedule-spacer-row td {
    height: 0.65rem !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.schedule-data-table tbody td.pct-cell,
.income-summary-data-table tbody td.pct-cell,
.balance-sheet-summary-data-table tbody td.pct-cell,
.tax-summary-data-table tbody td.pct-cell {
    color: var(--goalfix-primary, #5b4bb7) !important;
    font-weight: 600;
}

.schedule-data-table tbody td.negative {
    color: var(--goalfix-danger, #fa5c7c) !important;
    font-weight: 600;
}

@media (max-width: 992px) {
    .schedule-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .schedule-toolbar__meta {
        margin-left: 0;
        width: 100%;
    }

    .schedule-year-group,
    .schedule-view-group {
        width: 100%;
    }

    .schedule-year-group .form-select,
    .schedule-view-group .form-select {
        flex: 1;
        min-width: 0;
    }

    .schedule-table-view .schedule-data-table--monthly {
        min-width: calc(13rem + (12 * 3.5rem) + 5rem) !important;
    }

    .schedule-table-view .schedule-data-table--monthly col.schedule-col-label {
        width: 13rem;
    }

    .schedule-table-view .schedule-data-table--monthly col.schedule-col-year {
        width: 5rem;
    }

    .schedule-data-table--monthly thead th:not(.sticky-col):not(.year-col),
    .schedule-data-table--monthly tbody td:not(.sticky-col):not(.year-col) {
        padding-left: 0.25rem !important;
        padding-right: 0.25rem !important;
        font-size: 0.6875rem;
    }
}

@media (max-width: 576px) {
    .schedule-table-view .schedule-data-table--monthly {
        min-width: calc(11.5rem + (12 * 3.25rem) + 4.75rem) !important;
    }

    .schedule-table-view .schedule-data-table--monthly col.schedule-col-label {
        width: 11.5rem;
    }

    .schedule-table-view .schedule-data-table--monthly col.schedule-col-year {
        width: 4.75rem;
    }

    .schedule-table-view .schedule-data-table--monthly .sticky-col {
        font-size: 0.75rem;
    }

    .schedule-data-table thead th.year-col,
    .schedule-data-table tbody td.year-col {
        min-width: 0;
        max-width: none;
        width: auto;
    }
}

/* Loading overlay */
.financial-statement-table.loading {
    opacity: 0.5;
    pointer-events: none;
}

/* Responsive adjustments */
@media (max-width: 1400px) {
    .financial-statement-table thead th,
    .financial-statement-table tbody td {
        min-width: 90px;
        padding: 13px 15px;
        font-size: 13px;
    }
    
    .financial-statement-table:not(.schedule-data-table) .sticky-col {
        min-width: 220px !important;
        max-width: 220px !important;
    }
}

@media (max-width: 1200px) {
    .financial-statement-table thead th,
    .financial-statement-table tbody td {
        min-width: 85px;
        padding: 12px 14px;
        font-size: 12px;
    }
    
    .financial-statement-table:not(.schedule-data-table) .sticky-col {
        min-width: 200px !important;
        max-width: 200px !important;
        font-size: 12px;
    }
    
    .financial-statement-table .year-col {
        min-width: 100px !important;
    }
}

@media (max-width: 992px) {
    .financial-statement-table {
        font-size: 11px;
    }
    
    .financial-statement-table thead th,
    .financial-statement-table tbody td {
        min-width: 75px;
        padding: 10px 12px;
        font-size: 11px;
    }
    
    .financial-statement-table:not(.schedule-data-table) .sticky-col {
        min-width: 180px !important;
        max-width: 180px !important;
        font-size: 11px;
    }
    
    .financial-statement-table .year-col {
        min-width: 90px !important;
    }
    
    .table-scroll-wrapper {
        margin-left: -15px;
        margin-right: -15px;
        border-radius: 0;
    }
}

@media (max-width: 768px) {
    .financial-statement-table {
        font-size: 10px;
    }
    
    .financial-statement-table thead th,
    .financial-statement-table tbody td {
        min-width: 65px;
        padding: 8px 10px;
        font-size: 10px;
    }
    
    .financial-statement-table:not(.schedule-data-table) .sticky-col {
        min-width: 160px !important;
        max-width: 160px !important;
        font-size: 10px;
    }
    
    .financial-statement-table .year-col {
        min-width: 80px !important;
    }
    
    .financial-statement-header h3 {
        font-size: 18px;
    }
}

/* ========================================
   PHASE 1: PRODUCT CARDS DESIGN
   ======================================== */

/* Product Cards Container - uses Bootstrap row/col */
.product-cards-container {
    margin: 0 0 1.5rem 0;
}

.product-card {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
    position: relative;
}

.product-card:hover {
    border-color: var(--goalfix-accent);
    box-shadow: 0 8px 24px rgba(18, 179, 239, 0.15);
    transform: translateY(-4px);
}

.product-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.product-icon {
    width: 48px;
    height: 48px;
    background: var(--goalfix-gradient);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: white;
    flex-shrink: 0;
}

.product-icon i {
    font-size: 24px;
    line-height: 1;
    color: white;
}

.product-name {
    flex: 1;
    font-weight: 600;
    font-size: 18px;
    color: var(--goalfix-dark);
    line-height: 1.4;
    word-break: break-word;
}

.product-metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 16px 0;
}

.metric-box {
    background: #f8f9fa;
    padding: 16px;
    border-radius: 8px;
    min-height: 85px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.metric-label {
    font-size: 13px;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    display: block;
    line-height: 1.4;
    font-weight: 600;
}

.metric-value {
    font-size: 22px;
    font-weight: 700;
    color: #1a2942;
    line-height: 1.4;
    display: block;
}

.mini-chart {
    height: 40px;
    margin: 8px 0;
    display: flex;
    align-items: flex-end;
    gap: 3px;
}

.mini-chart-bar {
    flex: 1;
    background: linear-gradient(to top, var(--goalfix-primary-light), var(--goalfix-primary-dark));
    border-radius: 2px;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.mini-chart-bar:hover {
    opacity: 1;
}

/* Kubayar-style product cards (Bootstrap card + table layout) */
/* Override .tab-pane line-height:0 which collapses text in product cards */
#product.tab-pane .product-cards-container,
#product.tab-pane .product-card-kubayar {
    line-height: 1.5;
}

.product-card-kubayar {
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 10px;
    overflow: hidden;
}

.product-card-kubayar:hover {
    border-color: var(--primary, #5A45AA);
}

.product-card-kubayar-header {
    background: linear-gradient(135deg, var(--primary-dark, #20193d) 0%, var(--primary, #5A45AA) 100%);
    color: #fff;
    border-bottom: none;
}

.product-card-kubayar-header .card-title,
.product-card-kubayar-header .product-card-title {
    color: #fff;
    font-weight: 600;
}

.product-card-kubayar-header .btn-light {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

.product-card-kubayar-header .btn-light:hover {
    background: rgba(255, 255, 255, 0.3);
    border-color: rgba(255, 255, 255, 0.4);
    color: #fff;
}

.product-icon {
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #fff;
}

.product-card-gross-profit-row td {
    background: #f5f5f0;
    border-top: 1px solid var(--border, #EAE9ED);
    padding: 0.6rem 1rem;
}

.product-card-table {
    font-size: 0.875rem;
    line-height: 1.5;
    table-layout: fixed;
    border-collapse: collapse;
}

.product-card-table thead tr,
.product-card-table tbody tr {
    display: table-row;
}

.product-card-table th,
.product-card-table td {
    display: table-cell;
    padding: 0.5rem 1rem;
    vertical-align: middle;
    line-height: 1.5;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.product-card-table thead th {
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.product-card-table td:first-child,
.product-card-table th:first-child {
    white-space: normal;
}

.product-card-table td:not(:first-child),
.product-card-table th:not(:first-child) {
    white-space: nowrap;
    min-width: 5rem;
}

.product-card-col-divider {
    border-left: 1px solid var(--border, #EAE9ED);
}

.product-card-th {
    font-weight: 500;
    text-transform: uppercase;
    font-size: 0.75rem;
    color: var(--text, #888888);
}

.product-card-th-metric {
    text-align: left;
}

.product-card-th-year {
    text-align: center;
    color: var(--primary, #5A45AA);
    font-weight: 600;
}

.product-card-table tbody tr:hover {
    background: var(--light, #f4f4f6);
}

/* Product summary card (Kubayar-style) */
.product-summary-card {
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 10px;
    overflow: hidden;
}

.product-summary-card .card-body {
    padding: 1.5rem 1.75rem 1.75rem 1.75rem;
}

.product-summary-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(135deg, var(--primary-dark, #20193d) 0%, var(--primary, #5A45AA) 100%);
    color: #fff;
    padding: 1rem 1.25rem;
    border-bottom: none;
}

.product-summary-header h5 {
    color: #fff;
    font-weight: 600;
}

.product-summary-count {
    font-size: 0.8rem;
    opacity: 0.9;
}

.product-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    padding: 0;
}

@media (max-width: 768px) {
    .product-summary-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

.product-summary-col {
    padding: 20px 22px;
    background: var(--light, #f4f4f6);
    border-radius: 8px;
    min-height: 0;
}

.product-summary-col.product-summary-totals {
    background: var(--rgba-primary-1, rgba(90, 69, 170, 0.1));
    border: 1px solid rgba(90, 69, 170, 0.2);
    padding: 20px 22px 28px 22px;
}

.product-summary-year-badge {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--primary, #5A45AA);
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(90, 69, 170, 0.2);
}

.product-summary-year-badge-total {
    color: var(--primary-dark, #20193d);
}

.product-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 10px 0;
    font-size: 15px;
    gap: 12px;
    line-height: 1.5;
}

.product-summary-label {
    color: var(--goalfix-dark, #1a2942);
    font-weight: 600;
    font-size: 0.9em;
    flex-shrink: 0;
}

.product-summary-value {
    font-weight: 700;
    font-size: 1.05em;
    color: var(--text-dark, #0b141b);
    text-align: right;
}

.product-summary-revenue .product-summary-value {
    color: var(--primary, #5A45AA);
}

.product-summary-margin .product-summary-value {
    color: var(--primary, #5A45AA);
}

/* Gross Profit row at bottom of each year column */
.product-summary-row.product-summary-gross-profit {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 2px solid rgba(90, 69, 170, 0.25);
}

.product-summary-value-emphasis {
    color: var(--primary, #5A45AA) !important;
    font-size: 1.1em !important;
}

/* Total Gross Profit – per-product table */
.product-summary-gp-table-wrap {
    width: 100%;
    margin-top: 12px;
    padding-bottom: 4px;
}

.product-summary-gp-table {
    width: 100%;
    font-size: 14px;
    border-collapse: collapse;
}

.product-summary-gp-table thead th {
    font-weight: 700;
    color: var(--primary-dark, #20193d);
    padding: 10px 10px 14px 0;
    border-bottom: 1px solid rgba(90, 69, 170, 0.3);
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.product-summary-gp-table .product-summary-gp-th-name {
    text-align: left;
}

.product-summary-gp-table .product-summary-gp-th-year {
    min-width: 72px;
}

.product-summary-gp-table tbody td {
    padding: 12px 10px 12px 0;
    border-bottom: 1px solid rgba(90, 69, 170, 0.12);
    line-height: 1.5;
}

.product-summary-gp-table .product-summary-gp-name {
    font-weight: 600;
    color: var(--goalfix-dark, #1a2942);
}

.product-summary-gp-table .product-summary-gp-value {
    font-weight: 700;
    color: var(--text-dark, #0b141b);
}

.product-summary-gp-table tfoot td {
    padding: 16px 10px 12px 0;
    border-top: 2px solid rgba(90, 69, 170, 0.35);
    border-bottom: none;
}

.product-summary-gp-table .product-summary-gp-total-row .product-summary-gp-value {
    color: var(--primary, #5A45AA);
    font-size: 1.05em;
}


/* ========================================
   PRODUCT TABLE VIEW – Kubayar table styling (rows, columns, header, buttons)
   ======================================== */

.product-table-view {
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

/* Header row: Product title left, Card View + Add New Product far right (Kubayar card-header style) */
.product-table-header-row.card-header-style {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.product-table-title {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--goalfix-primary-dark, #1a2942);
    letter-spacing: 0.02em;
}

.product-table-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.product-view-btn {
    white-space: nowrap;
}

/* Product block: card with table (Kubayar card-body p-0) */
.product-table-block {
    margin-bottom: 1.25rem;
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

/* Table header bar above column headings: product name + Delete Product button, colored background */
.product-table-block-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0.625rem 1rem;
    background: linear-gradient(135deg, var(--goalfix-primary-dark, #1f19ba) 0%, var(--goalfix-primary-light, #5A45AA) 100%);
    color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.product-table-block-title {
    flex: 1;
    min-width: 0;
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 6px;
    padding: 0.35rem 0.75rem;
}

.product-table-block-title::placeholder {
    color: rgba(255,255,255,0.7);
}

.product-table-block-title:focus {
    background: #fff;
    color: var(--goalfix-dark, #1a2942);
    border-color: #fff;
    outline: 0;
}

.product-table-block-title:focus::placeholder {
    color: #adb5bd;
}

.product-table-block-delete {
    flex-shrink: 0;
    font-size: 0.8125rem;
    white-space: nowrap;
    border-color: rgba(255,255,255,0.6);
    color: #fff;
}

.product-table-block-delete:hover {
    background: rgba(255,255,255,0.2);
    border-color: #fff;
    color: #fff;
}

/* Year dropdown in table header (before Delete Product) */
.product-table-header-year-wrap {
    flex-shrink: 0;
}

.product-table-year-select {
    min-width: 100px;
    font-size: 0.8125rem;
    padding: 0.35rem 1.75rem 0.35rem 0.5rem;
    background: rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.5);
    border-radius: 6px;
    color: #fff;
}

.product-table-year-select option {
    background: var(--goalfix-dark);
    color: #fff;
}

.product-table-year-select:focus {
    border-color: #fff;
    outline: 0;
}

/* Totals / Summary table heading (3rd table on product page) */
.product-totals-header {
    padding: 0.625rem 1rem;
    background: linear-gradient(135deg, var(--goalfix-primary-dark, #1f19ba) 0%, var(--goalfix-primary-light, #5A45AA) 100%);
    color: #fff;
    font-weight: 600;
    font-size: 1rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    border-radius: 0.5rem 0.5rem 0 0;
}

/* Kubayar-style table: borders, striped, hover, thead */
.product-data-table,
.product-totals-table {
    --bs-table-border-color: #EAE9ED;
    font-size: 0.9375rem;
}

.product-data-table th,
.product-data-table td,
.product-totals-table th,
.product-totals-table td {
    border-color: #EAE9ED;
    padding: 0.5rem 0.625rem;
    vertical-align: middle;
}

.product-data-table thead th,
.product-totals-table thead th {
    border-bottom: 1px solid var(--border, #EAE9ED);
    text-transform: capitalize;
    font-size: 0.9375rem;
    white-space: nowrap;
    font-weight: 500;
    color: var(--text-dark, #1a2942);
    letter-spacing: 0.02em;
    background-color: #f8f9fa;
}

.product-data-table.table-striped > tbody > tr:nth-of-type(odd) > *,
.product-data-table.table-hover tbody tr:hover > *,
.product-totals-table.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #f2f4fa;
}

.product-data-table tbody tr th,
.product-totals-table tbody tr th {
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    background-color: inherit;
}

/* Column widths */
.product-table-col-label {
    min-width: 140px;
    width: 140px;
}

.product-table-col-year {
    min-width: 90px;
    text-align: right;
}

.product-table-col-month {
    min-width: 70px;
    text-align: right;
}

.product-table-col-actions {
    min-width: 90px;
}

.product-table-name-input {
    font-weight: 600;
    font-size: 0.9375rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid transparent;
    background: transparent;
    width: 100%;
}

.product-table-name-input:focus {
    border-color: var(--goalfix-accent);
    outline: 0;
    box-shadow: 0 0 0 2px rgba(18, 179, 239, 0.2);
    background: #fff;
}

/* Table inputs: clean, consistent styling (Capex/Product/Variable Expenses) */
.product-data-table .product-table-input,
.product-data-table input.form-control,
.product-totals-table .product-table-input {
    font-size: 0.875rem;
    padding: 0.375rem 0.625rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    width: 100%;
    max-width: 100%;
    background-color: #fff;
    color: var(--goalfix-dark, #1a2942);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.product-data-table .product-table-input:hover,
.product-data-table input.form-control:hover,
.product-totals-table .product-table-input:hover {
    border-color: #ced4da;
}

.product-data-table .product-table-input:focus,
.product-data-table input.form-control:focus,
.product-totals-table .product-table-input:focus {
    border-color: var(--goalfix-accent, #12b3ef);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(18, 179, 239, 0.15);
    background-color: #fff;
}

/* Table selects (dropdowns): compact width like legacy, but with improved styling (in-between) */
.product-data-table .form-select.product-table-input,
.product-data-table select.form-select,
.product-data-table select.product-table-input,
.product-totals-table select.form-select,
.product-totals-table select.product-table-input {
    font-size: 0.875rem;
    padding: 0.375rem 1.75rem 0.375rem 0.5rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    width: auto;
    min-width: 4.5rem;
    max-width: 100%;
    background-color: #fff;
    color: var(--goalfix-dark, #1a2942);
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23495057'%3e%3cpath d='M8 11L3 6h10l-5 5z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.4rem center;
    background-size: 0.875rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    display: inline-block;
}

.product-data-table .form-select.product-table-input:hover,
.product-data-table select.form-select:hover,
.product-data-table select.product-table-input:hover,
.product-totals-table select.form-select:hover,
.product-totals-table select.product-table-input:hover {
    border-color: #ced4da;
}

.product-data-table .form-select.product-table-input:focus,
.product-data-table select.form-select:focus,
.product-data-table select.product-table-input:focus,
.product-totals-table select.form-select:focus,
.product-totals-table select.product-table-input:focus {
    border-color: var(--goalfix-accent, #12b3ef);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(18, 179, 239, 0.15);
    background-color: #fff;
}

/* Value cells: white background so inputs/selects look clean on striped rows */
.product-data-table tbody td .product-table-input,
.product-data-table tbody td .form-control,
.product-data-table tbody td .form-select {
    min-height: 2rem;
}

/* Value column stays right-aligned so compact selects sit on the right (legacy-friendly) */

/* Legacy class kept for any non-table usage */
.product-table-input {
    font-size: 0.875rem;
    padding: 0.375rem 0.625rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    width: 100%;
    max-width: 100%;
    background-color: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.product-table-input:focus {
    border-color: var(--goalfix-accent, #12b3ef);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(18, 179, 239, 0.15);
}

.product-table-delete-btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.8125rem;
    white-space: nowrap;
}

/* Capex / Leased Assets: single table per type, one row per item (like Funding) */
.product-table-view .assets-capex-table,
.product-table-view .assets-leased-table {
    min-width: 1px;
}
.product-table-view .assets-capex-table th,
.product-table-view .assets-capex-table td,
.product-table-view .assets-leased-table th,
.product-table-view .assets-leased-table td {
    padding: 0.4rem 0.5rem;
    vertical-align: middle;
}
.product-table-view .assets-capex-table thead th,
.product-table-view .assets-leased-table thead th {
    font-size: 0.875rem;
    white-space: nowrap;
}
.product-table-view .assets-col-item {
    min-width: 120px;
    max-width: 220px;
}
.product-table-view .assets-table-compact .product-table-col-actions {
    min-width: 72px;
    width: 72px;
}
.product-table-view .assets-table-compact .product-table-delete-btn {
    padding: 0.2rem 0.4rem;
    font-size: 0.75rem;
}

/* Funding table view: block header title (span, not input) – used in card view */
.funding-table-block-title {
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
}

/* Funding data table: compact layout (similar to product/assets table) */
.funding-table-view .product-data-table.funding-data-table {
    min-width: 1px;
}

/* Compact funding table: no block header bar, tighter rows */
.funding-table-view .funding-table-compact .table-responsive {
    border-radius: 0.5rem;
}
.funding-table-view .funding-data-table th,
.funding-table-view .funding-data-table td {
    padding: 0.4rem 0.5rem;
    vertical-align: middle;
}
.funding-table-view .funding-data-table thead th {
    font-size: 0.875rem;
    white-space: nowrap;
}

/* Funding: Source column – compact (dropdown fits "Personal Capital" etc.) */
.funding-table-view .funding-data-table th.funding-col-source,
.funding-table-view .funding-data-table td.funding-col-source {
    min-width: 140px;
    width: auto;
    max-width: 200px;
}
.funding-table-view .funding-data-table td.funding-col-source select {
    width: 100%;
    max-width: 100%;
}

/* Funding: Amount column – enough for numbers */
.funding-table-view .funding-data-table th.product-table-col-year:nth-child(2),
.funding-table-view .funding-data-table td.product-table-col-year:nth-child(2) {
    min-width: 90px;
}
/* Month received, Repayment term: compact dropdowns */
.funding-table-view .funding-data-table .funding-term-cell,
.funding-table-view .funding-data-table td:nth-child(4) {
    min-width: 5rem;
}
.funding-table-view .funding-data-table td:nth-child(3) {
    min-width: 4rem;
}

.funding-data-table .funding-col-interest,
.funding-data-table .funding-interest-cell {
    min-width: 64px;
    max-width: 80px;
}

/* Actions column: compact delete button */
.funding-table-view .funding-data-table .product-table-col-actions {
    min-width: 72px;
    width: 72px;
}
.funding-table-view .funding-data-table .product-table-delete-btn {
    padding: 0.2rem 0.4rem;
    font-size: 0.75rem;
}

/* Ensure funding table stays compact on small screens */
@media (max-width: 991px) {
    .funding-table-view .funding-data-table th.funding-col-source,
    .funding-table-view .funding-data-table td.funding-col-source {
        min-width: 120px;
        max-width: 180px;
    }
    .funding-table-view .funding-data-table th,
    .funding-table-view .funding-data-table td {
        padding: 0.35rem 0.4rem;
    }
}

/* Deposits data table: compact layout (similar to funding table) */
.deposits-table-view .product-data-table.deposits-data-table {
    min-width: 1px;
}
.deposits-table-view .deposits-table-compact .table-responsive {
    border-radius: 0.5rem;
}
.deposits-table-view .deposits-data-table th,
.deposits-table-view .deposits-data-table td {
    padding: 0.4rem 0.5rem;
    vertical-align: middle;
}
.deposits-table-view .deposits-data-table thead th {
    font-size: 0.875rem;
    white-space: nowrap;
}
.deposits-table-view .deposits-data-table th.deposits-col-item,
.deposits-table-view .deposits-data-table td.deposits-col-item {
    min-width: 140px;
    max-width: 220px;
}
.deposits-table-view .deposits-data-table .product-table-col-actions {
    min-width: 72px;
    width: 72px;
}
.deposits-table-view .deposits-data-table .product-table-delete-btn {
    padding: 0.2rem 0.4rem;
    font-size: 0.75rem;
}
@media (max-width: 991px) {
    .deposits-table-view .deposits-data-table th.deposits-col-item,
    .deposits-table-view .deposits-data-table td.deposits-col-item {
        min-width: 120px;
        max-width: 180px;
    }
    .deposits-table-view .deposits-data-table th,
    .deposits-table-view .deposits-data-table td {
        padding: 0.35rem 0.4rem;
    }
}

/* Keep all columns visible: horizontal scroll with min width; pink scrollbar so it is easy to see */
.product-table-block .table-responsive,
.product-table-view .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: #ec407a #fce4ec;
    scrollbar-width: thin;
}

.product-table-block .table-responsive::-webkit-scrollbar,
.product-table-view .table-responsive::-webkit-scrollbar {
    height: 10px;
}

.product-table-block .table-responsive::-webkit-scrollbar-track,
.product-table-view .table-responsive::-webkit-scrollbar-track {
    background: #fce4ec;
    border-radius: 5px;
}

.product-table-block .table-responsive::-webkit-scrollbar-thumb,
.product-table-view .table-responsive::-webkit-scrollbar-thumb {
    background: #ec407a;
    border-radius: 5px;
}

.product-table-block .table-responsive::-webkit-scrollbar-thumb:hover,
.product-table-view .table-responsive::-webkit-scrollbar-thumb:hover {
    background: #d81b60;
}

.product-data-table,
.product-totals-table {
    min-width: 1px;
}

/* Responsive: reduce font size and padding on smaller screens so table fits better */
@media (max-width: 991px) {
    .product-data-table,
    .product-totals-table {
        font-size: 0.8125rem;
    }
    .product-data-table th,
    .product-data-table td,
    .product-totals-table th,
    .product-totals-table td {
        padding: 0.4rem 0.5rem;
    }
    .product-table-col-label {
        min-width: 110px;
        width: 110px;
    }
    .product-table-col-year {
        min-width: 72px;
    }
    .product-table-col-month {
        min-width: 56px;
    }
    .product-data-table .product-table-input,
    .product-data-table input.form-control,
    .product-data-table .form-select.product-table-input,
    .product-data-table select.form-select,
    .product-table-input {
        font-size: 0.8125rem;
        padding: 0.25rem 0.5rem;
    }
    .product-data-table .form-select.product-table-input,
    .product-data-table select.form-select,
    .product-data-table select.product-table-input {
        padding-right: 1.75rem;
        background-position: right 0.4rem center;
    }
}

@media (max-width: 767px) {
    .product-data-table,
    .product-totals-table {
        font-size: 0.75rem;
    }
    .product-data-table th,
    .product-data-table td,
    .product-totals-table th,
    .product-totals-table td {
        padding: 0.35rem 0.4rem;
    }
    .product-table-col-label {
        min-width: 90px;
        width: 90px;
    }
    .product-table-col-year {
        min-width: 60px;
    }
    .product-table-col-month {
        min-width: 48px;
    }
    .product-table-block-header {
        flex-wrap: wrap;
        padding: 0.5rem 0.75rem;
    }
    .product-table-block-title {
        font-size: 0.9375rem;
    }
    .product-table-year-select {
        min-width: 88px;
        font-size: 0.75rem;
    }
}

/* Very small screens: stack table rows as cards (label + row of values) */
@media (max-width: 575px) {
    .product-table-block .table-responsive {
        overflow-x: visible;
    }
    .product-data-table,
    .product-totals-table {
        display: block;
        font-size: 0.8125rem;
    }
    .product-data-table thead,
    .product-totals-table thead {
        display: none;
    }
    .product-data-table tbody tr,
    .product-totals-table tbody tr {
        display: block;
        border: 1px solid #EAE9ED;
        border-radius: 6px;
        margin-bottom: 0.5rem;
        padding: 0.5rem;
        background: #f8f9fa;
    }
    .product-data-table tbody tr:nth-of-type(odd),
    .product-totals-table tbody tr:nth-of-type(odd) {
        background: #fff;
    }
    .product-data-table tbody td,
    .product-data-table tbody th,
    .product-totals-table tbody td,
    .product-totals-table tbody th {
        display: block;
        border: none;
        padding: 0.25rem 0;
        min-width: auto;
        width: auto;
    }
    .product-data-table tbody th,
    .product-totals-table tbody th {
        font-size: 0.75rem;
        color: var(--goalfix-primary-dark);
        padding-bottom: 0.35rem;
        border-bottom: 1px solid #e9ecef;
        margin-bottom: 0.35rem;
    }
    .product-data-table tbody td,
    .product-totals-table tbody td {
        display: inline-block;
        width: calc(25% - 4px);
        min-width: 0;
        padding: 0.2rem 4px;
        font-size: 0.7rem;
        text-align: right;
    }
    .product-data-table .product-table-col-label,
    .product-totals-table .product-table-col-label {
        width: auto;
        min-width: 0;
    }
}

/* Card view: ensure view toggle and Add Product are far right */
.product-cards-header-row .ms-auto {
    margin-left: auto;
}

/* ========================================
   WIDE DATA TABLE SCROLL – model inputs (fixed expenses, product, etc.)
   Viewport-bound scroll region + synced top scrollbar + edge shadows
   ======================================== */

.wide-table-scroll-host {
    position: relative;
}

.wide-table-scroll-top {
    overflow-x: auto;
    overflow-y: hidden;
    height: 16px;
    margin-bottom: 2px;
    scrollbar-width: auto;
    scrollbar-color: #ec407a #fce4ec;
    display: none;
}

.wide-table-scroll-host.can-scroll-x .wide-table-scroll-top {
    display: block;
}

.wide-table-scroll-top::-webkit-scrollbar {
    height: 14px;
}

.wide-table-scroll-top::-webkit-scrollbar-track {
    background: #fce4ec;
    border-radius: 7px;
}

.wide-table-scroll-top::-webkit-scrollbar-thumb {
    background: #ec407a;
    border-radius: 7px;
}

.wide-table-scroll-top-inner {
    height: 1px;
    pointer-events: none;
}

.wide-table-scroll-body {
    max-height: min(65vh, calc(100dvh - 280px));
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: #ec407a #fce4ec;
    scrollbar-width: auto;
    scrollbar-gutter: stable;
}

.wide-table-scroll-body--footer {
    max-height: none;
    overflow-y: hidden;
    overflow-x: auto;
}

.wide-table-scroll-body::-webkit-scrollbar {
    height: 14px;
    width: 14px;
}

.wide-table-scroll-body::-webkit-scrollbar-track {
    background: #fce4ec;
    border-radius: 7px;
}

.wide-table-scroll-body::-webkit-scrollbar-thumb {
    background: #ec407a;
    border-radius: 7px;
}

.wide-table-scroll-body::-webkit-scrollbar-thumb:hover {
    background: #e91e63;
}

/* Sticky header row inside scroll viewport */
.wide-table-scroll-body .fixed-expenses-data-table thead th {
    position: sticky;
    top: 0;
    z-index: 4;
}

/* Keep last column clear of the vertical scrollbar (overlay + classic) */
.wide-table-scroll-body .fixed-expenses-data-table thead th:last-child,
.wide-table-scroll-body .fixed-expenses-data-table tbody td:last-child,
.wide-table-scroll-body .fixed-expenses-data-table tbody th:last-child {
    padding-right: 1.125rem;
}

/* Scroll edge shadows (more content left/right) */
.wide-table-scroll-host::before,
.wide-table-scroll-host::after {
    content: '';
    position: absolute;
    top: 18px;
    bottom: 14px;
    width: 28px;
    pointer-events: none;
    z-index: 6;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.wide-table-scroll-host::before {
    left: 0;
    background: linear-gradient(to right, rgba(26, 41, 66, 0.1), transparent);
}

.wide-table-scroll-host::after {
    right: 14px;
    bottom: 14px;
    background: linear-gradient(to left, rgba(26, 41, 66, 0.1), transparent);
}

.wide-table-scroll-host.can-scroll-left::before {
    opacity: 1;
}

.wide-table-scroll-host.can-scroll-right::after {
    opacity: 1;
}

.wide-table-scroll-host.wide-table-scroll-host--footer::before {
    left: 0;
}

@media (max-width: 767.98px) {
    .wide-table-scroll-body {
        max-height: min(55vh, calc(100dvh - 240px));
    }
}

/* ========================================
   FIXED EXPENSES TABLE VIEW – same layout as Product table
   ======================================== */

.fixed-expenses-table-view {
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

.fixed-expenses-header-row.card-header-style {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

.fixed-expenses-title {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--goalfix-primary-dark, #1a2942);
    letter-spacing: 0.02em;
}

.fixed-expenses-back-link {
    font-weight: 500;
    color: var(--goalfix-primary-dark, #1f19ba);
    text-decoration: none;
}

.fixed-expenses-back-link:hover {
    color: var(--goalfix-primary-light, #5A45AA);
    text-decoration: underline;
}

.fixed-expenses-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.fixed-expenses-header-year-wrap {
    flex-shrink: 0;
}

.fixed-expenses-year-select {
    min-width: 100px;
    font-size: 0.8125rem;
    padding: 0.35rem 1.75rem 0.35rem 0.5rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: #fff;
}

.fixed-expenses-schedule-title {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--goalfix-primary-dark, #1a2942);
}

.fixed-expenses-table-card {
    margin-bottom: 0;
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

.fixed-expenses-data-table,
.fixed-expenses-totals-table {
    --bs-table-border-color: #EAE9ED;
    font-size: 0.9375rem;
    width: max-content;
    min-width: 100%;
}

.fixed-expenses-data-table th,
.fixed-expenses-data-table td,
.fixed-expenses-totals-table th,
.fixed-expenses-totals-table td {
    border-color: #EAE9ED;
    padding: 0.5rem 0.625rem;
    vertical-align: middle;
}

.fixed-expenses-data-table thead th,
.fixed-expenses-totals-table thead th {
    border-bottom: 1px solid var(--border, #EAE9ED);
    text-transform: capitalize;
    font-size: 0.9375rem;
    white-space: nowrap;
    font-weight: 500;
    color: var(--text-dark, #1a2942);
    letter-spacing: 0.02em;
    background-color: #f8f9fa;
}

.fixed-expenses-data-table.table-striped > tbody > tr:nth-of-type(odd) > *,
.fixed-expenses-data-table.table-hover tbody tr:hover > *,
.fixed-expenses-totals-table.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #f2f4fa;
}

.fixed-expenses-data-table tbody tr th,
.fixed-expenses-totals-table tbody tr th {
    font-weight: 600;
    color: var(--goalfix-primary-dark);
    background-color: inherit;
}

/* Actions and Label columns – scroll with the table (no horizontal stickiness) */
.fixed-expenses-data-table .fixed-expenses-col-actions {
    width: 56px;
    min-width: 56px;
    vertical-align: middle;
    white-space: nowrap;
}

.fixed-expenses-data-table .fixed-expenses-col-label {
    min-width: 140px;
    width: 140px;
}

.fixed-expenses-data-table.table-striped tbody tr:nth-of-type(odd) .fixed-expenses-col-actions,
.fixed-expenses-data-table.table-striped tbody tr:nth-of-type(odd) .fixed-expenses-col-label {
    background: #f2f4fa;
}

.fixed-expenses-data-table.table-striped tbody tr:nth-of-type(even) .fixed-expenses-col-actions,
.fixed-expenses-data-table.table-striped tbody tr:nth-of-type(even) .fixed-expenses-col-label {
    background: #fff;
}

.fixed-expenses-data-table tbody tr:hover .fixed-expenses-col-actions,
.fixed-expenses-data-table tbody tr:hover .fixed-expenses-col-label {
    background: #f2f4fa !important;
}

.fixed-expenses-group-row .fixed-expenses-col-actions,
.fixed-expenses-group-row .fixed-expenses-col-label {
    background: #f8f9fa !important;
}

.fixed-expenses-data-table tbody tr.fixed-expenses-group-row:hover .fixed-expenses-col-actions,
.fixed-expenses-data-table tbody tr.fixed-expenses-group-row:hover .fixed-expenses-col-label {
    background: #f2f4fa !important;
}

/* Icon-only action buttons (pen, bin, expand) */
.fixed-expenses-icon-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.fixed-expenses-icon-btn i {
    font-size: 1rem;
    line-height: 1;
}

.fixed-expenses-col-actions {
    min-width: 56px;
    width: 56px;
    white-space: nowrap;
}

.fixed-expenses-col-label {
    min-width: 140px;
    width: 140px;
}

.fixed-expenses-col-arrangement {
    min-width: 100px;
    width: 100px;
}

.fixed-expenses-col-year {
    min-width: 90px;
    text-align: right;
}

.fixed-expenses-col-month {
    min-width: 70px;
    text-align: right;
}

.fixed-expenses-label-input {
    font-weight: 600;
    font-size: 0.9375rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    width: 100%;
}

.fixed-expenses-label-input:focus {
    border-color: var(--goalfix-accent);
    outline: 0;
    box-shadow: 0 0 0 2px rgba(18, 179, 239, 0.2);
}

.fixed-expenses-input {
    font-size: 0.875rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    width: 100%;
    max-width: 100%;
}

.fixed-expenses-input:focus {
    border-color: var(--goalfix-accent);
    outline: 0;
}

.fixed-expenses-delete-btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.8125rem;
    white-space: nowrap;
}

.fixed-expenses-details-link {
    color: var(--goalfix-primary-dark, #1f19ba);
    text-decoration: none;
}

.fixed-expenses-details-link:hover {
    text-decoration: underline;
}

.fixed-expenses-group-row {
    background-color: #f8f9fa;
}

.fixed-expenses-group-row th {
    font-weight: 600;
}

/* Totals card (footer) – same style as product Summary */
.fixed-expenses-totals-card {
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

.fixed-expenses-totals-header {
    padding: 0.625rem 1rem;
    background: linear-gradient(135deg, var(--goalfix-primary-dark, #1f19ba) 0%, var(--goalfix-primary-light, #5A45AA) 100%);
    color: #fff;
    font-weight: 600;
    font-size: 1rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    border-radius: 0.5rem 0.5rem 0 0;
}

.fixed-expenses-total-row th,
.fixed-expenses-total-row td {
    font-weight: 600;
    color: var(--goalfix-primary-dark);
}

/* Totals table label column */
.fixed-expenses-totals-table tbody .fixed-expenses-col-label {
    background: #fff;
}

.fixed-expenses-table-card .table-responsive,
.fixed-expenses-table-view .table-responsive,
.fixed-expenses-table-view .wide-table-scroll-body {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: #ec407a #fce4ec;
    scrollbar-width: auto;
}

.fixed-expenses-table-card .table-responsive::-webkit-scrollbar,
.fixed-expenses-table-view .table-responsive::-webkit-scrollbar,
.fixed-expenses-table-view .wide-table-scroll-body::-webkit-scrollbar {
    height: 14px;
    width: 14px;
}

.fixed-expenses-table-card .table-responsive::-webkit-scrollbar-track,
.fixed-expenses-table-view .table-responsive::-webkit-scrollbar-track,
.fixed-expenses-table-view .wide-table-scroll-body::-webkit-scrollbar-track {
    background: #fce4ec;
    border-radius: 7px;
}

.fixed-expenses-table-card .table-responsive::-webkit-scrollbar-thumb,
.fixed-expenses-table-view .table-responsive::-webkit-scrollbar-thumb,
.fixed-expenses-table-view .wide-table-scroll-body::-webkit-scrollbar-thumb {
    background: #ec407a;
    border-radius: 7px;
}

.fixed-expenses-table-card .table-responsive::-webkit-scrollbar-thumb:hover,
.fixed-expenses-table-view .table-responsive::-webkit-scrollbar-thumb:hover,
.fixed-expenses-table-view .wide-table-scroll-body::-webkit-scrollbar-thumb:hover {
    background: #e91e63;
}

/* ========================================
   PHASE 1: EXPENSE CATEGORY CARDS
   ======================================== */

.expense-category-card {
    background: white;
    border-left: 4px solid var(--goalfix-accent);
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    transition: all 0.3s;
}

.expense-category-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    transform: translateX(3px);
}

.category-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.category-icon-title {
    display: flex;
    align-items: center;
    gap: 15px;
}

.category-icon {
    width: 40px;
    height: 40px;
    background: var(--goalfix-gradient);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
    flex-shrink: 0;
}

.category-icon i {
    font-size: 20px;
    line-height: 1;
}

.category-title {
    font-weight: 600;
    font-size: 18px;
    color: var(--goalfix-dark);
    line-height: 1.4;
    margin-bottom: 6px;
}

.category-total {
    font-size: 22px;
    font-weight: 700;
    color: var(--goalfix-accent);
    line-height: 1.4;
    white-space: nowrap;
}

.category-details {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.category-details.expanded {
    max-height: 2000px;
}

.expense-item {
    padding: 16px;
    border-radius: 8px;
    margin-bottom: 10px;
    background: #f8f9fa;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.2s;
    gap: 16px;
    flex-wrap: wrap;
}

.expense-item-label {
    flex: 1 1 auto;
    min-width: 160px;
    line-height: 1.5;
}

.expense-item-year {
    text-align: right;
    min-width: 70px;
    line-height: 1.5;
}

.expense-item-year1,
.expense-item-year2 {
    padding: 0 8px;
}

.expense-item-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.expense-item > div {
    line-height: 1.5;
}

.expense-item strong {
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
}

.expense-item .text-muted {
    display: block;
    line-height: 1.4;
    font-size: 13px;
}

.expense-item:hover {
    background: rgba(41, 171, 226, 0.1);
}

/* ========================================
   PHASE 1: PROGRESS TRACKING WIDGET
   ======================================== */

.model-progress-widget {
    background: linear-gradient(135deg, #1f19ba 0%, #12b3ef 100%);
    color: white;
    padding: 24px;
    border-radius: 12px;
    margin-bottom: 24px;
    box-shadow: 0 4px 15px rgba(31, 25, 186, 0.3);
}

.progress-header {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.9;
}

.progress-percentage {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 16px;
}

.progress-bar-container {
    background: rgba(255,255,255,0.2);
    height: 12px;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 20px;
}

.progress-bar-fill {
    background: white;
    height: 100%;
    border-radius: 6px;
    transition: width 0.5s ease;
    box-shadow: 0 2px 8px rgba(255, 255, 255, 0.3);
}

.progress-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
}

.progress-step {
    background: rgba(255, 255, 255, 0.1);
    padding: 10px 12px;
    border-radius: 6px;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
}

.progress-step.completed {
    background: rgba(255, 255, 255, 0.25);
}

.progress-step-icon {
    font-size: 16px;
}

.progress-step-name {
    flex: 1;
    font-weight: 500;
}

/* ========================================
   PHASE 1: MODAL/EDIT PANEL STYLES
   ======================================== */

.edit-panel {
    position: fixed;
    right: -500px;
    top: 0;
    width: 480px;
    height: 100vh;
    background: white;
    box-shadow: -4px 0 24px rgba(0,0,0,0.15);
    z-index: 1050;
    transition: right 0.3s ease;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.edit-panel.active {
    right: 0;
}

.edit-panel-header {
    padding: 20px 24px;
    border-bottom: 2px solid var(--goalfix-gray-200);
    background: var(--goalfix-gradient);
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.edit-panel-title {
    font-size: 20px;
    font-weight: 600;
}

.edit-panel-close {
    background: none;
    border: none;
    color: white;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s;
}

.edit-panel-close:hover {
    background: rgba(255, 255, 255, 0.2);
}

.edit-panel-body {
    flex: 1;
    padding: 24px;
    overflow-y: auto;
    line-height: 1.6;
}

.edit-panel-body h6 {
    margin-top: 24px;
    margin-bottom: 16px;
    clear: both;
}

.edit-panel-footer {
    padding: 16px 24px;
    border-top: 1px solid var(--goalfix-gray-200);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    background: var(--goalfix-gray-100);
}

.input-modern {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 15px;
    transition: all 0.2s;
    font-family: inherit;
    line-height: 1.5;
    display: block;
    margin-bottom: 8px;
}

.input-modern:focus {
    border-color: var(--goalfix-accent);
    outline: none;
    box-shadow: 0 0 0 4px rgba(18, 179, 239, 0.1);
}

/* Override for inputs inside rows */
.row .input-modern {
    margin-bottom: 0;
}

/* Input group styling for currency inputs */
.input-group .input-modern {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-bottom: 0;
}

.input-group-text {
    background: #e9ecef;
    border: 2px solid #e9ecef;
    border-right: none;
    border-radius: 8px 0 0 8px;
    padding: 12px 16px;
    font-weight: 600;
    color: var(--goalfix-dark);
}

.form-section small.text-muted {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.4;
}

.input-label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--goalfix-dark);
    font-size: 14px;
    line-height: 1.4;
}

.form-section {
    margin-bottom: 20px;
    clear: both;
}

.form-section label {
    display: block;
    margin-bottom: 6px;
    line-height: 1.4;
}

.form-section .row label {
    font-size: 11px;
    margin-bottom: 4px;
    display: block;
}

/* Edit Panel Overlay */
.edit-panel-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1049;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.edit-panel-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

/* ========================================
   PRODUCT EDIT MODAL (responsive, mobile-friendly)
   ======================================== */

.product-edit-modal .modal-dialog {
    max-width: 90%;
    margin: 0.5rem auto;
}

.product-edit-modal .modal-xl {
    max-width: 1140px;
}

.product-edit-modal .modal-header.product-edit-modal-header {
    background: linear-gradient(135deg, #1f19ba 0%, #12b3ef 100%);
    color: #fff;
    border-bottom: none;
    padding: 1rem 1.25rem;
}

.product-edit-modal .modal-header.product-edit-modal-header .modal-title,
.product-edit-modal .modal-header.product-edit-modal-header .modal-title i {
    color: #fff !important;
}

.product-edit-modal .modal-body.product-edit-modal-body {
    padding: 1.25rem;
    max-height: calc(100vh - 180px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.product-edit-modal .modal-footer.product-edit-modal-footer {
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--goalfix-gray-200);
    gap: 0.5rem;
}

.product-edit-modal .form-section .row.g-2 {
    margin-bottom: 0.5rem;
}

.product-edit-modal .input-modern,
.product-edit-modal .form-control {
    min-height: 44px;
    font-size: 16px;
}

.product-edit-modal .nav-pills .nav-link {
    padding: 0.5rem 1rem;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}

.product-edit-modal .nav-pills .nav-link.active {
    color: #fff !important;
    background: linear-gradient(135deg, #1f19ba 0%, #12b3ef 100%);
}

.product-edit-modal .product-modal-field-label {
    font-size: 12px;
    display: block;
    margin-bottom: 4px;
}

.product-edit-modal .btn {
    min-height: 44px;
    padding: 0.5rem 1rem;
}

@media (max-width: 767.98px) {
    .product-edit-modal .modal-dialog {
        max-width: 100%;
        margin: 0;
        min-height: 100vh;
    }
    .product-edit-modal .modal-content {
        min-height: 100vh;
        border-radius: 0;
        border: none;
    }
    .product-edit-modal .modal-body.product-edit-modal-body {
        max-height: none;
        flex: 1;
        padding: 1rem;
    }
    .product-edit-modal .product-modal-month-row .col-12 {
        margin-bottom: 0.25rem;
    }
    .product-edit-modal .modal-footer.product-edit-modal-footer {
        flex-direction: column;
        padding: 1rem;
    }
    .product-edit-modal .modal-footer .btn.me-auto {
        margin: 0;
        width: 100%;
    }
    .product-edit-modal .modal-footer .btn:not(.me-auto) {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .product-edit-modal .modal-header.product-edit-modal-header .modal-title {
        font-size: 1.1rem;
    }
    .product-edit-modal .input-label {
        font-size: 13px;
    }
}

/* ========================================
   PHASE 1: EMPTY STATES
   ======================================== */

.empty-state {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 12px;
    border: 2px dashed var(--goalfix-gray-300);
}

.empty-state-icon {
    font-size: 64px;
    color: #dee2e6;
    margin-bottom: 20px;
}

.empty-state h5 {
    color: var(--goalfix-dark);
    margin-bottom: 10px;
}

.empty-state p {
    color: var(--goalfix-gray-700);
    margin-bottom: 20px;
}

/* ========================================
   PHASE 1: QUICK ACTIONS
   ======================================== */

.quick-action-card {
    background: white;
    border: 2px solid var(--goalfix-gray-200);
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
}

.quick-action-card:hover {
    border-color: var(--goalfix-accent);
    box-shadow: 0 4px 16px rgba(18, 179, 239, 0.15);
    transform: translateY(-3px);
}

.quick-action-card i {
    font-size: 32px;
    color: var(--goalfix-accent);
    margin-bottom: 12px;
    display: block;
}

.quick-action-card h6 {
    color: var(--goalfix-dark);
    margin: 0;
    font-weight: 600;
}

/* ========================================
   PHASE 1: RESPONSIVE ADJUSTMENTS
   ======================================== */

@media (max-width: 768px) {
    .product-cards-container {
        grid-template-columns: 1fr;
    }
    
    .edit-panel {
        width: 100%;
        right: -100%;
    }
    
    .model-progress-widget {
        padding: 16px;
    }
    
    .progress-percentage {
        font-size: 24px;
    }
    
    .progress-steps {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .quick-action-card {
        padding: 16px;
    }
    
    .quick-action-card i {
        font-size: 24px;
    }
    
    .quick-action-card h6 {
        font-size: 14px;
    }
}

/* ========================================
   VARIABLE EXPENSES CARD STYLES
   ======================================== */

.expense-card {
    background: white;
    border: 2px solid #e9ecef;
    border-left: 4px solid;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
}

.expense-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transform: translateY(-4px);
}

.expense-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
    flex-shrink: 0;
}

.expense-icon i {
    font-size: 20px;
    line-height: 1;
}

.expense-name {
    font-weight: 600;
    font-size: 17px;
    color: var(--goalfix-dark);
    line-height: 1.4;
}

.expense-percentage {
    font-size: 28px;
    font-weight: 700;
    color: #ffbc00;
    line-height: 1.2;
}

/* ========================================
   ASSETS (CAPEX) CARD STYLES
   ======================================== */

.asset-card {
    background: white;
    border: 2px solid #e9ecef;
    border-left: 4px solid #0acf97;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
}

.asset-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transform: translateY(-4px);
    border-left-color: var(--goalfix-accent);
}

.asset-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #0acf97, #0a9975);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    flex-shrink: 0;
}

.asset-icon i {
    font-size: 24px;
    line-height: 1;
}

.asset-name {
    font-weight: 600;
    font-size: 17px;
    color: var(--goalfix-dark);
    line-height: 1.4;
    flex: 1;
}

.asset-timeline {
    display: flex;
    gap: 8px;
    margin: 12px 0;
}

.timeline-item {
    flex: 1;
    height: 6px;
    background: #e9ecef;
    border-radius: 3px;
    position: relative;
}

.timeline-item.active {
    background: #0acf97;
}

.timeline-item.future {
    background: #e9ecef;
}

/* ========================================
   FUNDING ROUND CARD STYLES
   ======================================== */

.funding-card {
    background: white;
    border: 2px solid #e9ecef;
    border-left: 4px solid #12b3ef;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
}

.funding-card:hover {
    box-shadow: 0 8px 24px rgba(18, 179, 239, 0.15);
    transform: translateY(-4px);
}

.funding-round-badge {
    background: linear-gradient(135deg, #12b3ef, #0a8dc7);
    color: white;
    padding: 10px 18px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 15px;
    display: inline-block;
    line-height: 1.3;
}

.funding-amount {
    font-size: 32px;
    font-weight: 700;
    color: var(--goalfix-primary-dark);
    line-height: 1.3;
    margin: 16px 0;
}

/* ========================================
   DEPOSIT CARD STYLES
   ======================================== */

.deposit-card {
    background: white;
    border: 2px solid #e9ecef;
    border-left: 4px solid #39afd1;
    border-radius: 12px;
    padding: 24px;
    transition: all 0.3s ease;
}

.deposit-card:hover {
    box-shadow: 0 8px 24px rgba(57, 175, 209, 0.15);
    transform: translateY(-4px);
}

.deposit-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #39afd1, #2a8aa8);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    flex-shrink: 0;
}

.deposit-icon i {
    font-size: 24px;
    line-height: 1;
}

/* ========================================
   PARAMETERS/SETTINGS CARD STYLES
   ======================================== */

.settings-card {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

.settings-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.settings-section-title {
    font-weight: 600;
    font-size: 18px;
    color: var(--goalfix-primary-dark);
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--goalfix-primary-light);
}

.settings-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 12px;
}

.settings-item-label {
    flex: 1;
    font-weight: 500;
    color: var(--goalfix-dark);
}

.settings-item-value {
    min-width: 200px;
}

/* ========================================
   GLOBAL CARD TEXT IMPROVEMENTS
   ======================================== */

/* Card headers and titles */
.product-card h4,
.expense-category-card h4,
.expense-card h4,
.asset-card h4,
.funding-card h4,
.deposit-card h4,
.settings-card h4 {
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 12px;
}

/* Card body text */
.product-card p,
.expense-category-card p,
.expense-card p,
.asset-card p,
.funding-card p,
.deposit-card p,
.settings-card p {
    font-size: 14px;
    line-height: 1.6;
}

/* Text muted in cards - increase size */
.product-card .text-muted,
.expense-category-card .text-muted,
.expense-card .text-muted,
.asset-card .text-muted,
.funding-card .text-muted,
.deposit-card .text-muted,
.settings-card .text-muted {
    font-size: 13px;
    line-height: 1.5;
}

/* Strong text in cards */
.product-card strong,
.expense-category-card strong,
.expense-card strong,
.asset-card strong,
.funding-card strong,
.deposit-card strong,
.settings-card strong {
    font-size: 15px;
    line-height: 1.5;
}

/* Badges in cards - larger */
.badge {
    font-size: 13px;
    padding: 6px 12px;
    font-weight: 600;
}

/* Alert boxes in cards */
.alert {
    font-size: 13px;
    line-height: 1.5;
}

.alert strong {
    font-size: 14px;
}

/* Button text sizing */
.btn-sm {
    font-size: 13px;
    padding: 8px 16px;
}

/* Ensure all card content has minimum spacing */
.product-card > *,
.expense-category-card > *,
.expense-card > *,
.asset-card > *,
.funding-card > *,
.deposit-card > *,
.settings-card > * {
    margin-bottom: 8px;
}

.product-card > *:last-child,
.expense-category-card > *:last-child,
.expense-card > *:last-child,
.asset-card > *:last-child,
.funding-card > *:last-child,
.deposit-card > *:last-child,
.settings-card > *:last-child {
    margin-bottom: 0;
}

/* ========================================
   KFI PAGE CONTAINER (aligned with model inputs styling)
   ======================================== */

#kfi {
    padding: 0 0 1.5rem 0;
}

/* KFI view wrapper – same font/size as product-table-view */
#kfi .kfi-table-view {
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

/* Page header row – same as product/fixed expenses card-header-style */
#kfi .kfi-header-row.card-header-style {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border, #EAE9ED);
}

/* Section block – same as product-table-block (card with border, radius) */
#kfi .kfi-section-block {
    margin-bottom: 1.25rem;
    border: 1px solid var(--border, #EAE9ED);
    border-radius: 0.5rem;
    overflow: hidden;
}

#kfi .kfi-section-block:last-child {
    margin-bottom: 0;
}

/* Section header bar – large like product-card-kubayar-header (py-3 + title size) */
#kfi .kfi-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, var(--goalfix-primary-dark, #1f19ba) 0%, var(--goalfix-primary-light, #5A45AA) 100%);
    color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    font-weight: 600;
    font-size: 1.125rem;
}

#kfi .kfi-section-header i {
    font-size: 1.35rem;
    opacity: 0.95;
}

#kfi .kfi-section-header-cashflow {
    background: linear-gradient(135deg, #0a8dc7 0%, #12b3ef 100%);
}

#kfi .kfi-section-header-breakeven {
    background: linear-gradient(135deg, #c78a0a 0%, #e0a500 100%);
}

#kfi .kfi-section-block .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: #ec407a #fce4ec;
    scrollbar-width: thin;
}

#kfi .kfi-section-block .table-responsive::-webkit-scrollbar {
    height: 10px;
}

#kfi .kfi-section-block .table-responsive::-webkit-scrollbar-track {
    background: #fce4ec;
    border-radius: 5px;
}

#kfi .kfi-section-block .table-responsive::-webkit-scrollbar-thumb {
    background: #ec407a;
    border-radius: 5px;
}

#kfi .kfi-section-block .table-responsive::-webkit-scrollbar-thumb:hover {
    background: #d81b60;
}

#kfi .kfi-section-block .table {
    margin-bottom: 0;
}

/* KFI card view wrapper (same typography as product-table-view) */
#kfi .kfi-view-wrapper {
    font-family: var(--goalfix-font-sans, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--goalfix-dark, #1a2942);
}

/* KFI cards grid: one card per section below header (like product page product-cards-container) */
#kfi .kfi-cards-container {
    display: flex;
    flex-wrap: wrap;
}
#kfi .kfi-cards-container .kfi-section-block {
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--border, #EAE9ED);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
#kfi .kfi-cards-container .kfi-section-block .table-responsive {
    flex: 1;
    min-height: 0;
}

/* KFI card tables: match product-card-table spacing and alignment (Metric | Year 1 | Year 2) */
#kfi .kfi-section-block .kfi-card-table {
    --bs-table-border-color: #EAE9ED;
    font-size: 0.875rem;
    line-height: 1.5;
    min-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}
/* Product-style row borders only (no full cell borders) */
#kfi .kfi-section-block .kfi-card-table.table-bordered th,
#kfi .kfi-section-block .kfi-card-table.table-bordered td {
    border-left: none;
    border-top: none;
    border-right: none;
}
#kfi .kfi-section-block .kfi-card-table th,
#kfi .kfi-section-block .kfi-card-table td {
    border-color: #EAE9ED;
    vertical-align: middle;
    padding: 0.5rem 1rem;
    line-height: 1.5;
    border-bottom: 1px solid var(--border, #EAE9ED);
}
#kfi .kfi-section-block .kfi-card-table thead th {
    border-bottom: 1px solid var(--border, #EAE9ED);
}
/* Metric column: left-aligned, can wrap; fixed width share so Year 1/Year 2 stay aligned */
#kfi .kfi-section-block .kfi-card-table th:first-child,
#kfi .kfi-section-block .kfi-card-table td:first-child {
    text-align: left;
    width: 52%;
    max-width: 52%;
    white-space: normal;
    word-wrap: break-word;
}
#kfi .kfi-section-block .kfi-card-table td.kfi-label,
#kfi .kfi-section-block .kfi-card-table td.kfi-percent-label {
    padding-right: 0.75rem;
}
/* Year 1 / Year 2 columns: fixed width, right-aligned like product page */
#kfi .kfi-section-block .kfi-card-table th.kfi-col-value,
#kfi .kfi-section-block .kfi-card-table td.kfi-value,
#kfi .kfi-section-block .kfi-card-table td.kfi-percent-value {
    width: 24%;
    min-width: 5rem;
    max-width: 24%;
    text-align: right !important;
    white-space: nowrap;
}
#kfi .kfi-section-block .kfi-card-table thead th {
    background-color: #f8f9fa;
    color: var(--text-dark, #1a2942);
    font-weight: 600;
}
/* Divider between Year 1 and Year 2 (restored after removing table-bordered) */
#kfi .kfi-section-block .kfi-card-table thead th.kfi-col-year2 {
    border-left: 1px solid var(--border, #EAE9ED);
}
#kfi .kfi-section-block .kfi-card-table tbody td:nth-child(3) {
    border-left: 1px solid var(--border, #EAE9ED);
}
#kfi .kfi-section-block .kfi-card-table thead th.kfi-col-value {
    color: var(--primary, #5A45AA);
    font-weight: 600;
}
/* Legacy design: % lines under each main item in different colour (blue/teal) */
#kfi .kfi-section-block .kfi-card-table tbody tr.kfi-percent-row td {
    background-color: rgba(44, 105, 141, 0.06);
    font-style: italic;
    color: var(--kfi-color, #2c698d);
    font-weight: 500;
    padding-top: 0.2rem;
    padding-bottom: 0.4rem;
}
#kfi .kfi-section-block .kfi-card-table tbody .kfi-percent-label {
    padding-left: 1.25rem;
}
#kfi .kfi-section-block .kfi-card-table tbody tr:hover {
    background: var(--light, #f4f4f6);
}

/* KFI section tables: same look as product-data-table / fixed-expenses-data-table */
#kfi .kfi-section-block .kfi-data-table {
    --bs-table-border-color: #EAE9ED;
    font-size: 0.9375rem;
    min-width: 100%;
}

#kfi .kfi-section-block .kfi-data-table th,
#kfi .kfi-section-block .kfi-data-table td {
    border-color: #EAE9ED;
    vertical-align: middle;
}

#kfi .kfi-section-block .kfi-data-table thead th {
    background-color: #f8f9fa;
    color: var(--text-dark, #1a2942);
    border-bottom: 1px solid var(--border, #EAE9ED);
    text-transform: capitalize;
    white-space: nowrap;
    letter-spacing: 0.02em;
    font-size: 1rem;
    font-weight: 600;
    padding: 0.5rem 0.625rem;
}

/* Primary header row: Year 1 / Year 2 – larger and bolder */
#kfi .kfi-section-block .kfi-data-table thead .kfi-group-year {
    font-size: 1.125rem;
    font-weight: 700;
    padding: 0.5rem 0.625rem;
}

#kfi .kfi-section-block .kfi-data-table thead .kfi-group-year-2 {
    border-left: 2px solid var(--goalfix-primary-dark, #2c698d);
}

/* Sub-header row: Value / % – clear but compact (only in multi-row thead) */
#kfi .kfi-section-block .kfi-data-table thead tr:last-child th:not(.kfi-group-year) {
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.35rem 0.5rem;
}

/* Body: metric column normal padding; value/% columns tighter so % sits close to value */
#kfi .kfi-section-block .kfi-data-table tbody td.kfi-label {
    padding: 0.5rem 0.625rem;
}

#kfi .kfi-section-block .kfi-data-table tbody .kfi-value,
#kfi .kfi-section-block .kfi-data-table tbody .kfi-percent {
    padding: 0.4rem 0.4rem;
}

#kfi .kfi-section-block .kfi-data-table.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #f2f4fa;
}

#kfi .kfi-section-block .kfi-data-table.table-hover tbody tr:hover > * {
    background-color: #f2f4fa;
}

#kfi .kfi-section-block .kfi-data-table .kfi-label {
    font-weight: 600;
    color: var(--goalfix-primary-dark, #1a2942);
    background-color: inherit;
}

/* Tighter columns: value and % close together; clear Year 1 vs Year 2 groups */
#kfi .kfi-section-block .kfi-data-table .kfi-col-label {
    min-width: 160px;
    width: 38%;
}

#kfi .kfi-section-block .kfi-data-table .kfi-col-value {
    min-width: 72px;
    width: 1%;
}

#kfi .kfi-section-block .kfi-data-table .kfi-col-percent {
    min-width: 48px;
    width: 1%;
}

/* Visual separator between Year 1 group and Year 2 group in tbody (5-col tables) */
#kfi .kfi-section-block .kfi-data-table tbody td:nth-child(4) {
    border-left: 2px solid var(--goalfix-primary-dark, #2c698d);
}

/* 3-column table (Break Even): separator before Year 2 column */
#kfi .kfi-section-block .kfi-data-table.kfi-table-cols-3 thead th.kfi-group-year-2,
#kfi .kfi-section-block .kfi-data-table.kfi-table-cols-3 tbody td:nth-child(3) {
    border-left: 2px solid var(--goalfix-primary-dark, #2c698d);
}

/* KFI Table View (product-table-view): % sub-rows in legacy blue, same as card view */
/* Year columns fixed on the right; metric column takes remaining space (room for more years) */
#kfi .product-table-view .kfi-legacy-table {
    table-layout: fixed;
}
#kfi .product-table-view .kfi-legacy-table th:first-child,
#kfi .product-table-view .kfi-legacy-table td:first-child {
    width: auto;
    min-width: 160px;
}
#kfi .product-table-view .kfi-legacy-table th.product-table-col-year,
#kfi .product-table-view .kfi-legacy-table td.product-table-col-year,
#kfi .product-table-view .kfi-legacy-table th:nth-child(2),
#kfi .product-table-view .kfi-legacy-table td:nth-child(2),
#kfi .product-table-view .kfi-legacy-table th:nth-child(3),
#kfi .product-table-view .kfi-legacy-table td:nth-child(3) {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
}
#kfi .product-table-view .kfi-legacy-table tbody tr.kfi-percent-row {
    background-color: rgba(44, 105, 141, 0.06);
}
#kfi .product-table-view .kfi-legacy-table tbody tr.kfi-percent-row td {
    background-color: rgba(44, 105, 141, 0.06);
    font-style: italic;
    color: var(--kfi-color, #2c698d);
    font-weight: 500;
    padding-top: 0.15rem;
    padding-bottom: 0.35rem;
}
#kfi .product-table-view .kfi-legacy-table tbody .kfi-percent-label {
    padding-left: 1.25rem;
}
#kfi .product-table-view .kfi-legacy-table tbody td:nth-child(3) {
    border-left: 2px solid var(--kfi-color, #2c698d);
}
#kfi .product-table-view .kfi-legacy-table thead th:nth-child(3) {
    border-left: 2px solid var(--kfi-color, #2c698d);
}
/* Section title span in KFI table view block header (read-only, no input styling) */
#kfi .product-table-view .product-table-block-header .kfi-legacy-table-title {
    flex: 1;
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
    background: transparent;
    border: none;
    padding: 0;
}

/* Legacy: keep settings-card overrides if legacy view uses them */
#kfi .settings-card {
    border: 1px solid #EAE9ED;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

#kfi .settings-card .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 0 0 8px 8px;
}

#kfi .settings-card .table {
    margin-bottom: 0;
}

#kfi .settings-card .table-responsive .kfi-table {
    min-width: 100%;
    table-layout: fixed;
}

/* ========================================
   KFI TABLE STYLES (Kubayar-inspired)
   ======================================== */

.kfi-table {
    font-size: 14px;
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    --kfi-border: #EAE9ED;
    --kfi-thead-bg: var(--goalfix-primary-dark, #2c698d);
    --kfi-thead-color: #fff;
}

/* Last header cell takes remaining space so header background fills the row */
.kfi-table thead th:last-child {
    width: auto !important;
}

/* Kubayar-style table header: solid background, clear typography */
.kfi-table thead th {
    background: var(--kfi-thead-bg);
    color: var(--kfi-thead-color);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 1rem 1.25rem;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.12);
    white-space: nowrap;
    vertical-align: middle;
}

.kfi-table thead th:first-child {
    text-align: left;
    border-radius: 0;
}

.kfi-table thead th.text-end,
.kfi-table thead th:not(:first-child) {
    text-align: right;
}

/* Align data under column headers */
.kfi-table tbody td {
    padding: 1rem 1.25rem;
    font-size: 14px;
    line-height: 1.5;
    vertical-align: middle;
    border-bottom: 1px solid var(--kfi-border);
}

.kfi-table tbody tr:last-child td {
    border-bottom: none;
}

.kfi-table tbody tr:hover td {
    background: rgba(41, 171, 226, 0.06);
}

/* First column: label (left-aligned to match header) */
.kfi-table .kfi-label {
    font-weight: 600;
    color: var(--goalfix-dark, #1e293b);
    font-size: 14px;
    text-align: left;
}

/* Value columns: right-aligned, tabular figures for alignment */
.kfi-table .kfi-value {
    text-align: right;
    font-family: var(--font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif);
    font-size: 15px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

.kfi-table .kfi-percent {
    text-align: right;
    font-family: var(--font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif);
    font-size: 14px;
    font-style: italic;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    color: var(--goalfix-primary-dark, #2c698d);
}

/* Empty cells in value columns stay right-aligned for alignment with headers */
.kfi-table tbody td:not(:first-child):empty,
.kfi-table tbody td.text-end {
    text-align: right;
}

.kfi-table tbody tr:hover {
    background: transparent;
}

.kfi-table tbody tr:hover td {
    background: rgba(41, 171, 226, 0.06);
}

.kfi-table .text-success {
    color: #0acf97 !important;
}

.kfi-table .text-danger {
    color: #fa5c7c !important;
}

/* Kubayar-style bordered table variant (optional) */
.kfi-table.table-bordered thead th,
.kfi-table.table-bordered tbody td {
    border: 1px solid var(--kfi-border);
}

.kfi-table.table-bordered thead th {
    border-bottom-width: 2px;
}

/* ========================================
   KFI LEGACY VIEW (label/value alignment)
   ======================================== */

.kfi-legacy-wrapper {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 200px 200px;
    gap: 0.35rem 1.5rem;
    align-items: baseline;
    padding: 0.5rem 0;
    max-width: 900px;
}

.kfi-legacy-wrapper > h3 {
    grid-column: 1 / -1;
    margin: 0 0 1rem 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.kfi-legacy-wrapper > p {
    grid-column: 1 / -1;
    margin: 1rem 0 0.5rem 0;
}

.kfi-legacy-wrapper > p:first-child {
    margin-top: 0;
}

.kfi-legacy-wrapper > hr {
    grid-column: 1 / -1;
    margin: 1rem 0 0.25rem 0;
    border: none;
    border-top: 1px solid #EAE9ED;
}

.kfi-legacy-wrapper > br {
    grid-column: 1 / -1;
    margin: 0;
    height: 0;
    padding: 0;
    visibility: hidden;
}

.kfi-legacy-wrapper .kfiColumnHeading,
.kfi-legacy-wrapper .kfiColumnHeadingYear1,
.kfi-legacy-wrapper .kfiColumnHeadingYear2 {
    font-weight: 600;
    color: var(--goalfix-primary-dark, #2c698d);
    padding: 0.5rem 0;
    border-bottom: 2px solid #EAE9ED;
}

.kfi-legacy-wrapper .kfiColumnHeadingYear1,
.kfi-legacy-wrapper .kfiColumnHeadingYear2,
.kfi-legacy-wrapper .kfiValue,
.kfi-legacy-wrapper .kfiValuePercentage {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-family: var(--font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif);
    letter-spacing: 0.02em;
}

.kfi-legacy-wrapper .kfiHeading,
.kfi-legacy-wrapper .kfiHeadingPercentage {
    font-weight: 600;
    color: var(--goalfix-dark, #1e293b);
}

.kfi-legacy-wrapper .kfiHeadingPercentage,
.kfi-legacy-wrapper .kfiValuePercentage {
    font-style: italic;
    color: var(--kfi-color, #2c698d);
}

/* ========================================
   TOOLTIP SYSTEM FOR FINANCIAL TERMS
   ======================================== */

/* Tooltip text trigger - makes the text itself hoverable */
.tooltip-trigger {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted var(--goalfix-accent);
    cursor: help;
    transition: all 0.2s ease;
}

.tooltip-trigger:hover {
    border-bottom-color: var(--goalfix-primary-dark);
    color: var(--goalfix-primary-dark);
}

/* Info icon next to labels (kept for backward compatibility) */
.info-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    background: var(--goalfix-gradient);
    color: white;
    border-radius: 50%;
    font-size: 11px;
    font-weight: bold;
    margin-left: 6px;
    cursor: help;
    position: relative;
    transition: all 0.2s ease;
    font-family: Arial, sans-serif;
}

.info-icon:hover {
    transform: scale(1.1);
    box-shadow: 0 2px 8px rgba(31, 25, 186, 0.3);
}

/* Tooltip container */
.tooltip-wrapper {
    position: relative;
    display: inline-block;
}

/* Tooltip content (hidden by default) */
.tooltip-content {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    z-index: 99999;
    background: white;
    color: #333;
    padding: 10px 14px;
    border-radius: 6px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    width: 260px;
    max-width: 90vw;
    font-size: 12px;
    line-height: 1.5;
    left: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 0.2s ease, visibility 0.2s ease;
    border: 1px solid #dee2e6;
    pointer-events: none;
    white-space: normal;
}

/* Arrow pointing left (toward the trigger text) */
.tooltip-content::after {
    content: "";
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: transparent white transparent transparent;
}

.tooltip-content::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    border-width: 7px;
    border-style: solid;
    border-color: transparent #dee2e6 transparent transparent;
    z-index: -1;
}

/* Show tooltip on hover - for both icon and text triggers */
.info-icon:hover + .tooltip-content,
.tooltip-trigger:hover .tooltip-content {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* Keep tooltip visible when hovering over it (for clicking links) */
.tooltip-content:hover {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* Tooltip title */
.tooltip-title {
    font-weight: bold;
    color: var(--goalfix-primary-dark);
    margin-bottom: 5px;
    font-size: 13px;
}

/* Tooltip link to glossary */
.tooltip-link {
    display: block;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #e9ecef;
    color: var(--goalfix-accent);
    font-size: 11px;
    text-decoration: none;
    font-weight: 500;
}

.tooltip-link:hover {
    color: var(--goalfix-primary-dark);
    text-decoration: underline;
}

/* Tooltips now always appear to the right, so no need for alternate positioning */

/* Responsive adjustments */
@media (max-width: 768px) {
    .tooltip-content {
        width: 240px;
        font-size: 12px;
        padding: 10px 12px;
    }
    
    .info-icon {
        width: 16px;
        height: 16px;
        line-height: 16px;
        font-size: 10px;
    }
}

/* For use in table headers and labels */
.leftHeadingLabel .info-icon,
.leftSubHeadingLabel .info-icon,
.kfi-label .info-icon {
    vertical-align: middle;
    margin-left: 4px;
}

/* Ensure tooltip trigger has high z-index when active */
.tooltip-trigger:hover {
    z-index: 1000;
    position: relative;
}

/* Income statement: tooltips must sit above sticky header and following rows */
.income-statement-data-table .tooltip-trigger {
    position: relative;
    z-index: 1;
}
.income-statement-data-table .tooltip-trigger:hover {
    z-index: 99999;
}
.income-statement-data-table .tooltip-content {
    z-index: 100000;
}

/* ========================================
   Platform Admin Portal
   ======================================== */
body.goalfix-admin-portal {
    --goalfix-admin-slate: #1a2332;
    --goalfix-admin-slate-mid: #243044;
    --goalfix-admin-accent: #3d8bfd;
}

/* Brand strip + logo: stay dark (override modeling white logo bar) */
body.goalfix-admin-portal #main-wrapper .nav-header,
body.goalfix-admin-portal #main-wrapper .nav-header .brand-logo {
    background: var(--goalfix-admin-slate) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: none !important;
}

body.goalfix-admin-portal #main-wrapper .nav-header .brand-logo .brand-title {
    max-height: 42px;
    filter: none;
}

/* Hamburger on dark brand strip — no white pill / shadow / border */
body.goalfix-admin-portal .nav-header .nav-control,
body.goalfix-admin-portal .nav-header .hamburger {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
body.goalfix-admin-portal .nav-header .hamburger .line,
body.goalfix-admin-portal #main-wrapper.menu-toggle .nav-header .nav-control .hamburger .line,
body.goalfix-admin-portal[data-sidebar-style="full"][data-layout="vertical"] #main-wrapper.menu-toggle .nav-header .nav-control .hamburger .line {
    background: rgba(255, 255, 255, 0.9) !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
}
body.goalfix-admin-portal .nav-header .nav-control:hover .hamburger .line,
body.goalfix-admin-portal #main-wrapper.menu-toggle .nav-header .nav-control:hover .hamburger .line {
    background: #fff !important;
    background-color: #fff !important;
}
body.goalfix-admin-portal #main-wrapper .nav-header {
    border-right: none !important;
    box-shadow: none !important;
}

body.goalfix-admin-portal .deznav {
    background: var(--goalfix-admin-slate-mid) !important;
}

body.goalfix-admin-portal .deznav .metismenu > li > a,
body.goalfix-admin-portal .deznav .metismenu .nav-text,
body.goalfix-admin-portal .deznav .menu-title {
    color: rgba(255, 255, 255, 0.85) !important;
}

body.goalfix-admin-portal .deznav .metismenu > li > a i {
    color: rgba(255, 255, 255, 0.7) !important;
}

body.goalfix-admin-portal .deznav .metismenu > li.mm-active > a,
body.goalfix-admin-portal .deznav .metismenu > li > a:hover {
    background: rgba(61, 139, 253, 0.18) !important;
    color: #fff !important;
}

body.goalfix-admin-portal .deznav .metismenu > li.mm-active > a i,
body.goalfix-admin-portal .deznav .metismenu > li > a:hover i {
    color: var(--goalfix-admin-accent) !important;
}

/* Top header bar */
body.goalfix-admin-portal .content-body .header.goalfix-admin-header,
body.goalfix-admin-portal .goalfix-admin-header {
    background: linear-gradient(90deg, #1a2332 0%, #243044 55%, #2a3a52 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}

body.goalfix-admin-portal .goalfix-admin-header .header-content,
body.goalfix-admin-portal .goalfix-admin-header .navbar,
body.goalfix-admin-portal .goalfix-admin-header .navbar-collapse {
    background: transparent !important;
}

body.goalfix-admin-portal .goalfix-admin-header .dashboard_bar {
    color: #fff !important;
    font-weight: 600;
    font-size: 1.15rem;
    letter-spacing: 0.01em;
}

body.goalfix-admin-portal .goalfix-admin-badge {
    background: rgba(61, 139, 253, 0.2) !important;
    color: #9ec5ff !important;
    border: 1px solid rgba(61, 139, 253, 0.45);
    font-weight: 600;
    font-size: 0.65rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.4em 0.7em;
    border-radius: 999px;
    vertical-align: middle;
}

/* Profile chip: glass on dark — no white card */
body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile {
    border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
    background: transparent !important;
    margin-left: 0.75rem;
    padding-left: 0.25rem;
}

body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile > .nav-link,
body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile .header-profile-toggle {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.65rem;
    padding: 0.4rem 0.75rem !important;
    color: #fff !important;
    transition: background 0.2s, border-color 0.2s;
}

body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile > .nav-link:hover,
body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile.show > .nav-link,
body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile .header-profile-toggle:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.2);
}

body.goalfix-admin-portal .goalfix-admin-header .header-info span,
body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile .header-info span {
    color: #fff !important;
    font-weight: 500;
}

body.goalfix-admin-portal .goalfix-admin-header .header-info small,
body.goalfix-admin-portal .goalfix-admin-header .header-right .header-profile .header-info small,
body.goalfix-admin-portal .goalfix-admin-header .header-info small.text-muted {
    color: rgba(255, 255, 255, 0.6) !important;
}

body.goalfix-admin-portal .goalfix-admin-header .header-profile-caret,
body.goalfix-admin-portal .goalfix-admin-header .header-profile-caret i {
    color: rgba(255, 255, 255, 0.75) !important;
}

body.goalfix-admin-portal .goalfix-admin-header .header-profile-avatar,
body.goalfix-admin-portal .header-profile-avatar {
    background: rgba(61, 139, 253, 0.35) !important;
    color: #fff !important;
    border: 1px solid rgba(61, 139, 253, 0.45);
}

/* Dropdown panel stays light for readability */
body.goalfix-admin-portal .goalfix-admin-header .header-profile .dropdown-menu {
    background: #fff !important;
    border: 1px solid rgba(26, 35, 50, 0.08) !important;
    box-shadow: 0 12px 28px rgba(26, 35, 50, 0.18) !important;
}

body.goalfix-admin-portal .goalfix-admin-header .header-profile .dropdown-menu .card-header {
    background: #f4f6f9 !important;
}

body.goalfix-admin-portal .goalfix-admin-header .header-profile .dropdown-menu .header-info span,
body.goalfix-admin-portal .goalfix-admin-header .header-profile .dropdown-menu h6 {
    color: #1a2332 !important;
}

body.goalfix-admin-portal .goalfix-admin-header .header-profile .dropdown-menu .text-muted,
body.goalfix-admin-portal .goalfix-admin-header .header-profile .dropdown-menu small {
    color: #6c757d !important;
}

/* Mobile: keep admin header dark (override modeling white fixed bar) */
@media (max-width: 767px) {
    body.goalfix-admin-portal .content-body .header.goalfix-admin-header {
        background: linear-gradient(90deg, #1a2332 0%, #243044 100%) !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    }
}

body.goalfix-admin-portal .admin-metric-card {
    border-left: 3px solid var(--goalfix-admin-accent);
}

body.goalfix-admin-portal .admin-table th,
body.goalfix-admin-portal .admin-table td,
body.goalfix-admin-portal .list-users-table th,
body.goalfix-admin-portal .list-users-table td {
    padding: 0.4rem 0.5rem !important;
    font-size: 0.8125rem;
    vertical-align: middle;
}

body.goalfix-admin-portal .list-users-table th { font-weight: 600; white-space: nowrap; }
body.goalfix-admin-portal .list-users-table th:nth-child(2),
body.goalfix-admin-portal .list-users-table td:nth-child(2),
body.goalfix-admin-portal .list-users-table th:nth-child(3),
body.goalfix-admin-portal .list-users-table td:nth-child(3) { text-align: left !important; }
body.goalfix-admin-portal .list-users-table th:nth-child(10),
body.goalfix-admin-portal .list-users-table td:nth-child(10) { text-align: center !important; }

.list-users-pagination-nav .list-users-pagination,
body.goalfix-admin-portal .list-users-pagination {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0;
    list-style: none;
    padding-left: 0;
}
.list-users-pagination .page-item {
    display: inline-flex !important;
    flex-shrink: 0;
    margin: 0 !important;
    margin-right: 0.75rem !important;
}
.list-users-pagination .page-item:last-child {
    margin-right: 0 !important;
}
.list-users-pagination .page-link {
    white-space: nowrap;
    padding: 0.45rem 0.9rem !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.5 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-width: auto;
}
.edit-user-btn { padding: 0.25rem 0.5rem; }
#editUserMessage.success { color: var(--bs-success); }
#editUserMessage.error { color: var(--bs-danger); }

/* ========================================
   Labeled sidebar panel toggle (top bar)
   Integrated next to page title — not floating on sidebar edge
   ======================================== */
#main-wrapper .header-left {
    gap: 0.85rem;
    min-width: 0;
}
#main-wrapper .header .nav-control.goalfix-sidebar-toggle {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex-shrink: 0;
    width: auto !important;
    min-width: 7.5rem;
    min-height: 2.5rem;
    height: 2.5rem !important;
    padding: 0 0.9rem;
    margin: 0;
    border: 1px solid #c7c5f0;
    border-radius: 0.5rem;
    background: #eef0ff !important;
    box-shadow: none !important;
    color: #1f19ba;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
#main-wrapper .header .nav-control.goalfix-sidebar-toggle:hover,
#main-wrapper .header .nav-control.goalfix-sidebar-toggle:focus-visible {
    background: #1f19ba !important;
    color: #fff;
    border-color: #1f19ba;
    outline: none;
}
#main-wrapper .header .nav-control.goalfix-sidebar-toggle:focus-visible {
    outline: 3px solid rgba(31, 25, 186, 0.35);
    outline-offset: 2px;
}
#main-wrapper .header .goalfix-sidebar-toggle__icon.hamburger {
    position: static !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    margin: 0;
    padding: 0;
    top: auto;
    left: auto;
    background: transparent !important;
    box-shadow: none !important;
}
#main-wrapper .header .goalfix-sidebar-toggle__icon.hamburger svg,
#main-wrapper .header .goalfix-sidebar-toggle__icon .line {
    display: none !important;
}
#main-wrapper .header .goalfix-sidebar-toggle__chevron {
    font-size: 1rem;
    line-height: 1;
    transition: transform 0.15s ease;
}
#main-wrapper.menu-toggle .header .goalfix-sidebar-toggle__chevron {
    transform: rotate(180deg);
}
#main-wrapper .header .goalfix-sidebar-toggle__label {
    display: inline-block;
}
/* Collapsed: stronger filled CTA so "Show menu" is obvious */
#main-wrapper.menu-toggle .header .nav-control.goalfix-sidebar-toggle {
    background: #1f19ba !important;
    color: #fff;
    border-color: #1f19ba;
}
#main-wrapper.menu-toggle .header .nav-control.goalfix-sidebar-toggle:hover,
#main-wrapper.menu-toggle .header .nav-control.goalfix-sidebar-toggle:focus-visible {
    background: #16128f !important;
    border-color: #16128f;
}
#main-wrapper .header-left .dashboard_bar {
    margin-left: 0;
}
/* First-visit hint under/near the top-bar button */
.goalfix-sidebar-toggle-hint {
    position: absolute;
    left: 0;
    top: calc(100% + 0.55rem);
    z-index: 1050;
    max-width: 16rem;
    padding: 0.7rem 0.9rem;
    border-radius: 0.5rem;
    background: #0f172a;
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.4;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.25);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}
.goalfix-sidebar-toggle-hint.is-visible {
    opacity: 1;
    visibility: visible;
}
.goalfix-sidebar-toggle-hint::before {
    content: "";
    position: absolute;
    left: 1.25rem;
    top: -6px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: transparent transparent #0f172a transparent;
}
#main-wrapper .header-left {
    position: relative;
}
@media (max-width: 767px) {
    #main-wrapper .header .nav-control.goalfix-sidebar-toggle {
        min-width: 2.75rem;
        width: 2.75rem !important;
        padding: 0;
        gap: 0;
    }
    #main-wrapper .header .goalfix-sidebar-toggle__label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    .goalfix-sidebar-toggle-hint {
        display: none;
    }
}
body.goalfix-admin-portal #main-wrapper .header .nav-control.goalfix-sidebar-toggle {
    background: #eef0ff !important;
    color: #1f19ba !important;
    border-color: #c7c5f0;
    box-shadow: none !important;
}
body.goalfix-admin-portal #main-wrapper.menu-toggle .header .nav-control.goalfix-sidebar-toggle {
    background: #1f19ba !important;
    color: #fff !important;
}
@media (prefers-reduced-motion: reduce) {
    #main-wrapper .header .nav-control.goalfix-sidebar-toggle,
    .goalfix-sidebar-toggle-hint {
        transition: none;
    }
}




.list-users-pagination-nav .list-users-pagination,
body.goalfix-admin-portal .list-users-pagination {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0;
    list-style: none;
    padding-left: 0;
}
.list-users-pagination .page-item {
    display: inline-flex !important;
    flex-shrink: 0;
    margin: 0 !important;
    margin-right: 0.75rem !important;
}
.list-users-pagination .page-item:last-child {
    margin-right: 0 !important;
}
.list-users-pagination .page-link {
    white-space: nowrap;
    padding: 0.45rem 0.9rem !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.5 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-width: auto;
}
.edit-user-btn { padding: 0.25rem 0.5rem; }
#editUserMessage.success { color: var(--bs-success); }
#editUserMessage.error { color: var(--bs-danger); }