@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Segoe+UI&display=swap');
/* ===================================================
   ☢️ DC-BOT MASTER - GLOBAL NUCLEAR CORE (V4 DANIEL EDITION)
   =================================================== */

:root {
    --primary: #10b981;
    --primary-hover: #059669;
    --primary-dark: #059669;
    --primary-light: #d1fae5;
    --dark-navy: #011627;
    --dark: #0f172a;
    --gray: #64748b;
    --light: #f8fafc;
    --white: #ffffff;
    --text-white: #ffffff;
    --sidebar-width: 270px;
    --border: #e2e8f0;
    --text-dark: #1e293b;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Outfit', sans-serif; background: #f8fafc; color: #1e293b; padding-bottom: 80px; }

/* SIDEBAR SNIPER 🎨 */
.sidebar {
    position: fixed; top: 0; left: 0; width: var(--sidebar-width);
    height: 100vh; background: #ffffff;
    border-right: 2px solid var(--border); z-index: 1100;
    padding: 2.5rem 1.5rem; overflow-y: auto;
}

.main-stage, .main-content {
    margin-top: 190px; margin-left: auto; margin-right: auto; padding: 30px;
    width: 100%; max-width: 1400px;
}

/* NAV ITEMS 🔗 */
.logo { font-size: 1.8rem; font-weight: 950; color: #000; margin-bottom: 3rem; display: flex; align-items: center; gap: 12px; }
.logo i { color: var(--primary); }

.nav-item {
    display: flex; align-items: center; gap: 14px; padding: 15px 20px; border-radius: 16px;
    color: #64748b; font-weight: 700; text-decoration: none; transition: 0.2s; margin-bottom: 8px;
}
.nav-item i { font-size: 1.35rem; }
.nav-item:hover { background: #f1f5f9; color: var(--primary); transform: translateX(5px); }
.nav-item.active { background: #f0fdf4; color: var(--primary); border: 1px solid rgba(16,185,129,0.1); }

.menu-category { font-size: 0.65rem; font-weight: 800; color: #cbd5e1; text-transform: uppercase; letter-spacing: 1.5px; padding: 25px 20px 10px; }

/* RODAPÉ TÁTICO (COMMAND CENTER) 🎮 */
.status-footer { 
    position: fixed; bottom: 0; left: var(--sidebar-width); width: calc(100% - var(--sidebar-width)); 
    background: var(--dark-navy); color: white; padding: 12px 30px; 
    display: flex; align-items: center; justify-content: space-between; 
    z-index: 1200; border-top: 3px solid #25D366; 
}

/* RADAR IA 🔘 */
.header-control-btn {
    width: 35px; height: 35px; border-radius: 10px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
    display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.7); cursor: pointer; transition: 0.2s;
}
.header-control-btn.active { background: var(--primary); color: white; border-color: var(--primary); box-shadow: 0 4px 10px rgba(16, 185, 129, 0.3); }

/* MOBILE 📱 */
@media (max-width: 991px) {
    .sidebar { left: -100%; z-index: 2000; transition: 0.3s; }
    .sidebar.active { left: 0 !important; }
    .top-navbar, .topbar-elite { padding-left: 15px !important; }
    .main-stage, .main-content { margin-left: 0 !important; width: 100% !important; padding: 15px !important; padding-top: 20px !important; }
    .status-footer { left: 0; width: 100%; }
}

/* --- NEW MEGA MENU CSS --- */

        :root {
            --primary: #10b981;
            --primary-dark: #059669;
            --primary-light: #d1fae5;
            --dark: #0f172a;
            --gray: #64748b;
            --light: #f8fafc;
            --white: #ffffff;
            --border: #e2e8f0;
        }

        * {
            box-sizing: border-box;
        }

        

        /* BARRA DE INSPIRAÇÃO NO TOPO (MARQUEE) */
        .top-inspiration-bar {
            position: fixed; top: 0; left: 0; right: 0; height: 30px;
            background: #f0fdf4; color: #065f46;
            display: flex; align-items: center;
            font-size: 11px; font-weight: 600;
            z-index: 3001; border-bottom: 1px solid #a7f3d0;
            overflow: hidden; white-space: nowrap;
        }
        
        .inspiration-static {
            background: #dcfce7; padding: 0 15px; height: 100%; display: flex; align-items: center;
            color: #059669; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; z-index: 2; border-right: 1px solid #a7f3d0;
        }

        .marquee-container { flex-grow: 1; overflow: hidden; position: relative; height: 100%; display: flex; align-items: center; }
        
        .marquee-content {
            display: inline-block; white-space: nowrap; font-style: italic;
            animation: marquee 45s linear infinite; padding-left: 100%;
        }

        @keyframes marquee {
            0% { transform: translateX(0); }
            100% { transform: translateX(-100%); }
        }

        /* HEADER SUPERIOR (Mesmo do menu_loader.js, mas rebaixado) */
        .header-master-elite {
            position: fixed; top: 30px; left: 0; right: 0; height: 80px; 
            background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); 
            border-bottom: 2px solid var(--border); display: flex; 
            align-items: center; justify-content: space-between; padding: 0 30px; 
            z-index: 3000; flex-wrap: nowrap;
        }
        
        .logo-area { display: flex; align-items: center; gap: 10px; width: 220px; flex-shrink: 0; }
        .logo-area img { width: 38px; }
        .logo-text { font-weight: 900; font-size: 18px; line-height: 1; color: var(--dark); font-family: 'Outfit'; }
        .logo-sub { font-size: 8px; font-weight: 800; color: var(--gray); letter-spacing: 1px; }

        .tactical-group { display: flex; gap: 15px; flex-grow: 1; justify-content: center; flex-shrink: 0; align-items: center; }
        
        /* CHAVES DE ATIVAÇÃO (TOGGLES ELEGANTES) */
        .tactical-switch {
            display: flex; align-items: center; gap: 10px;
            padding: 6px 14px; border-radius: 30px;
            background: white; border: 1px solid #e2e8f0;
            cursor: pointer; transition: all 0.3s ease;
        }
        .tactical-switch:hover { border-color: #cbd5e1; box-shadow: 0 4px 12px rgba(0,0,0,0.03); }
        
        .ts-label {
            display: flex; align-items: center; gap: 6px;
            font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;
        }
        .ts-label i { font-size: 16px; }
        
        .ts-toggle {
            width: 32px; height: 18px; border-radius: 10px;
            background: #cbd5e1; position: relative; transition: all 0.3s ease;
        }
        .ts-toggle .ts-knob {
            width: 14px; height: 14px; background: white; border-radius: 50%;
            position: absolute; top: 2px; left: 2px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 1px 3px rgba(0,0,0,0.2);
        }
        
        /* Estado Ativo (Ligado) */
        .tactical-switch.active { border-color: #10b981; background: #f0fdf4; }
        .tactical-switch.active .ts-label { color: #10b981; }
        .tactical-switch.active .ts-label i { color: #10b981; }
        .tactical-switch.active .ts-toggle { background: #10b981; box-shadow: inset 0 0 5px rgba(0,0,0,0.1); }
        .tactical-switch.active .ts-knob { transform: translateX(14px); box-shadow: -1px 1px 3px rgba(0,0,0,0.2); }
        
        /* STATUS DO WHATSAPP (Online/Offline) */
        .whats-status {
            display: flex; align-items: center; gap: 6px; padding: 6px 14px;
            border-radius: 30px; font-weight: 800; font-size: 11px; letter-spacing: 0.5px; text-transform: uppercase;
            border: 1px solid #e2e8f0; background: white; margin-right: 15px; cursor: pointer; transition: 0.3s;
        }
        .whats-status.online { color: #10b981; border-color: #bbf7d0; background: #f0fdf4; }
        .whats-status.online i { color: #10b981; font-size: 18px; animation: pulse-green 2s infinite; }
        
        .whats-status.offline { color: #ef4444; border-color: #fecaca; background: #fef2f2; }
        .whats-status.offline i { color: #ef4444; font-size: 18px; animation: pulse-red 2s infinite; }
        
        .whats-status small { font-size: 9px; font-weight: 600; opacity: 0.7; margin-left: 4px; text-transform: capitalize; }

        @keyframes pulse-green { 0% { filter: drop-shadow(0 0 0 rgba(16, 185, 129, 0.8)); } 70% { filter: drop-shadow(0 0 8px rgba(16, 185, 129, 0)); } 100% { filter: drop-shadow(0 0 0 rgba(16, 185, 129, 0)); } }
        @keyframes pulse-red { 0% { filter: drop-shadow(0 0 0 rgba(239, 68, 68, 0.8)); } 70% { filter: drop-shadow(0 0 8px rgba(239, 68, 68, 0)); } 100% { filter: drop-shadow(0 0 0 rgba(239, 68, 68, 0)); } }
        
        .user-area { display: flex; align-items: center; gap: 12px; margin-left: 10px; cursor: pointer; flex-shrink: 0; }
        .user-info { text-align: right; }
        .user-name { font-weight: 900; color: var(--primary); font-size: 12px; font-family: 'Outfit'; }
        .user-role { font-size: 8px; font-weight: 800; color: #3b82f6; letter-spacing: 1px; }
        .user-avatar { width: 42px; height: 42px; border-radius: 50%; border: 2px solid var(--primary); object-fit: cover; }
        
        .btn-logout {
            display: flex; align-items: center; justify-content: center;
            width: 36px; height: 36px; border-radius: 50%; background: #fee2e2;
            color: #ef4444; cursor: pointer; transition: 0.3s; margin-left: 5px;
            font-size: 1.2rem;
        }
        .btn-logout:hover { background: #ef4444; color: white; transform: scale(1.1); box-shadow: 0 4px 10px rgba(239, 68, 68, 0.3); }

        



/* ==================== HEADER E MENU V12 ==================== */
/* BARRA DE INSPIRAÇÃO NO TOPO (MARQUEE) */
        .top-inspiration-bar {
            position: fixed; top: 0; left: 0; right: 0; height: 30px;
            background: #f0fdf4; color: #065f46;
            display: flex; align-items: center;
            font-size: 11px; font-weight: 600;
            z-index: 3001; border-bottom: 1px solid #a7f3d0;
            overflow: hidden; white-space: nowrap;
        }
        
        .inspiration-static {
            background: #dcfce7; padding: 0 15px; height: 100%; display: flex; align-items: center;
            color: #059669; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; z-index: 2; border-right: 1px solid #a7f3d0;
        }

        .marquee-container { flex-grow: 1; overflow: hidden; position: relative; height: 100%; display: flex; align-items: center; }
        
        .marquee-content {
            display: inline-block; white-space: nowrap; font-style: italic;
            animation: marquee 45s linear infinite; padding-left: 100%;
        }

        @keyframes marquee {
            0% { transform: translateX(0); }
            100% { transform: translateX(-100%); }
        }

        /* HEADER SUPERIOR (Mesmo do menu_loader.js, mas rebaixado) */
        .header-master-elite {
            position: fixed; top: 30px; left: 0; right: 0; height: 80px; 
            background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); 
            border-bottom: 2px solid var(--border); display: flex; 
            align-items: center; justify-content: space-between; padding: 0 30px; 
            z-index: 3000; flex-wrap: nowrap;
        }
        
        .logo-area { display: flex; align-items: center; gap: 10px; width: 220px; flex-shrink: 0; }
        .logo-area img { width: 38px; }
        .logo-text { font-weight: 900; font-size: 18px; line-height: 1; color: var(--dark); font-family: 'Outfit'; }
        .logo-sub { font-size: 8px; font-weight: 800; color: var(--gray); letter-spacing: 1px; }

        .tactical-group { display: flex; gap: 15px; flex-grow: 1; justify-content: center; flex-shrink: 0; align-items: center; }
        
        /* CHAVES DE ATIVAÇÃO (TOGGLES ELEGANTES) */
        .tactical-switch {
            display: flex; align-items: center; gap: 10px;
            padding: 6px 14px; border-radius: 30px;
            background: white; border: 1px solid #e2e8f0;
            cursor: pointer; transition: all 0.3s ease;
        }
        .tactical-switch:hover { border-color: #cbd5e1; box-shadow: 0 4px 12px rgba(0,0,0,0.03); }
        
        .ts-label {
            display: flex; align-items: center; gap: 6px;
            font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;
        }
        .ts-label i { font-size: 16px; }
        
        .ts-toggle {
            width: 32px; height: 18px; border-radius: 10px;
            background: #cbd5e1; position: relative; transition: all 0.3s ease;
        }
        .ts-toggle .ts-knob {
            width: 14px; height: 14px; background: white; border-radius: 50%;
            position: absolute; top: 2px; left: 2px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 1px 3px rgba(0,0,0,0.2);
        }
        
        /* Estado Ativo (Ligado) */
        .tactical-switch.active { border-color: #10b981; background: #f0fdf4; }
        .tactical-switch.active .ts-label { color: #10b981; }
        .tactical-switch.active .ts-label i { color: #10b981; }
        .tactical-switch.active .ts-toggle { background: #10b981; box-shadow: inset 0 0 5px rgba(0,0,0,0.1); }
        .tactical-switch.active .ts-knob { transform: translateX(14px); box-shadow: -1px 1px 3px rgba(0,0,0,0.2); }
        
        /* STATUS DO WHATSAPP (Online/Offline) */
        .whats-status {
            display: flex; align-items: center; gap: 6px; padding: 6px 14px;
            border-radius: 30px; font-weight: 800; font-size: 11px; letter-spacing: 0.5px; text-transform: uppercase;
            border: 1px solid #e2e8f0; background: white; margin-right: 15px; cursor: pointer; transition: 0.3s;
        }
        .whats-status.online { color: #10b981; border-color: #bbf7d0; background: #f0fdf4; }
        .whats-status.online i { color: #10b981; font-size: 18px; animation: pulse-green 2s infinite; }
        
        .whats-status.offline { color: #ef4444; border-color: #fecaca; background: #fef2f2; }
        .whats-status.offline i { color: #ef4444; font-size: 18px; animation: pulse-red 2s infinite; }
        
        .whats-status small { font-size: 9px; font-weight: 600; opacity: 0.7; margin-left: 4px; text-transform: capitalize; }

        @keyframes pulse-green { 0% { filter: drop-shadow(0 0 0 rgba(16, 185, 129, 0.8)); } 70% { filter: drop-shadow(0 0 8px rgba(16, 185, 129, 0)); } 100% { filter: drop-shadow(0 0 0 rgba(16, 185, 129, 0)); } }
        @keyframes pulse-red { 0% { filter: drop-shadow(0 0 0 rgba(239, 68, 68, 0.8)); } 70% { filter: drop-shadow(0 0 8px rgba(239, 68, 68, 0)); } 100% { filter: drop-shadow(0 0 0 rgba(239, 68, 68, 0)); } }
        
        .user-area { display: flex; align-items: center; gap: 12px; margin-left: 10px; cursor: pointer; flex-shrink: 0; }
        .user-info { text-align: right; }
        .user-name { font-weight: 900; color: var(--primary); font-size: 12px; font-family: 'Outfit'; }
        .user-role { font-size: 8px; font-weight: 800; color: #3b82f6; letter-spacing: 1px; }
        .user-avatar { width: 42px; height: 42px; border-radius: 50%; border: 2px solid var(--primary); object-fit: cover; }
        
        .btn-logout {
            display: flex; align-items: center; justify-content: center;
            width: 36px; height: 36px; border-radius: 50%; background: #fee2e2;
            color: #ef4444; cursor: pointer; transition: 0.3s; margin-left: 5px;
            font-size: 1.2rem;
        }
        .btn-logout:hover { background: #ef4444; color: white; transform: scale(1.1); box-shadow: 0 4px 10px rgba(239, 68, 68, 0.3); }

        /* NOVA BARRA DE NAVEGAÇÃO HORIZONTAL (O MEGA MENU) */
        .nav-horizontal {
            position: fixed; top: 110px; left: 0; right: 0; height: 55px;
            background: var(--white); border-bottom: 1px solid var(--border);
            display: flex; align-items: center; justify-content: center; z-index: 2900;
            box-shadow: 0 4px 15px rgba(0,0,0,0.02); gap: 10px;
        }

        .nav-horizontal .nav-item { margin-bottom: 0; border-radius: 0;
            position: relative; height: 100%; display: flex; align-items: center;
            padding: 0 15px; cursor: pointer; color: var(--gray); font-weight: 600;
            font-size: 13px; transition: 0.2s; gap: 6px; font-family: 'Outfit';
        }
        
        .nav-horizontal .nav-item:hover, .nav-horizontal .nav-item.active {
            color: var(--primary-dark); background: var(--light);
        }
        
        .nav-horizontal .nav-item i.main-icon { font-size: 1.1rem; color: var(--primary); }
        .nav-horizontal .nav-item i.bx-chevron-down { font-size: 1rem; opacity: 0.5; margin-left: -2px; }

        /* DROPDOWN - O MEGA MENU */
        .mega-menu {
            position: absolute; top: 55px; left: 50%; transform: translateX(-50%) translateY(10px);
            background: var(--white); border-radius: 16px; border: 1px solid var(--border);
            box-shadow: 0 10px 40px rgba(0,0,0,0.08); padding: 20px; width: 280px;
            opacity: 0; visibility: hidden; transition: all 0.2s ease; z-index: 3000;
            display: flex; flex-direction: column; gap: 5px;
        }

        /* Exceções de tamanho para menus maiores */
        .nav-horizontal .nav-item:nth-child(4) .mega-menu { width: 320px; } /* Marketing */

        .nav-horizontal .nav-item:hover .mega-menu {
            opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
        }

        /* Triangulozinho no topo do menu */
        .mega-menu::before {
            content: ''; position: absolute; top: -6px; left: 50%; transform: translateX(-50%) rotate(45deg);
            width: 12px; height: 12px; background: var(--white); border-left: 1px solid var(--border);
            border-top: 1px solid var(--border);
        }

        .mega-item {
            display: flex; align-items: center; gap: 12px; padding: 10px 12px;
            text-decoration: none; color: #475569; font-weight: 600; font-size: 13px;
            border-radius: 10px; transition: 0.2s; position: relative; z-index: 2;
        }
        
        .mega-item i {
            display: flex; align-items: center; justify-content: center;
            width: 30px; height: 30px; border-radius: 8px; font-size: 1.2rem;
            background: var(--light); color: var(--primary); transition: 0.2s;
        }

        .mega-item:hover { background: #f0fdf4; color: var(--primary-dark); }
        .mega-item:hover i { background: var(--primary); color: white; }

        /* Label descritivo no dropdown */
        .mega-label { font-size: 10px; color: #94a3b8; font-weight: 800; text-transform: uppercase; margin-bottom: 5px; margin-left: 5px; letter-spacing: 0.5px; }
        .mega-divider { height: 1px; background: var(--border); margin: 10px 0; }

        /* AREA DE CONTEUDO */
        .content-area {
            margin-top: 190px; padding: 40px; max-width: 1200px; margin-left: auto; margin-right: auto;
        }
        
        .mock-dashboard {
            background: white; border-radius: 20px; border: 1px solid var(--border);
            height: 600px; padding: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center;
            text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.03);
        }
        
        .mock-dashboard h1 { font-family: 'Outfit'; color: var(--dark); font-size: 2.5rem; margin-bottom: 10px; }
        .mock-dashboard p { color: var(--gray); font-size: 1.1rem; max-width: 600px; }

        /* CABEÇALHO DA PÁGINA (Título e Botões) */
        .page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }
        .page-title { font-family: 'Outfit'; color: var(--dark); font-size: 2.2rem; margin: 0; font-weight: 800; }

        /* ======== RESPONSIVIDADE MOBILE ======== */
        .mobile-menu-btn { display: none; font-size: 28px; color: var(--primary); cursor: pointer; margin-right: 10px; }
        .mobile-menu-header { display: none; } /* Ocultar chaves do mobile no desktop */
        .mobile-sidebar { display: none; } /* Ocultar sidebar no desktop */
        .mobile-overlay { display: none; } /* Ocultar overlay no desktop */
        
        @media (max-width: 991px) {
            /* Responsividade do Cabeçalho da Página */
            .page-header { flex-direction: column; align-items: flex-start; gap: 15px; margin-bottom: 20px; }
            .page-title { font-size: 1.8rem; }
            
            /* Layout flex seguro p/ celular. Logo centralizada absoluto para evitar quebrar laterais */
            .header-master-elite { display: flex; justify-content: space-between; align-items: center; padding: 0 15px; }
            .mobile-menu-btn { display: flex; font-size: 28px; margin: 0; }
            
            .logo-area { margin: 0; width: auto; }
            .logo-area img { width: 34px; }
            
            .user-area { display: flex; margin: 0; gap: 8px; }
            .user-avatar { width: 34px; height: 34px; border-width: 2px; }
            .user-name { font-size: 10px; }
            .user-role { font-size: 7px; }
            .btn-logout { display: none; } /* Ocultar botão sair do topo p/ não poluir, pode ir pro menu */
            
            /* Ocultar textos e chaves que poluem o Header no celular */
            .logo-text, .logo-sub, .inspiration-static { display: none; }
            .header-master-elite .tactical-group { display: none; } /* Esconde as chaves do header superior */
            
            /* Esconder a barra horizontal do Desktop totalmente no mobile */
            .nav-horizontal { display: none !important; }
            
            /* Nova Barra Lateral Mobile Dedicada (100% livre de bugs do desktop) */
            .mobile-sidebar {
                position: fixed; top: 0; left: -100%; width: 85%; max-width: 320px; height: 100vh;
                background: white; flex-direction: column; justify-content: flex-start;
                align-items: stretch; padding-top: 20px; padding-bottom: 50px; 
                transition: left 0.3s ease; gap: 0; display: flex;
                overflow-y: auto; z-index: 4000; box-shadow: 10px 0 30px rgba(0,0,0,0.15);
            }
            .mobile-sidebar.open { left: 0; }
            
            /* Overlay escuro quando o menu abre */
            .mobile-overlay {
                display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
                background: rgba(0,0,0,0.5); z-index: 3900; opacity: 0; transition: 0.3s;
            }
            .mobile-overlay.active { display: none !important; opacity: 0; }
            
            /* Header interno do menu mobile para as chaves */
            .mobile-menu-header {
                display: flex; flex-direction: column; gap: 15px; padding: 10px 20px 20px 20px;
                border-bottom: 1px solid #f1f5f9; margin-bottom: 10px;
            }
            .mobile-menu-header .tactical-group {
                display: flex; flex-direction: column; gap: 10px; align-items: stretch; display: flex !important;
            }
            .mobile-menu-header .whats-status { margin: 0; justify-content: center; }
            .mobile-menu-header .tactical-switch {
                justify-content: space-between; padding: 12px 15px; background: #f8fafc; border: 1px solid #e2e8f0;
            }
            
            .nav-horizontal .nav-item { margin-bottom: 0; border-radius: 0;
                width: 100%; padding: 15px 20px; border-bottom: 1px solid var(--border);
                flex-wrap: wrap; justify-content: space-between; height: auto; box-sizing: border-box;
            }
            
            /* Mega menu vira um sanfona interno no celular via clique (JS) */
            .mega-menu { display: none; }
            .mega-menu::before { display: none; }
            .nav-horizontal .nav-item.open-mobile .mega-menu { 
                display: flex; position: relative; top: 0; left: 0; transform: none; 
                width: 100% !important; box-shadow: none; border: none; padding: 10px 0 0 0; opacity: 1; visibility: visible;
            }
            /* Garantir que hover nativo não cause bug no mobile */
            .nav-horizontal .nav-item:hover .mega-menu { display: none; }
            .nav-horizontal .nav-item.open-mobile:hover .mega-menu { display: flex; }
            
            .content-area { margin-top: 130px; padding: 15px; }
            .top-inspiration-bar { font-size: 9px; }
        }

        

/* Fix for main content area to avoid sliding under the new big header */
.main-stage, .main-content, .main-wrapper, .main-container { margin: 165px auto 0 auto !important; padding: 20px; max-width: 1400px; }
@media (max-width: 991px) { .main-stage, .main-content, .main-wrapper, .main-container { margin: 100px auto 0 auto !important; } }

/* =========================================================
   DC-BOT PORTAL UI 2026
   Camada final de padronizacao baseada no menu_preview.html.
   ========================================================= */
:root {
    --dc-primary: #10b981;
    --dc-primary-strong: #059669;
    --dc-primary-soft: #ecfdf5;
    --dc-ink: #0f172a;
    --dc-muted: #64748b;
    --dc-border: #e2e8f0;
    --dc-surface: #ffffff;
    --dc-canvas: #f4f7fb;
    --dc-radius: 18px;
    --dc-shadow: 0 10px 30px rgba(15, 23, 42, .055);
}

html, body {
    background: var(--dc-canvas) !important;
    color: var(--dc-ink) !important;
    font-family: 'Outfit', 'Segoe UI', sans-serif !important;
}

body { min-height: 100vh; padding-bottom: 0 !important; }

.main-stage, .main-content, .main-wrapper, .main-container {
    width: min(100% - 40px, 1380px) !important;
    max-width: 1380px !important;
    margin: 195px auto 70px !important;
    padding: 24px 0 !important;
    background: transparent !important;
}

.main-stage > .container, .main-stage > .container-fluid,
.main-content > .container, .main-content > .container-fluid { max-width: 100% !important; }

.card, .elite-card, .elite-status-card, .dashboard-card,
.stat-card, .content-card, .panel {
    background: var(--dc-surface) !important;
    border: 1px solid var(--dc-border) !important;
    border-radius: var(--dc-radius) !important;
    box-shadow: var(--dc-shadow) !important;
}

.elite-card:hover, .elite-status-card:hover, .card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .08) !important;
}

.page-header, .dc-page-header {
    display: flex; align-items: center; justify-content: space-between;
    gap: 20px; margin-bottom: 28px;
}

.page-title, .dc-page-title, .main-stage h1, .main-stage h2 {
    color: var(--dc-ink); letter-spacing: -.035em;
}

.btn-primary, .btn-success {
    background: var(--dc-primary) !important;
    border-color: var(--dc-primary) !important;
}
.btn-primary:hover, .btn-success:hover {
    background: var(--dc-primary-strong) !important;
    border-color: var(--dc-primary-strong) !important;
}

.form-control, .form-select, .input-group-text {
    min-height: 44px; border-color: var(--dc-border) !important; border-radius: 12px;
}
.form-control:focus, .form-select:focus {
    border-color: var(--dc-primary) !important;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, .12) !important;
}

.table { --bs-table-bg: transparent; color: var(--dc-ink); }
.table thead th {
    color: var(--dc-muted); font-size: .72rem; letter-spacing: .06em;
    text-transform: uppercase; border-bottom-color: var(--dc-border);
}

.banner-elite {
    background: linear-gradient(135deg, #ecfdf5 0%, #ffffff 72%) !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 22px !important;
    box-shadow: none !important;
}
.stat-icon-box {
    background: var(--dc-primary-soft) !important;
    color: var(--dc-primary-strong) !important;
    box-shadow: none !important;
}

.nav-horizontal { padding: 0 18px !important; gap: 2px !important; overflow: visible; }
.nav-horizontal > .nav-item {
    padding: 0 11px !important; margin: 0 !important; border-radius: 0 !important;
    white-space: nowrap; transform: none !important;
}
.nav-horizontal > .nav-item.active {
    color: var(--dc-primary-strong) !important;
    background: var(--dc-primary-soft) !important;
    border: 0 !important; box-shadow: inset 0 -3px 0 var(--dc-primary);
}
.nav-horizontal .mega-menu { max-height: calc(100vh - 190px); overflow-y: auto; }
.footer-master-elite { padding: 52px max(28px, calc((100vw - 1200px) / 2)) !important; }

@media (max-width: 1280px) and (min-width: 992px) {
    .header-master-elite { padding: 0 18px !important; }
    .header-master-elite .tactical-group { gap: 7px !important; }
    .tactical-switch { padding: 6px 9px !important; }
    .nav-horizontal > .nav-item { padding: 0 8px !important; font-size: 12px !important; }
}

@media (max-width: 991px) {
    html, body { max-width: 100%; overflow-x: hidden !important; }
    .main-stage, .main-content, .main-wrapper, .main-container {
        width: min(100% - 28px, 760px) !important;
        margin: 118px auto 45px !important;
        padding: 12px 0 !important;
    }
    .page-header, .dc-page-header { align-items: flex-start; flex-direction: column; }
    .banner-elite { align-items: flex-start !important; flex-direction: column; gap: 18px; }
    .banner-elite > .d-flex {
        width: 100%;
        align-items: flex-start !important;
        flex-direction: column;
        gap: 12px !important;
    }
    .banner-elite h4 { font-size: 1.2rem; }
    .elite-status-card { padding: 14px !important; }
    .elite-status-card .gap-3 { gap: 8px !important; }
    .elite-status-card .fs-3 { font-size: 1.35rem !important; }
    .elite-status-card .fw-bold { font-size: .82rem; }
    .footer-master-elite { padding: 42px 22px !important; }
}




/* FORÇAR FONTE EM TODO O SISTEMA E FUNDO BRANCO */
body { background-color: #ffffff !important; }
body, html, h1, h2, h3, h4, h5, h6, .logo-text, .nav-item, .mega-item, .btn {
    font-family: 'Outfit', 'Segoe UI', sans-serif !important;
}

/* ===================================================
   NOVA BARRA DE NAVEGAÇÃO HORIZONTAL (INJETADO) 
   =================================================== */
/* BARRA DE INSPIRAÇÃO NO TOPO (MARQUEE) */
        .top-inspiration-bar {
            position: fixed; top: 0; left: 0; right: 0; height: 30px;
            background: #f0fdf4; color: #065f46;
            display: flex; align-items: center;
            font-size: 11px; font-weight: 600;
            z-index: 3001; border-bottom: 1px solid #a7f3d0;
            overflow: hidden; white-space: nowrap;
        }
        
        .inspiration-static {
            background: #dcfce7; padding: 0 15px; height: 100%; display: flex; align-items: center;
            color: #059669; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; z-index: 2; border-right: 1px solid #a7f3d0;
        }

        .marquee-container { flex-grow: 1; overflow: hidden; position: relative; height: 100%; display: flex; align-items: center; }
        
        .marquee-content {
            display: inline-block; white-space: nowrap; font-style: italic;
            animation: marquee 45s linear infinite; padding-left: 100%;
        }

        @keyframes marquee {
            0% { transform: translateX(0); }
            100% { transform: translateX(-100%); }
        }

        /* HEADER SUPERIOR (Mesmo do menu_loader.js, mas rebaixado) */
        .header-master-elite {
            position: fixed; top: 30px; left: 0; right: 0; height: 80px; 
            background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); 
            border-bottom: 2px solid var(--border); display: flex; 
            align-items: center; justify-content: space-between; padding: 0 30px; 
            z-index: 3000; flex-wrap: nowrap;
        }
        
        .logo-area { display: flex; align-items: center; gap: 10px; width: 220px; flex-shrink: 0; }
        .logo-area img { width: 38px; }
        .logo-text { font-weight: 900; font-size: 18px; line-height: 1; color: var(--dark); font-family: 'Outfit'; }
        .logo-sub { font-size: 8px; font-weight: 800; color: var(--gray); letter-spacing: 1px; }

        .tactical-group { display: flex; gap: 15px; flex-grow: 1; justify-content: center; flex-shrink: 0; align-items: center; }
        
        /* CHAVES DE ATIVAÇÃO (TOGGLES ELEGANTES) */
        .tactical-switch {
            display: flex; align-items: center; gap: 10px;
            padding: 6px 14px; border-radius: 30px;
            background: white; border: 1px solid #e2e8f0;
            cursor: pointer; transition: all 0.3s ease;
        }
        .tactical-switch:hover { border-color: #cbd5e1; box-shadow: 0 4px 12px rgba(0,0,0,0.03); }
        
        .ts-label {
            display: flex; align-items: center; gap: 6px;
            font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;
        }
        .ts-label i { font-size: 16px; }
        
        .ts-toggle {
            width: 32px; height: 18px; border-radius: 10px;
            background: #cbd5e1; position: relative; transition: all 0.3s ease;
        }
        .ts-toggle .ts-knob {
            width: 14px; height: 14px; background: white; border-radius: 50%;
            position: absolute; top: 2px; left: 2px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 1px 3px rgba(0,0,0,0.2);
        }
        
        /* Estado Ativo (Ligado) */
        .tactical-switch.active { border-color: #10b981; background: #f0fdf4; }
        .tactical-switch.active .ts-label { color: #10b981; }
        .tactical-switch.active .ts-label i { color: #10b981; }
        .tactical-switch.active .ts-toggle { background: #10b981; box-shadow: inset 0 0 5px rgba(0,0,0,0.1); }
        .tactical-switch.active .ts-knob { transform: translateX(14px); box-shadow: -1px 1px 3px rgba(0,0,0,0.2); }
        
        /* STATUS DO WHATSAPP (Online/Offline) */
        .whats-status {
            display: flex; align-items: center; gap: 6px; padding: 6px 14px;
            border-radius: 30px; font-weight: 800; font-size: 11px; letter-spacing: 0.5px; text-transform: uppercase;
            border: 1px solid #e2e8f0; background: white; margin-right: 15px; cursor: pointer; transition: 0.3s;
        }
        .whats-status.online { color: #10b981; border-color: #bbf7d0; background: #f0fdf4; }
        .whats-status.online i { color: #10b981; font-size: 18px; animation: pulse-green 2s infinite; }
        
        .whats-status.offline { color: #ef4444; border-color: #fecaca; background: #fef2f2; }
        .whats-status.offline i { color: #ef4444; font-size: 18px; animation: pulse-red 2s infinite; }
        
        .whats-status small { font-size: 9px; font-weight: 600; opacity: 0.7; margin-left: 4px; text-transform: capitalize; }

        @keyframes pulse-green { 0% { filter: drop-shadow(0 0 0 rgba(16, 185, 129, 0.8)); } 70% { filter: drop-shadow(0 0 8px rgba(16, 185, 129, 0)); } 100% { filter: drop-shadow(0 0 0 rgba(16, 185, 129, 0)); } }
        @keyframes pulse-red { 0% { filter: drop-shadow(0 0 0 rgba(239, 68, 68, 0.8)); } 70% { filter: drop-shadow(0 0 8px rgba(239, 68, 68, 0)); } 100% { filter: drop-shadow(0 0 0 rgba(239, 68, 68, 0)); } }
        
        .user-area { display: flex; align-items: center; gap: 12px; margin-left: 10px; cursor: pointer; flex-shrink: 0; }
        .user-info { text-align: right; }
        .user-name { font-weight: 900; color: var(--primary); font-size: 12px; font-family: 'Outfit'; }
        .user-role { font-size: 8px; font-weight: 800; color: #3b82f6; letter-spacing: 1px; }
        .user-avatar { width: 42px; height: 42px; border-radius: 50%; border: 2px solid var(--primary); object-fit: cover; }
        
        .btn-logout {
            display: flex; align-items: center; justify-content: center;
            width: 36px; height: 36px; border-radius: 50%; background: #fee2e2;
            color: #ef4444; cursor: pointer; transition: 0.3s; margin-left: 5px;
            font-size: 1.2rem;
        }
        .btn-logout:hover { background: #ef4444; color: white; transform: scale(1.1); box-shadow: 0 4px 10px rgba(239, 68, 68, 0.3); }

        /* NOVA BARRA DE NAVEGAÇÃO HORIZONTAL (O MEGA MENU) */
        .nav-horizontal {
            position: fixed; top: 110px; left: 0; right: 0; height: 55px;
            background: var(--white); border-bottom: 1px solid var(--border);
            display: flex; align-items: center; justify-content: center; z-index: 2900;
            box-shadow: 0 4px 15px rgba(0,0,0,0.02); gap: 10px;
        }

        .nav-horizontal .nav-item { margin-bottom: 0; border-radius: 0;
            position: relative; height: 100%; display: flex; align-items: center;
            padding: 0 15px; cursor: pointer; color: var(--gray); font-weight: 600;
            font-size: 13px; transition: 0.2s; gap: 6px; font-family: 'Outfit';
        }
        
        .nav-horizontal .nav-item:hover, .nav-horizontal .nav-item.active {
            color: var(--primary-dark); background: var(--light);
        }
        
        .nav-horizontal .nav-item i.main-icon { font-size: 1.1rem; color: var(--primary); }
        .nav-horizontal .nav-item i.bx-chevron-down { font-size: 1rem; opacity: 0.5; margin-left: -2px; }

        /* DROPDOWN - O MEGA MENU */
        .mega-menu {
            position: absolute; top: 55px; left: 50%; transform: translateX(-50%) translateY(10px);
            background: var(--white); border-radius: 16px; border: 1px solid var(--border);
            box-shadow: 0 10px 40px rgba(0,0,0,0.08); padding: 20px; width: 280px;
            opacity: 0; visibility: hidden; transition: all 0.2s ease; z-index: 3000;
            display: flex; flex-direction: column; gap: 5px;
        }

        /* Exceções de tamanho para menus maiores */
        .nav-horizontal .nav-item:nth-child(4) .mega-menu { width: 320px; } /* Marketing */

        .nav-horizontal .nav-item:hover .mega-menu {
            opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
        }

        /* Triangulozinho no topo do menu */
        .mega-menu::before {
            content: ''; position: absolute; top: -6px; left: 50%; transform: translateX(-50%) rotate(45deg);
            width: 12px; height: 12px; background: var(--white); border-left: 1px solid var(--border);
            border-top: 1px solid var(--border);
        }

        .mega-item {
            display: flex; align-items: center; gap: 12px; padding: 10px 12px;
            text-decoration: none; color: #475569; font-weight: 600; font-size: 13px;
            border-radius: 10px; transition: 0.2s; position: relative; z-index: 2;
        }
        
        .mega-item i {
            display: flex; align-items: center; justify-content: center;
            width: 30px; height: 30px; border-radius: 8px; font-size: 1.2rem;
            background: var(--light); color: var(--primary); transition: 0.2s;
        }

        .mega-item:hover { background: #f0fdf4; color: var(--primary-dark); }
        .mega-item:hover i { background: var(--primary); color: white; }

        /* Label descritivo no dropdown */
        .mega-label { font-size: 10px; color: #94a3b8; font-weight: 800; text-transform: uppercase; margin-bottom: 5px; margin-left: 5px; letter-spacing: 0.5px; }
        .mega-divider { height: 1px; background: var(--border); margin: 10px 0; }

        /* AREA DE CONTEUDO */
        .content-area {
            margin-top: 190px; padding: 40px; max-width: 1200px; margin-left: auto; margin-right: auto;
        }
        
        .mock-dashboard {
            background: white; border-radius: 20px; border: 1px solid var(--border);
            height: 600px; padding: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center;
            text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.03);
        }
        
        .mock-dashboard h1 { font-family: 'Outfit'; color: var(--dark); font-size: 2.5rem; margin-bottom: 10px; }
        .mock-dashboard p { color: var(--gray); font-size: 1.1rem; max-width: 600px; }

        /* CABEÇALHO DA PÁGINA (Título e Botões) */
        .page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }
        .page-title { font-family: 'Outfit'; color: var(--dark); font-size: 2.2rem; margin: 0; font-weight: 800; }

        /* ======== RESPONSIVIDADE MOBILE ======== */
        .mobile-menu-btn { display: none; font-size: 28px; color: var(--primary); cursor: pointer; margin-right: 10px; }
        .mobile-menu-header { display: none; } /* Ocultar chaves do mobile no desktop */
        .mobile-sidebar { display: none; } /* Ocultar sidebar no desktop */
        .mobile-overlay { display: none; } /* Ocultar overlay no desktop */
        
        @media (max-width: 991px) {
            /* Responsividade do Cabeçalho da Página */
            .page-header { flex-direction: column; align-items: flex-start; gap: 15px; margin-bottom: 20px; }
            .page-title { font-size: 1.8rem; }
            
            /* Layout flex seguro p/ celular. Logo centralizada absoluto para evitar quebrar laterais */
            .header-master-elite { display: flex; justify-content: space-between; align-items: center; padding: 0 15px; }
            .mobile-menu-btn { display: flex; font-size: 28px; margin: 0; }
            
            .logo-area { margin: 0; width: auto; }
            .logo-area img { width: 34px; }
            
            .user-area { display: flex; margin: 0; gap: 8px; }
            .user-avatar { width: 34px; height: 34px; border-width: 2px; }
            .user-name { font-size: 10px; }
            .user-role { font-size: 7px; }
            .btn-logout { display: none; } /* Ocultar botão sair do topo p/ não poluir, pode ir pro menu */
            
            /* Ocultar textos e chaves que poluem o Header no celular */
            .logo-text, .logo-sub, .inspiration-static { display: none; }
            .header-master-elite .tactical-group { display: none; } /* Esconde as chaves do header superior */
            
            /* Esconder a barra horizontal do Desktop totalmente no mobile */
            .nav-horizontal { display: none !important; }
            
            /* Nova Barra Lateral Mobile Dedicada (100% livre de bugs do desktop) */
            .mobile-sidebar {
                position: fixed; top: 0; left: -100%; width: 85%; max-width: 320px; height: 100vh;
                background: white; flex-direction: column; justify-content: flex-start;
                align-items: stretch; padding-top: 20px; padding-bottom: 50px; 
                transition: left 0.3s ease; gap: 0; display: flex;
                overflow-y: auto; z-index: 4000; box-shadow: 10px 0 30px rgba(0,0,0,0.15);
            }
            .mobile-sidebar.open { left: 0; }
            
            /* Overlay escuro quando o menu abre */
            .mobile-overlay {
                display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
                background: rgba(0,0,0,0.5); z-index: 3900; opacity: 0; transition: 0.3s;
            }
            .mobile-overlay.active { display: block; opacity: 1; }
            
            /* Header interno do menu mobile para as chaves */
            .mobile-menu-header {
                display: flex; flex-direction: column; gap: 15px; padding: 10px 20px 20px 20px;
                border-bottom: 1px solid #f1f5f9; margin-bottom: 10px;
            }
            .mobile-menu-header .tactical-group {
                display: flex; flex-direction: column; gap: 10px; align-items: stretch; display: flex !important;
            }
            .mobile-menu-header .whats-status { margin: 0; justify-content: center; }
            .mobile-menu-header .tactical-switch {
                justify-content: space-between; padding: 12px 15px; background: #f8fafc; border: 1px solid #e2e8f0;
            }
            
            .nav-horizontal .nav-item { margin-bottom: 0; border-radius: 0;
                width: 100%; padding: 15px 20px; border-bottom: 1px solid var(--border);
                flex-wrap: wrap; justify-content: space-between; height: auto; box-sizing: border-box;
            }
            
            /* Mega menu vira um sanfona interno no celular via clique (JS) */
            .mega-menu { display: none; }
            .mega-menu::before { display: none; }
            .nav-item.open-mobile .mega-menu { 
                display: flex; position: relative; top: 0; left: 0; transform: none; 
                width: 100% !important; box-shadow: none; border: none; padding: 10px 0 0 0; opacity: 1; visibility: visible;
            }
            /* Garantir que hover nativo não cause bug no mobile */
            .nav-horizontal .nav-item:hover .mega-menu { display: none; }
            .nav-item.open-mobile:hover .mega-menu { display: flex; }
            
            .content-area { margin-top: 130px; padding: 15px; }
            .top-inspiration-bar { font-size: 9px; }
        }

        /* ======== FOOTER ORIGINAL DO SISTEMA ======== */
        .footer-elite {
            margin-top: 80px; background: #0f172a; color: #cbd5e1; font-family: 'Outfit', sans-serif;
            display: flex; flex-direction: column;
        }
        
        .footer-top {
            padding: 50px 40px; display: flex; flex-direction: column; gap: 40px;
            max-width: 1400px; margin: 0 auto; width: 100%;
        }
        
        .footer-logo {
            display: flex; align-items: center; gap: 15px; border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 30px;
        }
        .footer-logo i { font-size: 32px; color: white; }
        .footer-logo .text { display: flex; flex-direction: column; }
        .footer-logo .text strong { font-size: 22px; color: white; font-weight: 900; letter-spacing: 1px; }
        .footer-logo .text span { font-size: 10px; color: #94a3b8; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }
        
        .footer-columns {
            display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px;
        }
        
        .footer-col h4 {
            color: #10b981; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 20px;
        }
        
        .footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
        .footer-col ul li { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #94a3b8; cursor: pointer; transition: 0.3s; }
        .footer-col ul li i { font-size: 16px; opacity: 0.7; }
        .footer-col ul li:hover { color: white; transform: translateX(3px); }
        .footer-col ul li:hover i { color: #10b981; opacity: 1; }
        
        .footer-col .support-text { font-size: 11px; color: #64748b; margin-top: 15px; line-height: 1.5; }
        
        .footer-bottom {
            background: #10b981; padding: 35px 40px; display: flex; justify-content: space-between; align-items: center;
        }
        .footer-bottom .copy {
            color: white; font-size: 12px; font-weight: 700; letter-spacing: 0.5px; margin: 0; line-height: 1;
        }
        .footer-bottom .social { display: flex; gap: 15px; align-items: center; margin: 0; line-height: 1; }
        .footer-bottom .social i { color: white; font-size: 22px; cursor: pointer; transition: 0.3s; }
        .footer-bottom .social i:hover { transform: scale(1.2); }
        
        @media (max-width: 991px) {
            .footer-columns { grid-template-columns: 1fr; gap: 40px; }
            .footer-bottom { flex-direction: column; gap: 15px; text-align: center; }
        }
    
/* DC-BOT Design System 2026 — base segura para páginas internas */
:root {
    --dc-bg: #f6f8fb;
    --dc-surface: #ffffff;
    --dc-border: #e5ebf2;
    --dc-text: #172033;
    --dc-muted: #64748b;
    --dc-success: #00a884;
    --dc-radius: 18px;
    --dc-shadow: 0 7px 24px rgba(15, 23, 42, .055);
}
body:not(.public-page) { background-color: var(--dc-bg); color: var(--dc-text); }
.main-stage { color: var(--dc-text); }
.main-stage .card,
.main-stage .card-nuclear,
.main-stage .glass-card {
    border-color: var(--dc-border);
}
.main-stage .form-control,
.main-stage .form-select {
    border-color: #dbe3ed;
}
.main-stage .form-control:focus,
.main-stage .form-select:focus {
    border-color: var(--dc-success);
    box-shadow: 0 0 0 .2rem rgba(0, 168, 132, .12);
}
.dc-page-title { letter-spacing: -.04em; }
/* Shared polish for operational pages */
body.polished-page {
    background:
        radial-gradient(circle at 100% 0, rgba(16,185,129,.08), transparent 28rem),
        #f6f8fb;
}
.polished-page .main-stage {
    width:min(1440px, calc(100% - 32px));
    margin-inline:auto;
}
.polished-page .main-stage > header,
.polished-page .main-stage > .row.mb-4:first-child {
    position:relative;
    overflow:hidden;
    padding:24px 26px;
    border:1px solid #e7edf4;
    border-radius:22px;
    background:linear-gradient(135deg,#fff 0%,#f8fffc 100%);
    box-shadow:0 12px 34px rgba(15,23,42,.06);
}
.polished-page .main-stage > header::after,
.polished-page .main-stage > .row.mb-4:first-child::after {
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    right:-65px;
    top:-95px;
    border-radius:50%;
    background:rgba(16,185,129,.08);
    pointer-events:none;
}
.polished-page .main-stage h2,
.polished-page .main-stage h3 {
    letter-spacing:-.035em;
}
.polished-page .card-nuclear {
    border:1px solid #e7edf4 !important;
    border-radius:22px !important;
    background:#fff;
    box-shadow:0 12px 32px rgba(15,23,42,.06) !important;
}
.polished-page .form-control,
.polished-page .form-select,
.polished-page .input-group-text {
    min-height:46px;
    border-color:#dce4ed;
}
.polished-page textarea.form-control { min-height:120px; }
.polished-page .form-control:focus,
.polished-page .form-select:focus {
    border-color:#34d399;
    box-shadow:0 0 0 .22rem rgba(16,185,129,.12);
}
.polished-page .btn {
    transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.polished-page .btn:hover { transform:translateY(-1px); }
@media (max-width:767.98px) {
    .polished-page .main-stage { width:min(100% - 20px, 1440px); }
    .polished-page .main-stage > header,
    .polished-page .main-stage > .row.mb-4:first-child {
        padding:19px 17px;
        border-radius:18px;
    }
    .polished-page .card-nuclear { border-radius:18px !important; }
}

/* Diálogos devem permanecer acima do cabeçalho e do menu. */
.modal-backdrop,
.offcanvas-backdrop {
    z-index:1080 !important;
}
.modal,
.offcanvas {
    z-index:1090 !important;
}

/* =========================================================
   DC-BOT DESIGN SYSTEM — PADRÃO OPERACIONAL ÚNICO
   Aplicado pelo menu_loader.js nas páginas internas.
   ========================================================= */
:root {
    --dc-app-bg: #f4f7fb;
    --dc-heading: #0f172a;
    --dc-copy: #475569;
    --dc-accent: #2563eb;
    --dc-action: #059669;
    --dc-line: #dfe7f0;
    --dc-panel: #ffffff;
    --dc-header-soft: #f3f7fd;
    --dc-page-radius: 22px;
}
body.dc-system-page {
    background:
        radial-gradient(circle at 100% 0, rgba(37,99,235,.055), transparent 34rem),
        var(--dc-app-bg) !important;
    color: var(--dc-heading) !important;
}
body.dc-system-page :is(.main-stage,.main-content,.main-wrapper,.main-container) {
    background: transparent !important;
}
body.dc-system-page .dc-standard-header {
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    min-height: 154px !important;
    margin: 0 0 24px !important;
    padding: 26px 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 22px !important;
    color: var(--dc-heading) !important;
    background: linear-gradient(120deg, #ffffff 0%, var(--dc-header-soft) 100%) !important;
    border: 1px solid var(--dc-line) !important;
    border-radius: var(--dc-page-radius) !important;
    box-shadow: 0 10px 28px rgba(15,23,42,.045) !important;
}
body.dc-system-page .dc-standard-header::after {
    content: "" !important;
    position: absolute !important;
    width: 230px !important;
    height: 230px !important;
    right: -80px !important;
    top: -125px !important;
    border-radius: 50% !important;
    background: rgba(37,99,235,.055) !important;
    pointer-events: none !important;
}
body.dc-system-page .dc-standard-header > * { position: relative; z-index: 1; }
body.dc-system-page .dc-standard-header :is(h1,h2,h3) {
    color: var(--dc-heading) !important;
    font-size: clamp(1.65rem, 3vw, 2.25rem) !important;
    font-weight: 900 !important;
    letter-spacing: -.045em !important;
    line-height: 1.12 !important;
    margin-bottom: 7px !important;
}
body.dc-system-page .dc-standard-header :is(p,.text-muted) {
    color: var(--dc-copy) !important;
    font-size: .98rem !important;
    font-weight: 400 !important;
}
body.dc-system-page .dc-standard-header .eyebrow,
body.dc-system-page .dc-standard-header .ia-eyebrow {
    color: var(--dc-accent) !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    letter-spacing: .13em !important;
    text-transform: uppercase !important;
}
body.dc-system-page :is(.panel,.workspace,.workspace-card,.card-nuclear,.content-card) {
    background: var(--dc-panel) !important;
    border-color: var(--dc-line) !important;
    box-shadow: 0 10px 28px rgba(15,23,42,.05) !important;
}
body.dc-system-page .btn-primary {
    background: var(--dc-accent) !important;
    border-color: var(--dc-accent) !important;
}
body.dc-system-page .btn-success {
    background: var(--dc-action) !important;
    border-color: var(--dc-action) !important;
}
body.dc-system-page :is(.form-control,.form-select,.input-group-text) {
    border-color: var(--dc-line) !important;
}
@media (max-width: 767.98px) {
    body.dc-system-page .dc-standard-header {
        min-height: 0 !important;
        padding: 20px 17px !important;
        border-radius: 18px !important;
        align-items: flex-start !important;
        flex-direction: column !important;
    }
    body.dc-system-page .dc-standard-header > :is(.d-flex,.text-end) { width: 100%; }
    body.dc-system-page .dc-standard-header .btn { max-width: 100%; }
}
.swal2-container {
    z-index:1100 !important;
}
.modal .modal-content {
    max-height:calc(100dvh - 1rem);
}
.modal .modal-body {
    overflow-y:auto;
}