/* =============================================
// 🎨 GLOBAL THEME VARIABLES (Based on main.min.css and navigation.php)
// ============================================= */
:root{
    /* RG Layout Variables */
    --rg-sidebar-width: 240px;
    --rg-accent: #007bff;     /* Primary Blue (Used for RG-specific links/buttons) */
    --rg-bg: #f7f7f7;         /* Light Grey Background (From RG sidebar CSS) */
    --rg-border-color: #e6eef8; /* Sidebar border color */
    --rg-content-padding: 28px; /* The "frame" margin around main content */
    /* 💥 UPDATED FROM NAVIGATION.PHP 💥 */
    --rg-nav-hover-bg: #f4f4f4; 
    --rg-nav-active-bg: #f4f4f4;

    /* Legacy Brand Colors (From main.min.css - Used for buttons/links/H2) */
    --legacy-link-color: #f26329;    /* Main link orange */
    --legacy-link-hover: #87ae00;    /* Hover green */
    --legacy-blue-h2: #5daae0;       /* H2 Blue */
    --legacy-button-orange: #fc7500; /* Primary Button Orange */
    --legacy-text-color: #293a4a;    /* Body text/H1 black/blue */
    --legacy-body-bg: #ececec;       /* Original body background */
}

/* =============================================
// ✏️ TYPOGRAPHY & BASE STYLES (From main.min.css)
// ============================================= */

/* Custom Fonts - MUST be linked in your B2B assets folder */
@font-face {
    font-family: 'aller';
    src: url('../font/aller/Aller.eot');
    src: url('../font/aller/Aller.eot?#iefix') format('embedded-opentype'),
          url('../font/aller/Aller.woff') format('woff'),
          url('../font/aller/Aller.ttf') format('truetype'),
          url('../font/aller/Aller.svg#Aller') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'aller-light';
    src: url('../font/aller-light/aller_lt-webfont.eot');
    src: url('../font/aller-light/aller_lt-webfont.eot?#iefix') format('embedded-opentype'),
          url('../font/aller-light/aller_lt-webfont.woff') format('woff'),
          url('../font/aller-light/aller_lt-webfont.ttf') format('truetype'),
          url('../font/aller-light/aller_lt-webfont.svg#aller_lt-webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {
    font-family: aller, Century Gothic, Verdana, Arial, helvetica, Calibri; 
    color: var(--legacy-text-color); 
    font-size: 13px; 
    line-height: 16px; 
    font-weight: normal; 
    background-color: var(--legacy-body-bg); /* Original background */
    height: 100%; 
    width: 100%; 
    margin: 0; 
    padding: 0;
}

/* Global Links */
a, a:visited {
    text-decoration: none; 
    color: var(--legacy-link-color); 
    font-size: 13px; 
    font-family: aller, Century Gothic, Verdana, Arial, helvetica, Calibri; 
    outline: none;
}
a:hover, a:visited:hover {
    text-decoration: none; 
    color: var(--legacy-link-hover); /* Hover green */
    outline: none;
}

/* Headings */
h1 {
    color: #000; 
    font-size: 28px; 
    font-family: aller, Century Gothic, Verdana, Arial, helvetica, Calibri; 
    margin: 0; 
    padding: 0 0 10px 0;
}
h2 {
    color: var(--legacy-blue-h2); 
    font-size: 22px; 
    font-family: aller, Century Gothic, Verdana, Arial, helvetica, Calibri; 
    margin: 0; 
    padding: 0 0 10px 0;
}
/* Font Modifiers */
.bold {font-weight: bold;}
.italic {font-style: italic;}
.white {color: white;}

/* =============================================
// 📐 UTILITY & SPACING (From main.min.css)
// ============================================= */
.clear {clear: both;}
.contentpad {padding: 0 158px;}
.contentpad2 {padding: 0 138px 0 158px;}
.contentpadtop {padding: 12px 158px;}
.menupad {padding: 0 158px;}
.textpad {padding: 40px;}
.textpad2 {padding: 10px;}
.butpad {padding-right: 20px;  padding-bottom: 20px;}
.butpad2 {padding: 18px 15px 18px 15px; height: 97px;}

/* Backgrounds & Borders */
.whitebg {background-color: #fff; max-height: auto; overflow: hidden;}
.greyborder {border: 1px solid #e1e1e1; max-height: auto; overflow: hidden;}
.orangebg {background-color: #fc7500; max-height: auto; overflow: hidden; height: 5px;}
.greybg {background-color: #efeff1; max-height: auto; overflow: hidden;}
.greenbg {background-color: #87ae00; max-height: auto; overflow: hidden;}
.bluebg {background-color: #5daae0; max-height: auto; overflow: hidden;}

/* Button Font (Used by the old system buttons) */
.butfont, .butfont:visited{color: white; font-size: 24px; line-height: 28px; outline: none; text-decoration: none;}
.butfont:hover, .butfont:visited:hover {color: var(--legacy-text-color);}

/* Primary Button (Standard Bootstrap replacement) */
.btn-primary {
    color: #fff;
    background-color: var(--legacy-button-orange); /* #fc7500 */
    border: none;
    font-size: 13px;
    padding: 9px;
    border-radius: 0px; /* Overrides Bootstrap default */
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
    color: #fff;
    background-color: var(--legacy-link-hover); /* #87ae00 (Green hover) */
    border: none;
}

/* Responsive Padding Overrides (Crucial for fluid layout) */
@media (max-width: 1520px) {
    .contentpad, .contentpadtop, .menupad {padding-right: 140px; padding-left: 140px;}
    .contentpad2 {padding: 0 130px 0 140px;}
    .butfont {font-size: 22px; line-height: 26px;}
    h1 {font-size: 25px;}
}
@media (max-width: 1200px) {
    .contentpad, .contentpadtop, .menupad {padding-right: 130px; padding-left: 130px;}
    .contentpad2 {padding: 0 120px 0 130px;}
    .butfont {font-size: 19px; line-height: 21px;}
    h1 {font-size: 23px;}
    .textpad {padding: 25px;}
}
@media (max-width: 992px) {
    .contentpad, .contentpadtop, .menupad {padding-right: 90px; padding-left: 90px;}
    .contentpad2 {padding: 0 80px 0 90px;}
    .butfont {font-size: 16px; line-height: 20px;}
    h1 {font-size: 19px;}
    h2 {font-size: 16px;}
    .textpad {padding: 20px;}
}
@media (max-width: 768px) {
    .contentpad, .contentpadtop, .menupad {padding-right: 40px; padding-left: 40px;}
    .contentpad2 {padding: 0 30px 0 40px;}
    .textpad {padding: 20px;}
}

/* =============================================
// 🖥️ RG SIDEBAR & LAYOUT (Specific Overrides)
// ============================================= */

/* Base body background is overridden to RG's lighter grey */
body {
    background: var(--rg-bg); /* #f7f7f7 */
}

/* The fixed sidebar layout (from navigation.php inline style) */
.rg-sidebar, .rg-sidebar * { box-sizing: border-box; }
.rg-sidebar { 
    position: fixed; left: 0; top: 0; bottom: 0; width: var(--rg-sidebar-width);
    background: #fff; border-right: 1px solid var(--rg-border-color); padding: 18px 12px;
    z-index: 10000; overflow-y: auto; 
}
.rg-sidebar-inner { display:flex; flex-direction:column; height:100%; }
.rg-sidebar-logo { max-width:180px; display:block; margin:6px auto 12px; }

/* Menu */
.rg-sidebar-nav ul { list-style:none; padding:0; margin:0; }
.rg-sidebar-nav li { margin:6px 0; }
.rg-sidebar-nav a { display:block; padding:10px 12px; color:#333; text-decoration:none; border-radius:6px; font-weight:500; }
.rg-sidebar-nav a:hover { background:var(--rg-nav-hover-bg); color:var(--rg-accent); }
.rg-active > a { background:var(--rg-nav-active-bg); color:var(--rg-accent); font-weight:700; }

/* Admin menu */
.rg-has-children > .rg-parent { cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
.rg-submenu { list-style:none; margin:6px 0 0 6px; padding:6px 0 6px 6px; display:none; }
.rg-has-children.rg-open > .rg-submenu { display:block; }
.admin-sub a { padding-left:28px !important; font-size:14px; opacity:0.9; }
.admin-sub a:hover { padding-left:30px !important; }
.owner-item a { font-weight: bold !important; }

/* Footer */
.rg-sidebar-footer { margin-top:auto; padding-top:14px; font-size:0.9rem; color:#666; text-align:center; }
.rg-sidebar-footer .copytext { margin-top:5px; font-size:0.8rem; color:#999; }
/* Ensure RG Footer links adopt the RG blue/font size */
.rg-sidebar-footer a { color: var(--rg-accent); font-size:0.85rem; text-decoration: none; display: block; }
.rg-sidebar-footer div:nth-last-child(2) a { font-size:0.95rem; }


/* Main Content Shift and Frame */
.rg-main-content { 
    margin-left: var(--rg-sidebar-width); 
    padding: var(--rg-content-padding); /* 28px padding creates the frame */
}

/* =============================================
// ⭐ INDEX PAGE COMPONENTS (Specific Styles)
// ============================================= */

/* Download Button Styling (Uses RG accent color) */
.pdf-download-btn, .template-download-btn {
    display:inline-block;
    margin:10px 10px 10px 0;
    padding:10px 18px;
    background-color: var(--rg-accent); /* #007bff */
    color:#fff;
    text-decoration:none;
    border-radius:4px;
    font-weight:500;
    cursor:pointer;
    transition: all 0.25s ease-in-out;
    box-shadow:0 2px 4px rgba(0,0,0,0.15);
    -webkit-text-fill-color:#fff;
    -webkit-user-select:none;
}
.pdf-download-btn:hover, .template-download-btn:hover {
    -webkit-text-fill-color:#fff;
    background-color:#0056b3 !important; /* Darker blue on hover */
    color:#ffffff !important;
    transform:translateY(-2px);
    box-shadow:0 4px 8px rgba(0,0,0,0.25);
}

.button-group {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:15px;
    margin-top:15px;
}

/* Info Banner */
.msg-info {
    background:#dbeafe; /* Light blue background */
    padding:12px 16px;
    border-radius:6px;
    color:#1e3a8a; /* Dark blue text */
    margin:20px 0;
    font-size:13px;
    line-height:1.5;
    box-shadow:0 2px 5px rgba(0,0,0,0.05);
}
.msg-info a {
    color:#1e3a8a;
    font-weight:bold;
    text-decoration:none;
}

/* =============================================
// 📱 MOBILE LAYOUT
// ============================================= */

.rg-topbar-mobile { display:none; position:fixed; top:0; left:0; right:0; height:56px; background:#fff;
    border-bottom:1px solid #eee; z-index:10001; }
.rg-topbar-mobile-inner { display:flex; align-items:center; padding:8px 12px; }
#rgToggleSidebar { border:0; background:transparent; font-size:22px; cursor:pointer; }
.rg-mobile-logo { max-height:36px; }

@media (max-width: 900px) {
    .rg-sidebar { transform: translateX(-110%); transition: transform .22s ease; }
    .rg-sidebar.rg-visible { transform: translateX(0); }
    .rg-topbar-mobile { display:block; }
    .rg-main-content { margin-left: 0; padding-top:70px; }
} 

/* =================================================================
// ⚠️ CRITICAL INLINE STYLES OVERRIDES (Moved from navigation.php)
// These styles override the default .rg-sidebar-nav rules above.
// ================================================================= */

/* 1. Global Link Reset for Sidebar */
.rg-sidebar a {
    text-decoration: none !important;
    color: inherit; 
}
.rg-sidebar a:hover {
    /* 💥 ADDED: Ensure no underline on hover 💥 */
    text-decoration: none !important; 
}

/* 2. Anchor Color Fix (Text color) */
.rg-sidebar-nav a,
.rg-sidebar-nav a:hover,
.rg-active a,
.rg-sidebar-nav .rg-has-children.rg-open .rg-parent {
    color: var(--rg-accent) !important; /* #007bff */
    /* 💥 ADDED: Ensure no underline on hover/active links 💥 */
    text-decoration: none !important;
}

/* 3. Background Overrides & HOVER FONT WEIGHT FIX */
/* 🆕 Hover Background FIX: Apply background to the <li> element */
.rg-sidebar-nav li:hover {
    background-color: var(--rg-nav-hover-bg) !important; /* #f4f4f4 */
    /* Important: Remove any border/shadow on the LI container */
    border: none !important; 
}

/* 🆕 Hover Link Fix: Apply background to the <a> element AND MAKE TEXT BOLD */
.rg-sidebar-nav li:hover > a {
    background-color: var(--rg-nav-hover-bg) !important; /* #f4f4f4 */
    border-radius: 6px !important; 
    background: var(--rg-nav-hover-bg) !important; /* #f4f4f4 */
    
    /* ⭐⭐⭐ NEW RULE: Make the text bold on hover ⭐⭐⭐ */
    font-weight: bold !important;
    /* 💥 ADDED: Ensure no underline on hover 💥 */
    text-decoration: none !important; 
}

/* 🆕 Active/Selected Background FIX: Apply background to the active list item */
.rg-sidebar-nav li.rg-active {
    background-color: var(--rg-nav-active-bg) !important; /* #f4f4f4 */
}

/* 🆕 Active Link Element Fix: Ensure the <a> tag inside the active <li> adopts the full color */
.rg-sidebar-nav li.rg-active > a {
    background-color: var(--rg-nav-active-bg) !important; /* #f4f4f4 */
    border: none !important;
    box-shadow: none !important;
    background: var(--rg-nav-active-bg) !important; /* #f4f4f4 */
    
    /* Active links should also be bold if hover is bold */
    font-weight: bold !important;
    /* 💥 ADDED: Ensure no underline on active 💥 */
    text-decoration: none !important; 
}


/* 4. Footer Link Styling (Existing) */
.rg-sidebar-footer a:hover {
    text-decoration: none !important;
}
.rg-sidebar-footer .rg-policy-link {
    /* 💥 ADJUSTED: Increased font size from 12px to 13px (base size) 💥 */
    font-size: 11px !important;
    color: #007bff !important;
    display: block;
    padding: 3px 0;
    line-height: 1.2;
}
.rg-sidebar-footer .rg-email-link {
    /* 💥 ADJUSTED: Increased font size from 13px to 14px 💥 */
    font-size: 11px !important; 
    color: #007bff !important;
}
.rg-sidebar-footer .rg-copyright {
    /* 💥 ADJUSTED: Increased font size from 11px to 12px 💥 */
    font-size: 11px !important;
    color: #888;
}

/* =============================================
// 🧹 LEGACY B2B UTILITY CLASSES (From b2b.css)
// Retained for any legacy content elements.
// ============================================= */

/* Legacy Content Wrapper (Similar to rg-card but kept as a utility) */
.whitebox {
    background: #fff;
    padding: 25px;
    border-radius: 6px;
    border: 1px solid #ddd;
}