:root {
            --primary-dark: #0A0E27;
            --primary-blue: #00D4FF;
            --primary-blue-dark: #0099CC;
            --accent-orange: #FF6B35;
            --accent-green: #10B981;
            --accent-red: #EF4444;
            --accent-yellow: #FFC107;
            --accent-purple: #8B5CF6;
            --text-white: #FFFFFF;
            --text-gray: #8B92B4;
            --text-light: #E2E8F0;
        }
        body[data-theme="cyan"],  body:not([data-theme]) { --primary-blue: #00D4FF; --primary-blue-dark: #0099CC; }
        body[data-theme="blue"]   { --primary-blue: #3B82F6; --primary-blue-dark: #2563EB; }
        body[data-theme="orange"] { --primary-blue: #FF6B35; --primary-blue-dark: #E55A2B; }
        body[data-theme="amber"]  { --primary-blue: #F59E0B; --primary-blue-dark: #D97706; }
        body[data-theme="green"]  { --primary-blue: #10B981; --primary-blue-dark: #059669; }
        body[data-theme="teal"]   { --primary-blue: #14B8A6; --primary-blue-dark: #0D9488; }
        body[data-theme="lime"]   { --primary-blue: #84CC16; --primary-blue-dark: #65A30D; }
        body[data-theme="purple"] { --primary-blue: #8B5CF6; --primary-blue-dark: #7C3AED; }
        body[data-theme="indigo"] { --primary-blue: #6366F1; --primary-blue-dark: #4F46E5; }
        body[data-theme="pink"]   { --primary-blue: #EC4899; --primary-blue-dark: #DB2777; }
        body[data-theme="rose"]   { --primary-blue: #F43F5E; --primary-blue-dark: #E11D48; }
        body[data-theme="red"]    { --primary-blue: #EF4444; --primary-blue-dark: #DC2626; }
        body[data-theme="slate"]  { --primary-blue: #64748B; --primary-blue-dark: #475569; }

        * { margin: 0; padding: 0; box-sizing: border-box; }

        body { 
            font-family: 'Inter', sans-serif; 
            background: var(--primary-dark); 
            color: var(--text-white); 
            min-height: 100vh;
            overflow-x: hidden;
        }

        /* Scrollbar */
        ::-webkit-scrollbar { width: 8px; height: 8px; }
        ::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); border-radius: 4px; }
        ::-webkit-scrollbar-thumb { background: var(--primary-blue); border-radius: 4px; }

        /* Layout Principal */
        .dashboard-layout { 
            display: flex; 
            min-height: 100vh;
        }

        /* Sidebar – usa cor do tema */
        .sidebar {
            width: 260px;
            background: linear-gradient(180deg, color-mix(in srgb, var(--primary-blue) 18%, #0f1535) 0%, #0A0E27 100%);
            border-right: 2px solid var(--primary-blue);
            padding: 1.5rem 1rem;
            display: flex;
            flex-direction: column;
            position: fixed;
            left: 0;
            top: 0;
            bottom: 0;
            z-index: 100;
            overflow-x: hidden;
            overflow-y: auto;
            transition: width 0.25s ease, padding 0.25s ease;
        }
        .sidebar.collapsed {
            width: 72px;
            padding: 1rem 0.5rem;
        }
        .sidebar.collapsed + .main-content { margin-left: 72px; }
        body.sidebar-collapsed .modal-overlay { left: 72px; }
        .sidebar.collapsed .sidebar-header .sidebar-title,
        .sidebar.collapsed .sidebar-header .sidebar-subtitle,
        .sidebar.collapsed .nav-btn .nav-btn-text,
        .sidebar.collapsed .btn-voltar .btn-voltar-text { display: none !important; }
        .sidebar.collapsed .sidebar-header { padding-bottom: 1rem; }
        .sidebar.collapsed .sidebar-logo { font-size: 3rem; }
        .sidebar.collapsed .nav-btn { justify-content: center; padding: 0.75rem; }
        .sidebar.collapsed .nav-btn .icon { font-size: 1.55rem; margin: 0; }
        .sidebar.collapsed .btn-sync-dados .icon { font-size: 1.2rem; }
        .sidebar:not(.collapsed) .nav-btn .icon { font-size: 1.2rem; }
        .sidebar.collapsed .sidebar-footer { align-items: center; }
        .sidebar.collapsed .sidebar-user-wrap { justify-content: center; }
        .sidebar.collapsed .btn-voltar { justify-content: center; padding: 0.6rem; }
        .sidebar.collapsed .btn-voltar .icon-voltar { font-size: 1.4rem; }
        .sidebar-toggle {
            position: absolute;
            top: 50%;
            right: -12px;
            transform: translateY(-50%);
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: var(--primary-blue);
            color: #0A0E27;
            border: 2px solid rgba(255,255,255,0.3);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 0.75rem;
            z-index: 101;
            transition: transform 0.2s, background 0.2s;
            box-shadow: 0 2px 8px rgba(0,0,0,0.3);
        }
        .sidebar-toggle:hover { transform: translateY(-50%) scale(1.1); background: var(--primary-blue-dark); color: #fff; }
        .sidebar.collapsed .sidebar-toggle { right: -12px; }
        .sidebar.collapsed .sidebar-toggle .chevron-expand { display: inline; }
        .sidebar.collapsed .sidebar-toggle .chevron-collapse { display: none; }
        .sidebar-toggle .chevron-expand { display: none; }
        .sidebar-toggle .chevron-collapse { display: inline; }
        .sidebar-toggle .chevron-mobile { display: none; }
        .sidebar-toggle .chevron-desktop { display: inline; }

        .sidebar-header {
            text-align: center;
            padding-bottom: 1.5rem;
            border-bottom: 1px solid rgba(255,255,255,0.12);
            margin-bottom: 1.5rem;
        }

        .sidebar-logo { font-size: 4.25rem; margin-bottom: 0.5rem; display: flex; align-items: center; justify-content: center; width: 100%; }
        .sidebar-logo img.sidebar-logo-img { max-height: 82px; max-width: 272px; object-fit: contain; display: block; margin: 0 auto; }
        .sidebar.collapsed .sidebar-logo img.sidebar-logo-img { max-height: 3.4rem; max-width: 71px; }
        .sidebar-title { font-size: 1.1rem; font-weight: 700; }
        .sidebar-subtitle { font-size: 0.75rem; color: var(--text-gray); }
        .dashboard-sync-status { font-size: 0.75rem; margin-top: 0.5rem; padding: 0.35rem 0.5rem; border-radius: 6px; text-align: center; min-height: 1.2rem; }
        .dashboard-sync-status.status-offline { background: rgba(245,158,11,0.2); color: #FCD34D; border: 1px solid rgba(245,158,11,0.4); }
        .dashboard-sync-status.status-online { background: rgba(16,185,129,0.15); color: #6EE7B7; border: 1px solid rgba(16,185,129,0.35); }
        .dashboard-sync-status.status-syncing { background: rgba(0,212,255,0.15); color: var(--primary-blue); border: 1px solid rgba(0,212,255,0.35); }
        .dashboard-sync-status.status-synced { background: rgba(16,185,129,0.25); color: #6EE7B7; border: 1px solid rgba(16,185,129,0.5); }
        .sidebar-pagar-balao {
            display: none;
            margin-top: 0.75rem;
            padding: 0.9rem 0.85rem;
            background: linear-gradient(145deg, rgba(0,212,255,0.18) 0%, rgba(0,153,204,0.12) 100%);
            border: 1px solid rgba(0,212,255,0.45);
            border-radius: 12px;
            box-shadow: 0 4px 16px rgba(0,212,255,0.15);
            text-align: center;
        }
        .sidebar-pagar-balao.show { display: block; }
        .sidebar-pagar-balao .sidebar-pagar-titulo { font-size: 0.8rem; font-weight: 700; color: rgba(255,255,255,0.95); margin-bottom: 0.25rem; text-transform: uppercase; letter-spacing: 0.04em; }
        .sidebar-pagar-balao .sidebar-pagar-msg { font-size: 0.75rem; color: var(--text-gray); margin-bottom: 0.6rem; line-height: 1.3; }
        .sidebar-pagar-balao .sidebar-pagar-btn {
            display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
            width: 100%;
            padding: 0.6rem 1rem;
            font-size: 0.95rem; font-weight: 700;
            background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%);
            color: #0A0E27;
            border: none; border-radius: 10px;
            cursor: pointer;
            box-shadow: 0 3px 14px rgba(0,212,255,0.4);
            transition: transform 0.15s, box-shadow 0.2s;
        }
        .sidebar-pagar-balao .sidebar-pagar-btn:hover { transform: translateY(-2px); box-shadow: 0 5px 20px rgba(0,212,255,0.5); }
        .sidebar-pagar-balao .sidebar-pagar-btn:disabled { opacity: 0.85; cursor: wait; transform: none; }
        .sidebar.collapsed .sidebar-pagar-balao .sidebar-pagar-msg { display: none; }
        .sidebar.collapsed .sidebar-pagar-balao .sidebar-pagar-titulo { font-size: 0.7rem; }

        .nav-menu {
            display: flex;
            flex-direction: column;
            gap: 0.4rem;
            flex: 1;
        }

        .nav-btn {
            display: flex;
            align-items: center;
            gap: 0.7rem;
            padding: 0.85rem 1rem;
            border: none;
            border-radius: 10px;
            background: rgba(255,255,255,0.03);
            color: var(--text-gray);
            font-size: 0.9rem;
            cursor: pointer;
            transition: all 0.3s;
            text-align: left;
        }

        .nav-btn:hover {
            background: rgba(255,255,255,0.08);
            color: white;
            transform: translateX(3px);
        }

        .nav-btn.active {
            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
            color: white;
        }

        .nav-btn .icon { font-size: 1.2rem; flex-shrink: 0; }

        .sidebar-footer {
            padding-top: 1rem;
            border-top: 1px solid rgba(255,255,255,0.1);
            margin-top: auto;
        }

        .btn-voltar {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.7rem;
            border: 1px solid rgba(255,255,255,0.2);
            border-radius: 8px;
            background: transparent;
            color: var(--text-gray);
            font-size: 0.85rem;
            cursor: pointer;
            transition: all 0.3s;
        }
        .btn-upgrade-sidebar {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.7rem;
            border: 1px solid rgba(139,92,246,0.5);
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(139,92,246,0.25) 0%, rgba(124,58,237,0.2) 100%);
            color: #E9D5FF;
            font-size: 0.85rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s;
        }
        .btn-upgrade-sidebar:hover { background: linear-gradient(135deg, rgba(139,92,246,0.4) 0%, rgba(124,58,237,0.35) 100%); color: #fff; }
        .sidebar.collapsed .btn-upgrade-sidebar .btn-voltar-text { display: none; }

        .btn-voltar:hover {
            background: rgba(255,255,255,0.05);
            color: white;
            border-color: var(--primary-blue);
        }

        .btn-sync-dados {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.6rem 0.7rem;
            margin-bottom: 0.5rem;
            border: 1px solid rgba(0,212,255,0.35);
            border-radius: 8px;
            background: rgba(0,212,255,0.08);
            color: var(--primary-blue);
            font-size: 0.82rem;
            cursor: pointer;
            transition: all 0.2s;
        }
        .btn-sync-dados:hover {
            background: rgba(0,212,255,0.15);
            color: #fff;
            border-color: var(--primary-blue);
        }
        .sidebar.collapsed .btn-sync-dados .btn-sync-text { display: none !important; }
        .sidebar.collapsed .btn-sync-dados { justify-content: center; padding: 0.6rem; }

        /* Conteúdo Principal */
        .main-content {
            flex: 1;
            margin-left: 260px;
            padding: 0 2rem 1.5rem;
            position: relative;
            min-height: 100vh;
            max-height: 100vh;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            transition: margin-left 0.25s ease;
        }
        .main-top-bar {
            display: flex;
            justify-content: flex-end;
            align-items: center;
            padding: 0.75rem 0;
            margin-bottom: 0.5rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
            flex-shrink: 0;
        }
        .user-welcome-wrap {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            position: relative;
        }
        .user-welcome-wrap #welcomeMessage {
            font-size: 1rem;
            color: var(--text-light);
        }
        .header-plan-label {
            font-size: 0.8rem;
            font-weight: 600;
            color: var(--primary-blue);
            background: rgba(0,212,255,0.12);
            padding: 0.25rem 0.5rem;
            border-radius: 6px;
            margin-left: 0.35rem;
        }
        body.pdv-page-light .header-plan-label { color: #0ea5e9; background: rgba(14,165,233,0.15); }
        .user-avatar-wrap {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            cursor: pointer;
            padding: 0.5rem 0.85rem;
            border-radius: 10px;
            background: rgba(255,255,255,0.06);
            border: 1px solid rgba(255,255,255,0.12);
            min-height: 48px;
        }
        .user-avatar-wrap:hover { background: rgba(255,255,255,0.1); }
        .user-avatar-wrap img {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            object-fit: cover;
        }
        .user-avatar-wrap .no-photo {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: var(--primary-blue);
            color: #0A0E27;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
        }
        .user-dropdown {
            position: absolute;
            top: 100%;
            right: 0;
            margin-top: 0.35rem;
            min-width: 160px;
            background: #1a1f3a;
            border: 1px solid rgba(255,255,255,0.15);
            border-radius: 8px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.4);
            z-index: 200;
            overflow: hidden;
        }
        .user-dropdown.hidden { display: none; }
        .user-dropdown a {
            display: block;
            padding: 0.65rem 1rem;
            color: var(--text-light);
            text-decoration: none;
            font-size: 0.9rem;
            border: none;
            background: none;
            width: 100%;
            text-align: left;
            cursor: pointer;
        }
        .user-dropdown a:hover { background: rgba(255,255,255,0.08); color: white; }
        .main-inner {
            flex: 1;
            overflow-y: auto;
            overflow-x: hidden;
            padding-top: 0.5rem;
        }

        .content-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 1.5rem;
            padding-bottom: 1rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        .content-header h1 {
            font-size: 1.6rem;
            display: flex;
            align-items: center;
            gap: 0.7rem;
        }

        .btn-primary {
            padding: 0.7rem 1.2rem;
            border: none;
            border-radius: 8px;
            background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%);
            color: white;
            font-weight: 600;
            font-size: 0.9rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 0.5rem;
            transition: all 0.3s;
        }

        .btn-primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(0,212,255,0.3);
        }

        /* Seções */
        .section { display: none; animation: fadeIn 0.3s ease; }
        .section.active { display: block; }

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

        /* Stats Grid */
        .stats-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
            gap: 1rem;
            margin-bottom: 1.5rem;
        }

        /* Bloco de upgrade (seção bloqueada por plano) */
        .section-upgrade-block {
            max-width: 480px;
            margin: 2rem auto;
            padding: 2rem;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px;
            text-align: center;
        }
        .section-upgrade-block h3 { margin-bottom: 0.75rem; color: var(--text-light); font-size: 1.2rem; }
        .section-upgrade-block p { color: var(--text-gray); font-size: 0.95rem; margin-bottom: 1.25rem; line-height: 1.5; }
        .section-upgrade-block .btn-upgrade { padding: 0.75rem 1.5rem; border-radius: 10px; font-weight: 600; background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); color: #fff; border: none; cursor: pointer; font-size: 1rem; }
        .section-upgrade-block .btn-upgrade:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(139,92,246,0.4); }

        /* Config Pagamentos: grid de planos */
        .config-pagamentos-planos-wrap { margin-bottom: 1.5rem; }
        .config-pagamentos-planos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
        .config-plano-card { padding: 1.25rem; border-radius: 12px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }
        .config-plano-card-destaque { border-color: rgba(0,212,255,0.4); background: rgba(0,212,255,0.06); }
        .config-plano-card-pro { border-color: rgba(139,92,246,0.5); background: rgba(139,92,246,0.08); }
        .config-plano-name { font-weight: 700; font-size: 1.1rem; margin-bottom: 0.35rem; color: var(--text-light); }
        .config-plano-preco { font-size: 1.4rem; font-weight: 700; color: var(--primary-blue); margin-bottom: 0.5rem; }
        .config-plano-card-pro .config-plano-preco { color: #C4B5FD; }
        .config-plano-desc { font-size: 0.8rem; color: var(--text-gray); line-height: 1.4; margin-bottom: 1rem; }
        .config-plano-topicos { font-size: 0.8rem; color: var(--text-gray); line-height: 1.4; margin-bottom: 1rem; }
        .config-plano-topicos ul { margin: 0; padding-left: 1.1rem; list-style: disc; }
        .config-plano-topicos li { margin-bottom: 0.25rem; }
        .config-plano-btn { width: 100%; padding: 0.6rem; font-size: 0.9rem; }
        .config-plano-btn-pro { background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); }

        .stat-card {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            padding: 1.2rem;
            text-align: center;
            transition: all 0.3s;
        }

        .stat-card:hover {
            transform: translateY(-3px);
            border-color: rgba(0,212,255,0.3);
            box-shadow: 0 8px 25px rgba(0,0,0,0.2);
        }

        .stat-icon { font-size: 2rem; margin-bottom: 0.5rem; }
        .stat-value { font-size: 1.6rem; font-weight: 700; color: var(--primary-blue); }
        .stat-label { font-size: 0.75rem; color: var(--text-gray); margin-top: 0.3rem; }

        /* Cards Grid */
        .card-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: 1rem;
        }
        .pdv-card { border-radius: 12px; }
        .pdv-product-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
            gap: 0.75rem;
        }
        .pdv-product-grid .card { padding: 0.85rem; }
        .pdv-product-grid .btn-small.btn-view { padding: 0.5rem 0.85rem; font-weight: 600; }

        .card {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            padding: 1.2rem;
            transition: all 0.3s;
        }

        .card:hover {
            border-color: rgba(0,212,255,0.2);
            transform: translateY(-2px);
        }

        .card-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            margin-bottom: 0.8rem;
        }

        .card-title { font-size: 1rem; margin: 0; font-weight: 600; }
        .card-subtitle { font-size: 0.8rem; color: var(--text-gray); margin: 0.2rem 0 0; }
        .card-value { font-size: 1.3rem; font-weight: 700; color: var(--primary-blue); margin-top: 0.5rem; }

        .card-actions {
            display: flex;
            gap: 0.4rem;
            margin-top: 1rem;
            flex-wrap: wrap;
        }

        .view-toggle { display: flex; gap: 0.25rem; align-items: center; }
        .view-toggle button { padding: 0.4rem 0.8rem; border-radius: 8px; font-size: 0.8rem; cursor: pointer; border: 1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.05); color: var(--text-light); }
        .view-toggle button.active { background: var(--primary-blue); color: #fff; border-color: var(--primary-blue); }
        .view-toggle button:hover:not(.active) { background: rgba(255,255,255,0.1); }
        .data-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
        .data-table th, .data-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .data-table th { color: var(--text-gray); font-weight: 600; }
        .data-table tr:hover { background: rgba(255,255,255,0.03); }
        .data-table .actions-cell { white-space: nowrap; }
        .data-table .actions-cell .btn-small { margin: 0 0.2rem; }
        .status-select-inline {
            min-width: 155px;
            padding: 0.3rem 0.45rem;
            border-radius: 8px;
            border: 1px solid rgba(255,255,255,0.2);
            background: rgba(255,255,255,0.07);
            color: var(--text-light);
            font-size: 0.82rem;
        }

        .btn-small {
            padding: 0.35rem 0.7rem;
            border: none;
            border-radius: 6px;
            font-size: 0.75rem;
            cursor: pointer;
            transition: all 0.2s;
        }

        .btn-view { background: rgba(0,212,255,0.15); color: #00D4FF; }
        .btn-view:hover { background: rgba(0,212,255,0.25); }
        .btn-edit { background: rgba(255,193,7,0.15); color: #FFC107; }
        .btn-edit:hover { background: rgba(255,193,7,0.25); }
        .btn-delete { background: rgba(239,68,68,0.15); color: #EF4444; }
        .btn-delete:hover { background: rgba(239,68,68,0.25); }
        .btn-qty-add { background: rgba(16,185,129,0.2); color: #10B981; }
        .btn-qty-add:hover { background: rgba(16,185,129,0.35); }
        .btn-qty-remove { background: rgba(245,158,11,0.2); color: #F59E0B; }
        .btn-qty-remove:hover { background: rgba(245,158,11,0.35); }
        .btn-pdf { background: rgba(16,185,129,0.15); color: #10B981; }
        .btn-pdf:hover { background: rgba(16,185,129,0.25); }
        .btn-whatsapp { background: rgba(37,211,102,0.15); color: #25D366; }
        .btn-whatsapp:hover { background: rgba(37,211,102,0.25); }
        .btn-payment { background: rgba(0,212,255,0.15); color: var(--primary-blue); }
        .btn-payment:hover { background: rgba(0,212,255,0.25); }

        /* Status Dropdown */
        .status-dropdown { position: relative; display: inline-block; }

        .status-dropdown-btn {
            padding: 0.3rem 0.7rem;
            border-radius: 15px;
            font-size: 0.7rem;
            font-weight: 600;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 0.3rem;
        }

        .status-dropdown-content {
            display: none;
            position: absolute;
            right: 0;
            background: linear-gradient(145deg, #0f1535 0%, #0A0E27 100%);
            min-width: 160px;
            box-shadow: 0 8px 25px rgba(0,0,0,0.4);
            border-radius: 10px;
            z-index: 100;
            border: 1px solid rgba(255,255,255,0.1);
            overflow: hidden;
        }

        .status-dropdown:hover .status-dropdown-content { display: block; }

        .status-menu-floating {
            background: linear-gradient(145deg, #0f1535 0%, #0A0E27 100%);
            min-width: 170px;
            box-shadow: 0 8px 25px rgba(0,0,0,0.45);
            border-radius: 10px;
            z-index: 9999;
            border: 1px solid rgba(255,255,255,0.12);
            overflow: hidden;
        }
        .status-menu-floating .status-option.active {
            background: rgba(0,212,255,0.16);
        }

        .status-option {
            padding: 0.6rem 1rem;
            cursor: pointer;
            font-size: 0.8rem;
            transition: background 0.2s;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .status-option:hover { background: rgba(255,255,255,0.1); }

        /* Status Colors */
        .status-pending { background: rgba(255,193,7,0.2); color: #FFC107; }
        .status-approved { background: rgba(16,185,129,0.2); color: #10B981; }
        .status-inprogress { background: rgba(0,212,255,0.2); color: #00D4FF; }
        .status-completed { background: rgba(139,92,246,0.2); color: #8B5CF6; }
        .status-paid { background: rgba(16,185,129,0.3); color: #10B981; }
        .status-partial { background: rgba(255,159,64,0.2); color: #FF9F40; }
        .status-cancelled { background: rgba(239,68,68,0.2); color: #EF4444; }

        /* Payment Badge */
        .payment-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.3rem;
            padding: 0.2rem 0.6rem;
            border-radius: 10px;
            font-size: 0.7rem;
            background: rgba(255,255,255,0.08);
            margin-top: 0.5rem;
            color: var(--text-gray);
        }

        /* Chart Containers */
        .chart-container {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            padding: 1.2rem;
            margin-bottom: 1.5rem;
            max-height: 320px;
            overflow: hidden;
        }
        .chart-container canvas {
            max-height: 220px;
            display: block;
        }

        .chart-container h3 {
            margin-bottom: 1rem;
            font-size: 1rem;
            color: var(--text-light);
        }

        .charts-row {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 1.5rem;
            margin-bottom: 1.5rem;
        }

        /* Activity History */
        .activity-list {
            max-height: 300px;
            overflow-y: auto;
        }

        .activity-item {
            display: flex;
            align-items: flex-start;
            gap: 0.8rem;
            padding: 0.8rem;
            border-bottom: 1px solid rgba(255,255,255,0.05);
            animation: fadeIn 0.3s ease;
        }

        .activity-icon {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1rem;
            flex-shrink: 0;
        }

        .activity-content { flex: 1; }
        .activity-text { margin: 0; font-size: 0.85rem; color: var(--text-light); }
        .activity-time { margin: 0.2rem 0 0; font-size: 0.7rem; color: var(--text-gray); }

        /* Modal */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 260px;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.85);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 1000;
            padding: 1rem;
            overflow-y: auto;
        }

        .modal-overlay.active { display: flex; }

        /* Overlay suave para modais do PDV (menos preta fosca) */
        .modal-overlay.pdv-modal-overlay {
            background: rgba(15, 23, 42, 0.35);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            transition: opacity 0.2s ease;
        }
        body.pdv-standalone .modal-overlay.pdv-modal-overlay { left: 0; }
        .modal-overlay.pdv-modal-overlay.active {
            animation: pdvOverlayFade 0.2s ease;
        }

        /* Bloqueio do PDV até digitar senha (acima do conteúdo, abaixo dos modais globais) */
        .pdv-password-overlay {
            position: fixed;
            top: 0;
            left: 260px;
            right: 0;
            bottom: 0;
            z-index: 10002;
            display: none;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            background: rgba(10, 14, 39, 0.92);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
            padding: 1.5rem;
        }
        body.sidebar-collapsed .pdv-password-overlay { left: 72px; }
        body.pdv-standalone .pdv-password-overlay { left: 0; }
        .pdv-password-overlay-inner {
            display: flex;
            flex-direction: column;
            align-items: center;
            max-width: 380px;
        }
        .pdv-password-overlay-title {
            margin: 0 0 0.5rem;
            font-size: 1.25rem;
            font-weight: 700;
            color: var(--text-light, #e2e8f0);
        }
        .pdv-password-overlay-input {
            width: 100%;
            max-width: 280px;
            padding: 0.65rem 0.75rem;
            border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.15);
            background: rgba(255,255,255,0.06);
            color: #fff;
            margin-bottom: 0.75rem;
            font-size: 1rem;
        }
        @keyframes pdvOverlayFade {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        .modal {
            background: linear-gradient(145deg, #0f1535 0%, #0A0E27 100%);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px;
            padding: 1.5rem;
            width: 100%;
            max-width: 650px;
            max-height: 90vh;
            overflow-y: auto;
            position: relative;
        }
        /* Garantir que inputs dentro de modais aceitam digitação e foco */
        .modal input:not([readonly]):not([disabled]),
        .modal select:not([disabled]),
        .modal textarea:not([readonly]):not([disabled]) {
            pointer-events: auto;
            -webkit-user-select: text;
            user-select: text;
        }

        .modal-close {
            position: absolute;
            top: 1rem;
            right: 1rem;
            background: rgba(255,255,255,0.1);
            border: none;
            color: white;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            cursor: pointer;
            font-size: 1.2rem;
            transition: all 0.2s;
        }

        .modal-close:hover { background: rgba(239,68,68,0.3); }

        .modal-header { margin-bottom: 1.2rem; }
        .modal-header h2 { margin: 0; font-size: 1.3rem; display: flex; align-items: center; gap: 0.5rem; }

        /* Forms */
        .form-group { margin-bottom: 1rem; }

        .form-group label {
            display: block;
            margin-bottom: 0.4rem;
            font-size: 0.85rem;
            color: var(--text-light);
            font-weight: 500;
        }

        .form-group input,
        .form-group select,
        .form-group textarea {
            width: 100%;
            padding: 0.7rem 1rem;
            border: 1px solid rgba(0,0,0,0.2);
            border-radius: 8px;
            background: #ffffff;
            color: #000000;
            font-size: 0.9rem;
            font-family: inherit;
        }

        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus {
            outline: none;
            border-color: var(--primary-blue);
        }

        #quotesFilterStatus,
        #quotesFilterStatus option { background: #1a1f3a !important; color: #E2E8F0 !important; }
        #vendaAvulsaPayment, #vendaAvulsaParcelas { background: #1a1f3a !important; color: #E2E8F0 !important; }
        #vendaAvulsaPayment option, #vendaAvulsaParcelas option { background: #1a1f3a !important; color: #E2E8F0 !important; }
        #section-venda .card { background: rgba(255,255,255,0.03); color: #E2E8F0; }
        #section-venda .card .card-title, #section-venda .card label, #section-venda .card p { color: #E2E8F0; }
        #section-venda #vendaCartItems, #section-venda #vendaCartItems p { color: #E2E8F0; }

        /* PDV repaginado - tela clara e intuitiva */
        .pdv-section { background: #f8fafc; color: #1e293b; }
        .pdv-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 2px solid #e2e8f0; }
        .pdv-header h1 { margin: 0; font-size: 1.5rem; color: #0f172a; }
        .pdv-datetime { margin: 0.25rem 0 0; font-size: 0.8rem; color: #64748b; font-weight: 500; }
        .pdv-vendedor-wrap { display: flex; flex-direction: column; align-items: flex-end; }
        .pdv-vendedor-label { font-size: 0.75rem; color: #64748b; margin-bottom: 0.25rem; }
        .pdv-vendedor-select { padding: 0.6rem 1rem; border-radius: 10px; border: 2px solid #cbd5e1; background: #fff !important; color: #1e293b !important; font-size: 0.95rem; min-width: 180px; }
        .pdv-section .pdv-vendedor-select option { background: #fff !important; color: #1e293b !important; }
        .pdv-vendedor-status { margin: 0.25rem 0 0; font-size: 0.8rem; color: #64748b; }
        .pdv-main { max-width: 720px; margin: 0 auto; }
        .pdv-barcode-input { width: 100%; max-width: 320px; padding: 0.6rem 1rem; border-radius: 10px; border: 2px solid #e2e8f0; background: #fff; color: #334155; font-size: 1rem; margin-bottom: 0.35rem; }
        .pdv-barcode-input:focus { outline: none; border-color: var(--primary-blue); }
        .pdv-barcode-hint { font-size: 0.8rem; color: #64748b; margin: 0 0 1rem; max-width: 420px; line-height: 1.4; }
        .pdv-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; align-items: stretch; }
        .pdv-btn-add, .pdv-btn-manual { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 1.5rem; border-radius: 16px; border: 2px dashed #cbd5e1; background: #fff; color: #334155; font-size: 1.1rem; font-weight: 600; cursor: pointer; transition: all 0.2s; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
        .pdv-btn-add:hover, .pdv-btn-manual:hover { border-color: var(--primary-blue); background: rgba(0,212,255,0.06); color: var(--primary-blue); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
        .pdv-btn-add { border-color: #10B981; color: #059669; }
        .pdv-btn-add:hover { border-color: #059669; background: rgba(16,185,129,0.08); color: #047857; }
        .pdv-btn-manual { border-color: #F59E0B; color: #D97706; }
        .pdv-btn-manual:hover { border-color: #D97706; background: rgba(245,158,11,0.08); color: #B45309; }
        .pdv-btn-icon { font-size: 2.5rem; margin-bottom: 0.5rem; }
        .pdv-btn-text { display: block; }
        .pdv-btn-hint { font-size: 0.8rem; font-weight: 400; color: #94a3b8; margin-top: 0.25rem; }
        .pdv-btn-shortcut { font-size: 0.7rem; color: #cbd5e1; margin-top: 0.2rem; font-weight: 600; }
        .pdv-cart-box { background: #fff; border-radius: 16px; padding: 1.5rem; box-shadow: 0 4px 20px rgba(0,0,0,0.08); border: 1px solid #e2e8f0; }
        .pdv-cart-title { margin: 0 0 0.5rem; font-size: 1rem; color: #64748b; }
        .pdv-cart-count { font-size: 0.8rem; color: #94a3b8; margin-bottom: 0.75rem; }
        .pdv-cart-items { min-height: 80px; max-height: 280px; overflow-y: auto; margin-bottom: 1rem; }
        .pdv-cart-items .pdv-cart-item { display: flex; justify-content: space-between; align-items: center; padding: 0.7rem 0; border-bottom: 1px solid #f1f5f9; color: #334155; font-size: 0.95rem; }
        .pdv-cart-items .pdv-cart-item .pdv-cart-item-rm { background: #fee2e2; color: #dc2626; border: none; padding: 0.3rem 0.6rem; border-radius: 8px; cursor: pointer; font-size: 1rem; font-weight: 700; line-height: 1; transition: background 0.15s; }
        .pdv-cart-items .pdv-cart-item .pdv-cart-item-rm:hover { background: #fecaca; }
        .pdv-cart-total-box { background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); border: 1px solid #bae6fd; border-radius: 12px; padding: 1rem 1.25rem; margin-top: 0.75rem; }
        .pdv-cart-total-wrap { display: flex; justify-content: space-between; align-items: center; }
        .pdv-cart-total-label { font-size: 1rem; font-weight: 600; color: #0c4a6e; }
        .pdv-cart-total-value { font-size: 1.75rem; font-weight: 800; color: #0369a1; letter-spacing: -0.02em; }
        .pdv-cart-empty { color: #94a3b8; font-size: 0.95rem; padding: 2rem 1rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; }
        .pdv-cart-empty-icon { font-size: 2.5rem; opacity: 0.6; }
        .pdv-payment-row { margin-top: 1rem; }
        .pdv-payment-row label, .pdv-parcelas-wrap label { display: block; font-size: 0.85rem; color: #64748b; margin-bottom: 0.35rem; }
        .pdv-payment-select { width: 100%; max-width: 260px; padding: 0.65rem 1rem; border-radius: 10px; border: 2px solid #e2e8f0; background: #fff; color: #334155; font-size: 1rem; }
        .pdv-payment-shortcuts { font-size: 0.75rem; color: #94a3b8; margin: 0.4rem 0 0; }
        .pdv-payment-shortcuts kbd { padding: 0.1rem 0.35rem; background: #e2e8f0; border-radius: 4px; color: #475569; font-size: 0.7rem; }
        .pdv-parcelas-wrap { margin-top: 0.75rem; }
        .pdv-parcelas-wrap select { padding: 0.5rem; border-radius: 8px; border: 1px solid #e2e8f0; background: #fff; color: #334155; }
        .pdv-juros-info, .pdv-liquido-info { font-size: 0.8rem; color: #64748b; margin-top: 0.35rem; }
        .pdv-finalize-actions { display: flex; gap: 0.75rem; margin-top: 1.25rem; flex-wrap: wrap; }
        .pdv-btn-finalize { padding: 0.9rem 1.75rem; font-size: 1.05rem; font-weight: 600; border-radius: 12px; border: none; background: linear-gradient(135deg, #10B981 0%, #059669 100%); color: #fff; cursor: pointer; transition: transform 0.2s; }
        .pdv-btn-finalize:hover { transform: scale(1.02); }
        .pdv-btn-clear { padding: 0.7rem 1.25rem; border-radius: 10px; border: 1px solid #e2e8f0; background: #fff; color: #64748b; cursor: pointer; font-size: 0.95rem; }
        .pdv-btn-clear:hover { background: #fef2f2; color: #dc2626; }
        .pdv-caixa-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
        .pdv-btn-sangria { padding: 0.5rem 1rem; border-radius: 8px; border: 1px solid #fecaca; background: #fef2f2; color: #b91c1c; font-size: 0.9rem; cursor: pointer; }
        .pdv-btn-sangria:hover { background: #fee2e2; }
        .pdv-btn-reforco { padding: 0.5rem 1rem; border-radius: 8px; border: 1px solid #bbf7d0; background: #f0fdf4; color: #15803d; font-size: 0.9rem; cursor: pointer; }
        .pdv-btn-reforco:hover { background: #dcfce7; }
        /* Modal PDV Produtos */
        .pdv-modal-produtos { max-width: 90vw; width: 720px; max-height: 85vh; display: flex; flex-direction: column; background: #fff; color: #1e293b; border-radius: 20px; box-shadow: 0 25px 50px rgba(0,0,0,0.15); }
        .pdv-modal-produtos-header { padding-bottom: 1rem; border-bottom: 1px solid #e2e8f0; margin-bottom: 1rem; }
        .pdv-modal-produtos-title-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.35rem; }
        .pdv-modal-produtos-header h2 { margin: 0; font-size: 1.35rem; color: #0f172a; }
        .pdv-modal-produtos-count { font-size: 0.85rem; color: #64748b; font-weight: 600; background: #f1f5f9; padding: 0.35rem 0.75rem; border-radius: 20px; }
        .pdv-modal-produtos-hint { margin: 0 0 0.75rem; font-size: 0.8rem; color: #94a3b8; }
        .pdv-modal-produtos-hint kbd { font-size: 0.75rem; padding: 0.15rem 0.4rem; background: #e2e8f0; border-radius: 4px; color: #475569; }
        .pdv-modal-produtos-header input { width: 100%; padding: 0.75rem 1rem; border-radius: 12px; border: 2px solid #e2e8f0; font-size: 1rem; margin-bottom: 0.5rem; transition: border-color 0.2s; }
        .pdv-modal-produtos-header input:focus { outline: none; border-color: var(--primary-blue); }
        .pdv-modal-categoria-label { display: block; font-size: 0.8rem; color: #64748b; margin: 0 0 0.35rem; font-weight: 600; }
        .pdv-modal-produtos-filters { display: flex; gap: 0.5rem; flex-wrap: wrap; width: 100%; }
        .pdv-modal-produtos-filters select,
        .pdv-modal-categoria-select { padding: 0.5rem 1rem; border-radius: 10px; border: 2px solid #e2e8f0; background: #fff; color: #334155; font-size: 0.9rem; min-width: 0; flex: 1 1 200px; }
        .pdv-modal-produtos-list { flex: 1; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.75rem; min-height: 120px; }
        .pdv-modal-prod-item { padding: 1rem; border-radius: 14px; border: 2px solid #e2e8f0; background: #f8fafc; cursor: pointer; transition: all 0.2s; text-align: left; }
        .pdv-modal-prod-item:hover { border-color: var(--primary-blue); background: rgba(0,212,255,0.08); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
        .pdv-modal-prod-item .name { font-weight: 600; color: #1e293b; margin-bottom: 0.25rem; display: block; line-height: 1.3; }
        .pdv-modal-prod-item .price { color: #059669; font-weight: 700; font-size: 1.05rem; }
        .pdv-modal-prod-item .code { font-size: 0.8rem; color: #94a3b8; margin-top: 0.2rem; display: block; }
        .pdv-modal-prod-empty { grid-column: 1 / -1; text-align: center; padding: 2.5rem 1rem; color: #64748b; }
        .pdv-modal-prod-empty-icon { font-size: 3rem; margin-bottom: 0.5rem; opacity: 0.5; }
        /* Modal PDV Qty */
        .pdv-modal-qty { max-width: 380px; background: #fff; color: #1e293b; }
        .pdv-modal-qty h2 { margin: 0 0 0.5rem; font-size: 1.2rem; }
        .pdv-modal-qty-sub { margin: 0 0 1.25rem; color: #64748b; font-size: 0.9rem; }
        .pdv-modal-qty-row { margin-bottom: 1rem; }
        .pdv-modal-qty-row label { display: block; font-size: 0.85rem; color: #64748b; margin-bottom: 0.35rem; }
        .pdv-modal-qty-row input { width: 100%; padding: 0.75rem; border-radius: 10px; border: 2px solid #e2e8f0; font-size: 1.1rem; }
        .pdv-modal-price-row input { font-weight: 600; }
        .pdv-modal-qty-btn { width: 100%; padding: 0.9rem; font-size: 1rem; margin-top: 0.5rem; }
        /* Modal PDV Valor manual */
        .pdv-modal-valor { max-width: 340px; background: #fff; color: #1e293b; }
        .pdv-modal-valor h2 { margin: 0 0 0.5rem; }
        .pdv-modal-valor-hint { margin: 0 0 1rem; color: #64748b; font-size: 0.9rem; }
        .pdv-modal-valor-display { font-size: 2rem; font-weight: 700; text-align: right; padding: 1rem; background: #f1f5f9; border-radius: 12px; margin-bottom: 1rem; color: #0f172a; display: block; width: 100%; box-sizing: border-box; border: 2px solid #e2e8f0; }
        .pdv-modal-valor-input:focus { outline: none; border-color: var(--primary-blue); }
        .pdv-calc-buttons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-bottom: 1rem; }
        .pdv-calc-btn { padding: 1rem; font-size: 1.25rem; font-weight: 600; border-radius: 10px; border: 2px solid #e2e8f0; background: #f8fafc; color: #334155; cursor: pointer; transition: all 0.15s; }
        .pdv-calc-btn:hover { background: #e2e8f0; border-color: #cbd5e1; }
        .pdv-calc-clear { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
        .pdv-modal-valor-desc { margin-bottom: 1rem; }
        .pdv-modal-valor-desc label { display: block; font-size: 0.85rem; color: #64748b; margin-bottom: 0.35rem; }
        .pdv-modal-valor-desc input { width: 100%; padding: 0.65rem; border-radius: 8px; border: 2px solid #e2e8f0; }
        .pdv-modal-valor-ok { width: 100%; padding: 0.9rem; font-size: 1rem; }
        .quote-step { display: none; }
        .quote-step.active { display: block; }
        .quote-step-indicator { font-size: 0.85rem; color: var(--text-gray); margin-top: 0.35rem; }
        .quote-wizard-actions { display: flex; gap: 0.75rem; justify-content: flex-end; margin-top: 1.5rem; flex-wrap: wrap; }
        .quote-wizard-actions .btn-secondary { padding: 0.7rem 1.2rem; background: rgba(255,255,255,0.1); color: var(--text-light); border: 1px solid rgba(255,255,255,0.2); border-radius: 8px; cursor: pointer; }

        .form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }

        .theme-btn {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            border: 3px solid transparent;
            cursor: pointer;
            transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
        }
        .theme-btn:hover { transform: scale(1.12); box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
        .theme-btn.active { border-color: #fff; box-shadow: 0 0 0 2px rgba(255,255,255,0.8); }
        .theme-option { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; }
        .theme-option span { font-size: 0.75rem; color: var(--text-gray); white-space: nowrap; }

        .form-section {
            background: rgba(255,255,255,0.02);
            border: 1px solid rgba(255,255,255,0.05);
            border-radius: 10px;
            padding: 1rem;
            margin-bottom: 1rem;
        }

        .config-buttons-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
        .config-menu-btn { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 1rem 1.25rem; border-radius: 12px; border: 1px solid rgba(255,255,255,0.15); background: rgba(255,255,255,0.06); color: var(--text-light); font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: all 0.2s; text-align: center; }
        .config-menu-btn:hover { background: rgba(0,212,255,0.15); border-color: var(--primary-blue); color: #fff; }

        .form-section h4 {
            color: var(--primary-blue);
            margin-bottom: 0.8rem;
            font-size: 0.9rem;
        }

        /* Página Pagamentos / Mensalidade - template atraente */
        .config-page-pagamentos .main-inner { max-width: 520px; }
        .config-pagamentos-nav { margin-bottom: 1.25rem; }
        .config-pagamentos-back {
            background: rgba(255,255,255,0.06); color: var(--text-light);
            border: 1px solid rgba(255,255,255,0.1); border-radius: 14px;
            padding: 0.7rem 1.1rem; font-size: 0.95rem; cursor: pointer;
            transition: background 0.2s, border-color 0.2s, color 0.2s;
        }
        .config-pagamentos-back:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.18); color: #fff; }
        .config-pagamentos-card {
            max-width: 100%;
            background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(15,20,35,0.6) 100%);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 24px;
            box-shadow: 0 20px 50px rgba(0,0,0,0.35), 0 0 0 1px rgba(34,197,94,0.08);
            overflow: hidden;
        }
        .config-pagamentos-hero {
            height: 6px;
            background: linear-gradient(90deg, #22C55E 0%, #16A34A 50%, #15803D 100%);
            opacity: 0.9;
        }
        .config-pagamentos-card-inner { padding: 2.25rem 2rem; }
        .config-pagamentos-badge {
            display: inline-block;
            font-size: 0.8rem;
            font-weight: 600;
            color: #22C55E;
            background: rgba(34,197,94,0.12);
            padding: 0.35rem 0.75rem;
            border-radius: 20px;
            margin-bottom: 0.75rem;
            letter-spacing: 0.02em;
        }
        .config-pagamentos-header { margin-bottom: 1.5rem; }
        .config-pagamentos-title { font-size: 1.85rem; font-weight: 700; margin: 0 0 0.4rem; color: #fff; letter-spacing: -0.03em; }
        .config-pagamentos-sub { margin: 0; font-size: 1rem; color: var(--text-gray); line-height: 1.5; }
        .config-pagamentos-status {
            margin-bottom: 1.5rem;
            padding: 1.35rem 1.5rem;
            background: rgba(255,255,255,0.04);
            border-radius: 18px;
            border: 1px solid rgba(255,255,255,0.06);
        }
        .config-pagamentos-status-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }
        .config-pagamentos-status-item { display: flex; flex-direction: column; gap: 0.25rem; }
        .config-pagamentos-status-label { font-size: 0.8rem; color: var(--text-gray); text-transform: uppercase; letter-spacing: 0.04em; }
        .config-pagamentos-status-value { font-size: 1.1rem; font-weight: 600; color: #fff; }
        .config-pagamentos-status-value.config-pagamentos-dia { font-size: 1rem; font-weight: 500; color: rgba(255,255,255,0.85); }
        @media (max-width: 480px) { .config-pagamentos-status-grid { grid-template-columns: 1fr; } }
        .config-pagamentos-box-online {
            padding: 2rem;
            background: linear-gradient(160deg, rgba(34,197,94,0.12) 0%, rgba(22,163,74,0.06) 100%);
            border: 1px solid rgba(34,197,94,0.25);
            border-radius: 20px;
            margin-bottom: 1.5rem;
            box-shadow: 0 8px 24px rgba(34,197,94,0.08);
        }
        .config-pagamentos-preco {
            font-size: 2rem;
            font-weight: 700;
            color: #fff;
            margin-bottom: 0.5rem;
            letter-spacing: -0.02em;
        }
        .config-pagamentos-preco span { font-size: 1rem; font-weight: 500; color: var(--text-gray); }
        .config-pagamentos-seguro {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 0.95rem;
            font-weight: 600;
            color: #4ADE80;
            margin-bottom: 0.6rem;
        }
        .config-pagamentos-lock { font-size: 1.1rem; }
        .config-pagamentos-desc {
            color: rgba(255,255,255,0.7);
            font-size: 0.9rem;
            margin: 0 0 1.5rem;
            line-height: 1.5;
        }
        .config-pagamentos-cta {
            width: 100%;
            padding: 1.15rem 1.5rem;
            font-size: 1.08rem;
            font-weight: 600;
            background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%) !important;
            border: none;
            border-radius: 16px;
            color: #fff;
            cursor: pointer;
            transition: transform 0.15s, box-shadow 0.2s;
            box-shadow: 0 4px 16px rgba(34,197,94,0.3);
        }
        .config-pagamentos-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 28px rgba(34,197,94,0.4);
        }
        .config-pagamentos-footer { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.08); }
        .config-pagamentos-whatsapp-btn {
            width: 100%;
            padding: 0.9rem 1.25rem;
            font-size: 1rem;
            background: #25D366;
            color: #fff;
            border: none;
            border-radius: 14px;
            cursor: pointer;
            font-weight: 500;
            transition: filter 0.2s, transform 0.15s;
        }
        .config-pagamentos-whatsapp-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
        .config-pagamentos-dados {
            padding: 1.25rem;
            background: rgba(255,255,255,0.04);
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,0.08);
            margin-bottom: 1rem;
        }
        .config-pagamentos-cartao { margin-bottom: 1rem; }
        .config-pagamentos-cartao-titulo { font-size: 0.9rem; font-weight: 600; margin: 0 0 0.5rem; }
        .config-pagamentos-details { margin-top: 1rem; border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; overflow: hidden; }
        .config-pagamentos-details summary { padding: 0.75rem 1rem; cursor: pointer; font-size: 0.9rem; color: var(--text-gray); list-style: none; }
        .config-pagamentos-details summary::-webkit-details-marker { display: none; }
        .config-pagamentos-details summary::before { content: '▸ '; }
        .config-pagamentos-details[open] summary::before { content: '▾ '; }
        .config-pagamentos-details .config-pagamentos-dados { margin: 0; border-radius: 0; border: none; border-top: 1px solid rgba(255,255,255,0.06); }
        .config-pagamentos-details .config-pagamentos-cartao { padding: 0 1rem 1rem; }

        /* Quote Items */
        .quote-item-row {
            display: flex;
            gap: 0.5rem;
            margin-bottom: 0.5rem;
            align-items: center;
        }

        .quote-item-row input {
            flex: 2;
            padding: 0.6rem;
            border: 1px solid rgba(0,0,0,0.2);
            border-radius: 6px;
            background: #ffffff;
            color: #000000;
        }

        .quote-item-row input.item-value { flex: 1; }

        .btn-remove-item {
            width: 28px;
            height: 28px;
            background: rgba(239,68,68,0.2);
            border: none;
            border-radius: 6px;
            color: #EF4444;
            font-size: 1rem;
            cursor: pointer;
            transition: all 0.2s;
        }

        .btn-remove-item:hover { background: rgba(239,68,68,0.3); }

        .btn-add-item {
            width: 100%;
            padding: 0.7rem;
            background: rgba(16,185,129,0.1);
            border: 2px dashed rgba(16,185,129,0.3);
            border-radius: 8px;
            color: var(--accent-green);
            font-weight: 600;
            cursor: pointer;
            transition: all 0.2s;
        }

        .btn-add-item:hover {
            background: rgba(16,185,129,0.2);
            border-color: var(--accent-green);
        }

        /* Calculations */
        .quote-calculations {
            background: rgba(0,212,255,0.05);
            border: 1px solid rgba(0,212,255,0.2);
            border-radius: 10px;
            padding: 1rem;
            margin: 1rem 0;
        }

        .calc-row {
            display: flex;
            justify-content: space-between;
            padding: 0.4rem 0;
            border-bottom: 1px solid rgba(255,255,255,0.05);
            font-size: 0.9rem;
        }

        .calc-row.total-row {
            font-size: 1.1rem;
            font-weight: 700;
            color: var(--primary-blue);
            border-bottom: none;
            padding-top: 0.6rem;
        }

        .discount-row input {
            width: 70px;
            padding: 0.25rem;
            border: 1px solid rgba(0,0,0,0.2);
            border-radius: 4px;
            background: #ffffff;
            color: #000000;
            text-align: center;
        }

        /* Company Select */
        .company-select {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            padding: 2rem;
            background: linear-gradient(135deg, #0A0E27 0%, #1a1f3a 100%);
        }

        .company-select h1 {
            margin-bottom: 2.5rem;
            font-size: 1.8rem;
            text-align: center;
        }

        .company-buttons {
            display: flex;
            gap: 1.5rem;
            flex-wrap: wrap;
            justify-content: center;
        }

        .company-btn {
            width: 260px;
            padding: 2rem;
            border: 2px solid;
            border-radius: 16px;
            background: rgba(255,255,255,0.02);
            cursor: pointer;
            transition: all 0.3s;
            text-align: center;
        }

        .company-btn.tech {
            border-color: var(--primary-blue);
            color: var(--primary-blue);
        }

        .company-btn.tech:hover {
            background: rgba(0,212,255,0.1);
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0,212,255,0.2);
        }

        .company-btn.car {
            border-color: var(--accent-orange);
            color: var(--accent-orange);
        }

        .company-btn.car:hover {
            background: rgba(255,107,53,0.1);
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(255,107,53,0.2);
        }

        .company-btn .icon { font-size: 3.5rem; margin-bottom: 0.8rem; }
        .company-btn h3 { font-size: 1.3rem; margin: 0; }
        .company-btn p { font-size: 0.85rem; margin: 0.4rem 0 0; opacity: 0.7; }

        /* ========== LOGIN – Layout como no print (duas colunas, limpo) ========== */
        .login-page {
            min-height: 100vh;
            display: grid;
            grid-template-columns: 1fr 1fr;
            align-items: stretch;
        }
        .login-page .login-left {
            background: #0c1220;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 3rem 3.5rem;
            position: relative;
        }
        .login-page .login-left .brand-wrap {
            position: relative;
            z-index: 1;
            max-width: 400px;
            text-align: center;
            animation: loginFloat 5s ease-in-out 1.2s infinite;
        }
        @keyframes loginFadeInUp {
            from { opacity: 0; transform: translateY(12px); }
            to { opacity: 1; transform: translateY(0); }
        }
        @keyframes loginFloat {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-8px); }
        }
        .login-page .login-left .brand {
            margin-bottom: 1.5rem;
            display: flex;
            justify-content: center;
            padding: 0.75rem 1rem;
            background: #0c1220;
            border-radius: 12px;
            animation: loginFadeInUp 0.8s ease-out;
        }
        .login-page .login-left .login-brand-img {
            max-height: 195px;
            max-width: 442px;
            width: auto;
            height: auto;
            object-fit: contain;
            display: block;
            mix-blend-mode: screen;
        }
        .login-page .login-left .brand-title {
            font-size: 1.95rem;
            font-weight: 700;
            color: #fff;
            margin-bottom: 0.75rem;
            letter-spacing: -0.02em;
            line-height: 1.2;
            animation: loginFadeInUp 0.8s ease-out 0.15s both;
        }
        .login-page .login-left .brand-desc {
            font-size: 1rem;
            color: rgba(255,255,255,0.65);
            max-width: 360px;
            margin: 0 auto;
            line-height: 1.6;
            font-weight: 400;
            animation: loginFadeInUp 0.8s ease-out 0.3s both;
        }
        .login-page .login-right {
            background: #0a0e18;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2.5rem 3rem;
            position: relative;
        }
        .login-card {
            width: 100%;
            max-width: 400px;
            background: rgba(255,255,255,0.05);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 16px;
            padding: 2.5rem 2.25rem;
            box-shadow: 0 20px 50px rgba(0,0,0,0.3);
            position: relative;
        }
        .login-card .logo {
            margin-bottom: 1.35rem;
            text-align: center;
            padding: 0.5rem;
            background: rgba(0,0,0,0.2);
            border-radius: 10px;
        }
        .login-card .login-card-logo-img {
            max-height: 52px;
            max-width: 130px;
            width: auto;
            height: auto;
            object-fit: contain;
            display: inline-block;
            mix-blend-mode: screen;
        }
        .login-card h1 {
            font-size: 1.5rem;
            text-align: center;
            color: #fff;
            margin-bottom: 0.3rem;
            font-weight: 700;
        }
        .login-card .login-sub {
            text-align: center;
            color: rgba(255,255,255,0.5);
            font-size: 0.875rem;
            margin-bottom: 1.75rem;
        }
        .login-card .form-group {
            margin-bottom: 1.35rem;
            position: relative;
        }
        .login-card .form-group label {
            display: block;
            font-size: 0.8rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
            color: rgba(255,255,255,0.85);
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }
        .login-card .form-group input {
            width: 100%;
            padding: 0.85rem 1rem;
            padding-right: 2.75rem;
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 10px;
            background: rgba(0,0,0,0.25);
            color: #fff;
            font-size: 1rem;
            transition: border-color 0.2s, background 0.2s;
        }
        .login-card .form-group input::placeholder { color: rgba(255,255,255,0.35); }
        .login-card .form-group input:focus {
            outline: none;
            border-color: rgba(0,212,255,0.5);
            background: rgba(0,0,0,0.3);
        }
        .login-card .form-group.input-error input { border-color: var(--accent-red); box-shadow: 0 0 0 2px rgba(239,68,68,0.2); }
        .login-card .password-wrap { position: relative; }
        .login-card .password-wrap input { padding-right: 2.75rem; }
        .login-card .btn-toggle-pwd {
            position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
            background: none; border: none; color: rgba(255,255,255,0.5); cursor: pointer;
            padding: 0.25rem; font-size: 1.1rem;
            transition: color 0.2s;
        }
        .login-card .btn-toggle-pwd:hover { color: rgba(255,255,255,0.9); }
        .login-card .login-options {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 1.5rem;
            flex-wrap: wrap;
            gap: 0.5rem;
        }
        .login-card .login-options label {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 0.85rem;
            color: rgba(255,255,255,0.6);
            cursor: pointer;
            margin: 0;
        }
        .login-card .login-options input[type=checkbox] { width: auto; margin: 0; }
        .login-card .login-forgot {
            font-size: 0.85rem;
            color: var(--primary-blue);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.2s, text-decoration 0.2s;
        }
        .login-card .login-forgot:hover { color: #5ce1ff; text-decoration: underline; }
        .login-card .btn-entrar {
            width: 100%;
            padding: 0.95rem 1.25rem;
            border: none;
            border-radius: 10px;
            background: var(--primary-blue);
            color: #fff;
            font-weight: 600;
            font-size: 1rem;
            cursor: pointer;
            transition: background 0.2s, opacity 0.2s;
        }
        .login-card .btn-entrar:hover { background: #00b8d9; opacity: 0.95; }
        .login-card .btn-entrar:active { opacity: 1; }
        .login-card .login-err {
            color: #fca5a5;
            font-size: 0.85rem;
            margin-top: 1rem;
            text-align: center;
            display: none;
            padding: 0.75rem 1rem;
            background: rgba(239,68,68,0.12);
            border: 1px solid rgba(239,68,68,0.25);
            border-radius: 10px;
        }
        .login-card .login-err.show { display: block; animation: shake 0.4s ease; }
        @keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-6px)} 75%{transform:translateX(6px)} }
        .login-card .login-cadastro-text { color: rgba(255,255,255,0.5); }
        .login-card .login-cadastro-link { color: var(--primary-blue); font-weight: 600; text-decoration: none; border-bottom: 1px solid transparent; transition: color 0.2s, border-color 0.2s; }
        .login-card .login-cadastro-link:hover { color: #5ce1ff; border-bottom-color: rgba(92,225,255,0.5); }
        .btn-indique-ganhe { width: 100%; padding: 0.75rem 1rem; background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%); color: #fff; border: none; border-radius: 10px; font-weight: 700; font-size: 0.95rem; cursor: pointer; transition: transform 0.15s, box-shadow 0.2s; }
        .btn-indique-ganhe:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(34,197,94,0.4); }

        /* ========== PÁGINA CADASTRO TRIAL – template profissional ========== */
        .trial-signup-page { min-height: 100vh; background: linear-gradient(165deg, #0A0E27 0%, #0d1230 40%, #151b3d 100%); display: flex; flex-direction: column; padding: 1.5rem 1rem; box-sizing: border-box; }
        .trial-signup-page.hidden { display: none !important; }
        .trial-signup-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.75rem; }
        .trial-signup-back { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.65rem 1.15rem; background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.9); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; text-decoration: none; font-size: 0.9rem; font-weight: 500; cursor: pointer; transition: background 0.2s, border-color 0.2s; }
        .trial-signup-back:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.2); color: #fff; }
        .trial-signup-logo { display: flex; align-items: center; gap: 0.5rem; }
        .trial-signup-logo img { height: 40px; width: auto; }
        .trial-signup-logo span { font-size: 1.35rem; font-weight: 700; color: #fff; letter-spacing: -0.02em; }
        .trial-signup-container { max-width: 900px; margin: 0 auto; width: 100%; flex: 1; }
        .trial-signup-hero { text-align: center; margin-bottom: 2.25rem; }
        .trial-signup-hero h1 { font-size: 1.9rem; font-weight: 800; color: #fff; margin: 0 0 0.6rem; letter-spacing: -0.03em; }
        .trial-signup-hero-sub { font-size: 1rem; color: rgba(255,255,255,0.72); margin: 0; line-height: 1.6; max-width: 520px; margin-left: auto; margin-right: auto; }
        .trial-signup-hero-sub strong { color: var(--accent-green); }
        .trial-signup-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 20px; padding: 1.85rem 2rem; margin-bottom: 1.5rem; box-shadow: 0 10px 44px rgba(0,0,0,0.28); }
        .trial-signup-section-title { font-size: 1.1rem; font-weight: 700; color: #fff; margin: 0 0 1.25rem; letter-spacing: -0.02em; }
        .trial-signup-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem 1.5rem; }
        .trial-signup-card .form-group { margin-bottom: 0; }
        .trial-signup-card .form-group label { display: block; font-size: 0.85rem; font-weight: 600; color: rgba(255,255,255,0.92); margin-bottom: 0.4rem; }
        .trial-signup-card .form-group .req { color: #f87171; }
        .trial-signup-card .form-group .opt { font-weight: 400; color: rgba(255,255,255,0.5); font-size: 0.8rem; }
        .trial-signup-card input[type="text"], .trial-signup-card input[type="email"], .trial-signup-card input[type="tel"], .trial-signup-card input[type="password"] { width: 100%; padding: 0.8rem 1.1rem; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); background: rgba(0,0,0,0.22); color: #fff; font-size: 0.95rem; box-sizing: border-box; }
        .trial-signup-card input::placeholder { color: rgba(255,255,255,0.38); }
        .trial-signup-card input:focus { outline: none; border-color: var(--primary-blue); box-shadow: 0 0 0 3px rgba(0,212,255,0.18); }
        .trial-signup-section-indicacao .trial-signup-indicacao-box { background: linear-gradient(135deg, rgba(34,197,94,0.1) 0%, rgba(22,163,74,0.06) 100%); border: 1px solid rgba(34,197,94,0.32); border-radius: 16px; padding: 1.2rem 1.4rem; margin-bottom: 0; }
        .trial-signup-section-indicacao .trial-signup-indicacao-box.has-code { border-color: rgba(34,197,94,0.5); background: linear-gradient(135deg, rgba(34,197,94,0.16) 0%, rgba(22,163,74,0.1) 100%); }
        .trial-signup-indicacao-box label { color: rgba(255,255,255,0.95); font-size: 0.9rem; font-weight: 600; }
        .trial-signup-indicacao-box input { background: rgba(0,0,0,0.25); border-radius: 12px; padding: 0.7rem 1rem; width: 100%; box-sizing: border-box; border: 1px solid rgba(255,255,255,0.12); color: #fff; font-size: 0.95rem; }
        .trial-signup-desconto-msg { display: none; margin-top: 0.75rem; padding: 0.75rem 1rem; background: rgba(34,197,94,0.18); border-radius: 12px; font-size: 0.9rem; color: #86efac; font-weight: 500; }
        .trial-signup-desconto-msg.show { display: block; }
        .trial-signup-preco-box { display: none; margin-top: 0.65rem; padding: 0.85rem 1.1rem; background: rgba(0,0,0,0.28); border-radius: 14px; font-size: 0.95rem; }
        .trial-signup-preco-box.show { display: block; }
        .trial-signup-preco-box .preco-original { text-decoration: line-through; color: rgba(255,255,255,0.5); margin-right: 0.5rem; font-size: 0.95rem; }
        .trial-signup-preco-box .preco-atual { font-weight: 800; color: var(--accent-green); font-size: 1.28rem; letter-spacing: -0.02em; }
        .trial-signup-validar-wrap { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-top: 0.6rem; }
        .trial-signup-btn-validar { padding: 0.6rem 1.25rem; border-radius: 12px; font-size: 0.9rem; font-weight: 600; cursor: pointer; background: rgba(0,212,255,0.2); color: var(--primary-blue); border: 1px solid rgba(0,212,255,0.4); transition: background 0.2s, border-color 0.2s; }
        .trial-signup-btn-validar:hover { background: rgba(0,212,255,0.3); border-color: var(--primary-blue); }
        .trial-signup-btn-validar:disabled { opacity: 0.6; cursor: not-allowed; }
        .trial-codigo-validacao-msg { font-size: 0.875rem; font-weight: 500; }
        .trial-codigo-validacao-msg.ok { color: var(--accent-green); }
        .trial-codigo-validacao-msg.err { color: #f87171; }
        .trial-signup-trial-cta { margin-bottom: 1.5rem; }
        .trial-signup-btn-trial { width: 100%; padding: 1.15rem 1.35rem; border-radius: 16px; font-size: 1.05rem; font-weight: 700; background: rgba(255,255,255,0.08); color: #fff; border: 1px solid rgba(255,255,255,0.2); cursor: pointer; transition: all 0.2s; }
        .trial-signup-btn-trial:hover { background: rgba(255,255,255,0.14); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.25); }
        .trial-signup-planos-intro { font-size: 0.95rem; font-weight: 600; color: rgba(255,255,255,0.9); margin: 0 0 1rem; }
        .trial-signup-planos-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; align-items: stretch; }
        .trial-signup-plano-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 20px; padding: 1.6rem 1.4rem; text-align: left; display: flex; flex-direction: column; box-shadow: 0 8px 34px rgba(0,0,0,0.22); transition: transform 0.2s, box-shadow 0.2s; }
        .trial-signup-plano-card:hover { transform: translateY(-3px); box-shadow: 0 14px 44px rgba(0,0,0,0.3); }
        .trial-signup-plano-card.trial-signup-plano-destaque { border-color: rgba(0,212,255,0.45); background: linear-gradient(180deg, rgba(0,212,255,0.1) 0%, rgba(0,212,255,0.03) 100%); box-shadow: 0 8px 38px rgba(0,212,255,0.12); }
        .trial-signup-plano-card.trial-signup-plano-pro { border-color: rgba(139,92,246,0.5); background: linear-gradient(180deg, rgba(139,92,246,0.1) 0%, rgba(139,92,246,0.03) 100%); box-shadow: 0 8px 38px rgba(139,92,246,0.12); }
        .trial-signup-plano-badge { font-size: 1.05rem; font-weight: 800; color: #fff; text-align: center; margin-bottom: 0.75rem; letter-spacing: -0.02em; text-transform: uppercase; letter-spacing: 0.04em; }
        .trial-signup-plano-preco-wrap { text-align: center; margin-bottom: 1rem; padding: 0.6rem 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
        .trial-signup-plano-preco-wrap .trial-signup-plano-preco { font-size: 1.85rem; font-weight: 800; color: #fff; display: inline; letter-spacing: -0.04em; line-height: 1.2; }
        .trial-signup-plano-periodo { font-size: 0.95rem; font-weight: 600; color: rgba(255,255,255,0.55); margin-left: 0.2rem; }
        .trial-signup-plano-desc-title { font-size: 0.8rem; font-weight: 700; color: rgba(255,255,255,0.7); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.6rem; }
        .trial-signup-plano-topicos { list-style: none; margin: 0 0 1.25rem; padding: 0; flex: 1; }
        .trial-signup-plano-topicos li { font-size: 0.88rem; color: rgba(255,255,255,0.88); line-height: 1.55; margin-bottom: 0.45rem; padding-left: 1.35rem; position: relative; }
        .trial-signup-plano-topicos li::before { content: ''; position: absolute; left: 0; top: 0.5em; width: 6px; height: 6px; background: rgba(0,212,255,0.7); border-radius: 50%; }
        .trial-signup-plano-destaque .trial-signup-plano-topicos li::before { background: var(--primary-blue); }
        .trial-signup-plano-pro .trial-signup-plano-topicos li::before { background: rgba(167,139,250,0.9); }
        .trial-signup-btn-plano { padding: 1rem 1.25rem; font-size: 1.05rem; font-weight: 700; margin-top: auto; border-radius: 14px; min-height: 52px; cursor: pointer; border: none; transition: all 0.2s; }
        .trial-signup-plano-card[data-plano="basic"] .trial-signup-btn-plano { background: rgba(255,255,255,0.14); color: #fff; }
        .trial-signup-plano-card[data-plano="basic"] .trial-signup-btn-plano:hover { background: rgba(255,255,255,0.22); transform: translateY(-1px); }
        .trial-signup-plano-card.trial-signup-plano-destaque .trial-signup-btn-plano { background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%); color: #0A0E27; box-shadow: 0 4px 22px rgba(0,212,255,0.35); }
        .trial-signup-plano-card.trial-signup-plano-destaque .trial-signup-btn-plano:hover { box-shadow: 0 6px 28px rgba(0,212,255,0.45); transform: translateY(-1px); }
        .trial-signup-plano-card.trial-signup-plano-pro .trial-signup-btn-plano { background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); color: #fff; box-shadow: 0 4px 22px rgba(139,92,246,0.35); }
        .trial-signup-plano-card.trial-signup-plano-pro .trial-signup-btn-plano:hover { box-shadow: 0 6px 28px rgba(139,92,246,0.45); transform: translateY(-1px); }
        .trial-signup-pro-indicacao { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,0.15); }
        .trial-signup-pro-indicacao-msg { font-size: 0.85rem; color: rgba(255,255,255,0.65); margin: 0 0 0.6rem; text-align: center; }
        .trial-signup-btn-indicacao { width: 100%; padding: 1rem 1.25rem; font-size: 1.05rem; font-weight: 700; border-radius: 14px; cursor: pointer; background: linear-gradient(135deg, rgba(34,197,94,0.4) 0%, rgba(22,163,74,0.32) 100%); color: #fff; border: 1px solid rgba(34,197,94,0.5); transition: all 0.2s; }
        .trial-signup-btn-indicacao:hover { background: linear-gradient(135deg, rgba(34,197,94,0.5) 0%, rgba(22,163,74,0.42) 100%); transform: translateY(-1px); box-shadow: 0 6px 24px rgba(34,197,94,0.3); }
        .trial-signup-footer-note { text-align: center; font-size: 0.85rem; color: rgba(255,255,255,0.5); margin-top: 1.5rem; line-height: 1.6; padding: 0 0.5rem; }
        @media (max-width: 900px) { .trial-signup-planos-grid { grid-template-columns: 1fr; } .trial-signup-container { max-width: 560px; } .trial-signup-form-grid { grid-template-columns: 1fr; } }
        @media (max-width: 600px) { .trial-signup-container { padding: 0; max-width: 100%; } .trial-signup-card { padding: 1.4rem 1.25rem; border-radius: 18px; } .trial-signup-plano-card { padding: 1.35rem 1.2rem; } .trial-signup-plano-preco-wrap .trial-signup-plano-preco { font-size: 1.6rem; } }
        /* Banner modo offline / sincronização */
        #offlineBanner { position: fixed; top: 0; left: 0; right: 0; z-index: 9999; padding: 0.6rem 1rem; text-align: center; font-size: 0.9rem; font-weight: 500; display: none; }
        #offlineBanner.offline { display: block; background: linear-gradient(90deg, #B45309 0%, #D97706 100%); color: #fff; box-shadow: 0 2px 12px rgba(0,0,0,0.3); }
        #offlineBanner.syncing { display: block; background: linear-gradient(90deg, #059669 0%, #10B981 100%); color: #fff; }
        #offlineBanner.synced { display: block; background: var(--primary-blue); color: #0A0E27; }
        .modal-afiliado .modal-header { margin-bottom: 1rem; }
        .modal-afiliado .form-group { margin-bottom: 1rem; }
        #afiliadoScreen { min-height: 100vh; background: var(--primary-dark); color: var(--text-white); padding: 1.5rem; }
        #afiliadoScreen.hidden { display: none !important; }
        .afiliado-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 1rem; }
        .afiliado-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
        .afiliado-stat-card { background: linear-gradient(135deg, rgba(0,212,255,0.15) 0%, rgba(10,14,39,0.9) 100%); border: 1px solid var(--primary-blue); border-radius: 12px; padding: 1rem; text-align: center; }
        .afiliado-stat-value { font-size: 1.5rem; font-weight: 700; color: var(--primary-blue); }
        .afiliado-stat-label { font-size: 0.8rem; color: var(--text-gray); margin-top: 0.25rem; }
        .afiliado-chart-wrap { background: rgba(0,0,0,0.2); border-radius: 12px; padding: 1rem; margin-bottom: 1.5rem; max-height: 280px; }
        .afiliado-table-wrap { overflow-x: auto; margin-bottom: 1.5rem; }
        .afiliado-table { width: 100%; border-collapse: collapse; }
        .afiliado-table th, .afiliado-table td { padding: 0.6rem; text-align: left; border-bottom: 1px solid rgba(255,255,255,0.1); }
        .afiliado-table th { color: var(--text-gray); font-weight: 600; }
        .afiliado-link-box { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; padding: 1rem; background: rgba(0,212,255,0.08); border-radius: 12px; border: 1px solid rgba(0,212,255,0.3); }
        .afiliado-qr { width: 120px; height: 120px; background: #fff; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
        .afiliado-qr img { max-width: 100%; max-height: 100%; }
        .afiliado-lead-quente { margin-top: 1rem; padding: 1rem; background: rgba(255,107,53,0.1); border: 1px solid var(--accent-orange); border-radius: 12px; }
        #welcomeModal .modal { max-width: 480px; text-align: center; padding: 2.5rem; background: linear-gradient(160deg, rgba(15,23,42,0.98) 0%, rgba(30,41,59,0.98) 100%); border: 1px solid rgba(0,212,255,0.25); box-shadow: 0 25px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.05); }
        .welcome-modal .welcome-modal-content { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
        .welcome-modal .welcome-title, .welcome-modal .welcome-text { text-align: center; }
        .welcome-modal .welcome-icon { font-size: 3.5rem; margin-bottom: 1rem; display: flex; justify-content: center; align-items: center; min-height: 90px; padding: 0.75rem; background: rgba(12,18,32,0.6); border-radius: 12px; }
        .welcome-modal .welcome-logo-img { max-height: 72px; max-width: 180px; width: auto; height: auto; object-fit: contain; mix-blend-mode: screen; display: block; }
        .welcome-modal .welcome-title { font-size: 1.6rem; color: #fff; margin-bottom: 0.5rem; font-weight: 700; letter-spacing: -0.02em; }
        .welcome-modal .welcome-text { color: rgba(255,255,255,0.75); font-size: 0.95rem; margin-bottom: 0; line-height: 1.5; }
        .welcome-modal #welcomeBtnEnter { display: none; }
        @media (max-width: 900px) {
            .login-page { grid-template-columns: 1fr; }
            .login-page .login-left { padding: 2.5rem 2rem; min-height: 200px; }
            .login-page .login-left .brand-wrap { max-width: 100%; }
            .login-page .login-left .brand-title { font-size: 1.5rem; }
            .login-page .login-left .brand-desc { display: none; }
            .login-page .login-left .login-brand-img { max-height: 133px; max-width: 332px; }
        }

        /* ========== PAINEL ADMIN (registro de clientes) ========== */
        #adminScreen { display: none; flex-direction: column; min-height: 100vh; overflow: hidden; background: linear-gradient(160deg, #0A0E27 0%, #0f1535 45%, #151b3d 100%); }
        #adminScreen.active { display: flex; }
        .admin-header {
            flex-shrink: 0; padding: 1rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,0.06);
            display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem;
            width: 100%;
            background: rgba(0,0,0,0.2);
        }
        .admin-body { display: flex; flex: 1; min-height: 0; overflow: hidden; }
        .admin-sidebar {
            flex-shrink: 0; width: 240px; background: rgba(0,0,0,0.25); border-right: 1px solid rgba(255,255,255,0.06);
            display: flex; flex-direction: column; padding: 1rem 0;
        }
        .admin-nav-btn {
            display: flex; align-items: center; gap: 0.65rem; width: 100%; padding: 0.75rem 1.25rem; border: none; background: transparent; color: var(--text-gray); font-size: 0.9rem; font-weight: 500; cursor: pointer; text-align: left; transition: background 0.2s, color 0.2s; border-left: 3px solid transparent;
        }
        .admin-nav-btn:hover { background: rgba(255,255,255,0.06); color: #fff; }
        .admin-nav-btn.active { background: rgba(0,212,255,0.12); color: var(--primary-blue); border-left-color: var(--primary-blue); }
        .admin-nav-btn .icon { font-size: 1.1rem; }
        .admin-main-inner { flex: 1; overflow-y: auto; padding: 1.5rem; }
        .admin-section-page { display: none; }
        .admin-section-page.active { display: block; }
        .admin-brand { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
        .admin-brand-icon { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; box-shadow: 0 4px 14px rgba(0,212,255,0.35); }
        .admin-brand-text { }
        .admin-header .admin-title { font-size: 1.5rem; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin: 0 0 0.15rem 0; }
        .admin-header .admin-subtitle { font-size: 0.85rem; color: var(--primary-blue); font-weight: 500; margin: 0; opacity: 0.95; }
        .btn-logout { padding: 0.55rem 1.1rem; background: rgba(239,68,68,0.15); color: #FCA5A5; border: 1px solid rgba(239,68,68,0.35); border-radius: 10px; font-weight: 600; cursor: pointer; font-size: 0.875rem; transition: background 0.2s, border-color 0.2s; }
        .btn-logout:hover { background: rgba(239,68,68,0.25); border-color: rgba(239,68,68,0.5); }
        .admin-container { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; flex: 1; min-height: 0; overflow-y: auto; padding-bottom: 3rem; }
        .admin-section { margin-top: 2.25rem; }
        .admin-section-title { font-size: 1.25rem; font-weight: 700; color: #fff; margin-bottom: 0.35rem; letter-spacing: -0.01em; display: flex; align-items: center; gap: 0.5rem; }
        .admin-section-desc { color: var(--text-gray); font-size: 0.9rem; margin-bottom: 1.25rem; line-height: 1.5; max-width: 720px; }
        .admin-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 16px; padding: 1.75rem; margin-bottom: 1.5rem; box-shadow: 0 4px 24px rgba(0,0,0,0.15); }
        .admin-card-empresas { border-radius: 18px; padding: 2rem; border: 1px solid rgba(255,255,255,0.1); }
        .admin-empresas-busca { margin-bottom: 1.25rem; }
        .admin-empresas-busca label { display: block; font-size: 0.9rem; font-weight: 600; color: var(--text-light); margin-bottom: 0.5rem; }
        .admin-input-empresas { padding: 0.85rem 1.1rem; border-radius: 12px; font-size: 0.95rem; border: 1px solid rgba(255,255,255,0.12); }
        .admin-form-row-empresas { gap: 1rem; margin-bottom: 1rem; }
        .admin-form-row-empresas .form-group { margin-bottom: 0; }
        .admin-empresas-btn-wrap { display: flex; align-items: flex-end; }
        .btn-add-empresas { padding: 0.85rem 1.5rem; border-radius: 12px; font-size: 0.95rem; font-weight: 600; }
        .admin-list-empresas .admin-list-item { border-radius: 14px; padding: 1.1rem 1.25rem; }
        .admin-recebimento-conferir { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,0.1); }
        .admin-recebimento-conferir-titulo { font-weight: 600; color: var(--text-light); margin: 0 0 0.5rem; font-size: 0.95rem; }
        .admin-recebimento-conferir-desc { color: var(--text-gray); font-size: 0.85rem; margin: 0 0 0.75rem; line-height: 1.45; }
        .admin-form-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
        .btn-add { padding: 0.65rem 1.25rem; background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%); color: #0A0E27; border: none; border-radius: 10px; font-weight: 700; cursor: pointer; font-size: 0.9rem; transition: transform 0.15s, box-shadow 0.2s; box-shadow: 0 2px 12px rgba(0,212,255,0.3); }
        .btn-add:hover { transform: translateY(-1px); box-shadow: 0 4px 18px rgba(0,212,255,0.4); }
        .admin-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.25rem; margin-bottom: 1.75rem; }
        .admin-dashboard-stats { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
        .admin-stat-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 14px; padding: 1.25rem; position: relative; overflow: hidden; }
        .admin-stat-card-alert { border-color: rgba(239,68,68,0.4); background: rgba(239,68,68,0.08); }
        .admin-stat-card-warn { border-color: rgba(245,158,11,0.4); background: rgba(245,158,11,0.08); }
        .admin-stat-card-ok { border-color: rgba(34,197,94,0.4); background: rgba(34,197,94,0.08); }
        .admin-dashboard-lists { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.25rem; margin-top: 1.5rem; }
        .admin-dashboard-box { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; padding: 1.25rem; }
        .admin-dashboard-box-title { font-size: 1rem; color: var(--text-light); margin: 0 0 0.35rem; font-weight: 600; }
        .admin-dashboard-box-desc { font-size: 0.8rem; color: var(--text-gray); margin: 0 0 0.75rem; line-height: 1.35; }
        .admin-dashboard-list { list-style: none; margin: 0; padding: 0; font-size: 0.9rem; max-height: 200px; overflow-y: auto; }
        .admin-dashboard-list li { padding: 0.5rem 0; border-bottom: 1px solid rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
        .admin-dashboard-list li:last-child { border-bottom: none; }
        .admin-dashboard-datas { margin-top: 1rem; }
        .admin-stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--primary-blue), transparent); opacity: 0.8; }
        .admin-stat-card .admin-stat-value { font-size: 1.75rem; font-weight: 800; color: var(--primary-blue); letter-spacing: -0.02em; margin: 0 0 0.2rem 0; line-height: 1.2; }
        .admin-stat-card .admin-stat-label { font-size: 0.8rem; color: var(--text-gray); font-weight: 500; margin: 0; text-transform: uppercase; letter-spacing: 0.04em; }
        .admin-stat-card .admin-stat-icon { font-size: 1.5rem; margin-bottom: 0.5rem; opacity: 0.9; }
        .admin-chart-wrap { height: 220px; max-height: 220px; position: relative; width: 100%; margin-top: 0.5rem; border-radius: 12px; background: rgba(0,0,0,0.15); padding: 0.75rem; }
        .admin-chart-wrap canvas { max-height: 100% !important; display: block; }
        .admin-chart-title { font-size: 0.9rem; color: var(--text-gray); margin-bottom: 0.5rem; font-weight: 600; }
        .admin-list { max-height: 380px; overflow-y: auto; }
        .admin-list-item { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.1rem; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; margin-bottom: 0.6rem; font-size: 0.9rem; flex-wrap: wrap; gap: 0.6rem; transition: background 0.15s, border-color 0.15s; }
        .admin-list-item:hover { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); }
        .admin-list-item span { color: var(--text-light); line-height: 1.45; }
        .btn-config { padding: 0.4rem 0.85rem; background: rgba(0,212,255,0.15); color: var(--primary-blue); border: 1px solid rgba(0,212,255,0.35); border-radius: 8px; cursor: pointer; font-size: 0.8rem; font-weight: 600; transition: background 0.15s; }
        .btn-config:hover { background: rgba(0,212,255,0.25); }
        .btn-remove { padding: 0.4rem 0.75rem; background: rgba(239,68,68,0.15); color: #FCA5A5; border: 1px solid rgba(239,68,68,0.3); border-radius: 8px; cursor: pointer; font-size: 0.8rem; font-weight: 600; }
        .btn-remove:hover { background: rgba(239,68,68,0.25); }
        .admin-list-item-assinante { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 0.75rem; }
        .admin-list-item-assinante .assinante-info { display: flex; flex-direction: column; gap: 0.25rem; flex: 1; min-width: 200px; }
        .admin-list-item-assinante .assinante-info strong { color: #fff; font-size: 1rem; }
        .admin-list-item-assinante .assinante-meta { font-size: 0.85rem; color: var(--text-gray); }
        .admin-list-item-assinante .assinante-actions { display: flex; gap: 0.5rem; flex-shrink: 0; }
        .banner-vencimentos { background: linear-gradient(135deg, rgba(245,158,11,0.2) 0%, rgba(239,68,68,0.1) 100%); border: 1px solid rgba(245,158,11,0.4); border-radius: 14px; padding: 1.1rem 1.5rem; margin-bottom: 1.5rem; }
        .banner-vencimento-empresa {
            display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem;
            background: linear-gradient(135deg, rgba(239,68,68,0.22) 0%, rgba(185,28,28,0.12) 100%);
            border: 1px solid rgba(239,68,68,0.45);
            border-radius: 12px;
            padding: 1rem 1.25rem;
            margin-bottom: 1rem;
        }
        .banner-vencimento-text { flex: 1; min-width: 200px; font-size: 0.95rem; color: rgba(255,255,255,0.95); }
        .banner-vencimento-btn {
            padding: 0.5rem 1rem; font-size: 0.9rem; font-weight: 600;
            background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%);
            color: #fff; border: none; border-radius: 8px; cursor: pointer;
            white-space: nowrap; transition: transform 0.15s, box-shadow 0.2s;
        }
        .banner-vencimento-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(34,197,94,0.4); }
        .banner-vencimento-btn:disabled { opacity: 0.8; cursor: not-allowed; transform: none; }
        .banner-vencimento-btn-link {
            padding: 0.5rem 1rem; font-size: 0.9rem; font-weight: 600;
            background: rgba(255,255,255,0.12); color: #fff;
            border-radius: 8px; text-decoration: none; white-space: nowrap;
            transition: background 0.2s;
        }
        .banner-vencimento-btn-link:hover { background: rgba(255,255,255,0.2); color: #fff; }
        /* Admin mobile: menu hamburger e sidebar colapsável */
        .admin-header-toggle { display: none; padding: 0.5rem; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: 10px; color: #fff; cursor: pointer; font-size: 1.25rem; align-items: center; justify-content: center; }
        .admin-header-toggle:focus { outline: none; }
        @media (max-width: 768px) {
            #adminScreen .admin-header { padding: 0.75rem 1rem; gap: 0.5rem; }
            #adminScreen .admin-header .admin-brand-icon { width: 36px; height: 36px; font-size: 1.1rem; }
            #adminScreen .admin-title { font-size: 1.15rem; }
            #adminScreen .admin-subtitle { font-size: 0.75rem; }
            #adminScreen .admin-header-toggle { display: flex; }
            #adminScreen .admin-body { position: relative; flex-direction: column; }
            #adminScreen .admin-sidebar {
                position: fixed; top: 0; left: 0; bottom: 0; z-index: 1000;
                width: 260px; max-width: 85vw;
                transform: translateX(-100%); transition: transform 0.25s ease;
                box-shadow: 4px 0 20px rgba(0,0,0,0.3);
            }
            #adminScreen.admin-sidebar-open .admin-sidebar { transform: translateX(0); }
            #adminScreen .admin-sidebar-overlay {
                display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 999;
            }
            #adminScreen.admin-sidebar-open .admin-sidebar-overlay { display: block; }
            #adminScreen .admin-main-inner { padding: 1rem; min-height: 0; }
            #adminScreen .admin-form-row { grid-template-columns: 1fr; }
            #adminScreen .admin-stats-grid { grid-template-columns: 1fr 1fr; }
            #adminScreen .admin-dashboard-lists { grid-template-columns: 1fr; }
            #adminScreen .admin-container { padding: 0 1rem; }
        }
        @media (max-width: 480px) {
            #adminScreen .admin-stats-grid { grid-template-columns: 1fr; }
            #adminScreen .admin-dashboard-box { padding: 1rem; }
        }
        .admin-input, .admin-select, .admin-textarea { width: 100%; padding: 0.75rem 1rem; border-radius: 10px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.06); color: #fff; font-size: 0.9rem; transition: border-color 0.2s, background 0.2s; }
        .admin-input:focus, .admin-select:focus, .admin-textarea:focus { outline: none; border-color: var(--primary-blue); background: rgba(255,255,255,0.08); }
        .admin-input::placeholder, .admin-textarea::placeholder { color: rgba(255,255,255,0.4); }
        .admin-form-group label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--text-gray); margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.03em; }
        .modal-overlay-admin { position: fixed; inset: 0; background: rgba(0,0,0,0.8); backdrop-filter: blur(4px); display: none; align-items: center; justify-content: center; z-index: 1000; padding: 1rem; }
        .modal-overlay-admin.active { display: flex; }
        .modal-box-admin { background: linear-gradient(160deg, #0f1535 0%, #0A0E27 100%); border: 1px solid rgba(255,255,255,0.12); border-radius: 20px; padding: 1.75rem; width: 100%; max-width: 440px; box-shadow: 0 24px 48px rgba(0,0,0,0.4); }
        .modal-box-admin.modal-box-editar-assinante { max-width: 560px; max-height: 90vh; overflow-y: auto; }
        .modal-box-admin h3 { margin-bottom: 1.25rem; color: var(--primary-blue); font-size: 1.2rem; font-weight: 700; }
        .modal-assinante-section { margin-bottom: 1.5rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .modal-assinante-section:last-of-type { border-bottom: none; }
        .modal-assinante-section-title { font-size: 0.95rem; font-weight: 700; color: rgba(255,255,255,0.9); margin: 0 0 0.75rem; }
        .modal-assinante-empresa-readonly { background: rgba(0,0,0,0.2); border-radius: 12px; padding: 1rem; }
        .modal-assinante-empresa-line { margin: 0.35rem 0; font-size: 0.9rem; color: rgba(255,255,255,0.85); }
        .modal-assinante-empresa-vazio { margin: 0; color: var(--text-gray); font-size: 0.9rem; }
        .modal-assinante-pagamentos-desc { font-size: 0.8rem; color: var(--text-gray); margin: 0 0 0.5rem; }
        .modal-assinante-pagamentos-table-wrap { max-height: 200px; overflow-y: auto; margin-top: 0.5rem; }
        .admin-secret { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,0.06); }
        .admin-secret-link { font-size: 0.85rem; color: var(--text-gray); cursor: pointer; user-select: none; padding: 0.5rem 0; display: inline-flex; align-items: center; gap: 0.4rem; border-radius: 8px; transition: color 0.2s; }
        .admin-secret-link:hover { color: var(--primary-blue); }
        .admin-secret-panel { display: none; margin-top: 1.5rem; }
        .admin-secret-panel.show { display: block; }
        .empty-msg { color: var(--text-gray); font-size: 0.9rem; padding: 1.5rem; text-align: center; }
        .btn-refresh-list { padding: 0.4rem 0.9rem; font-size: 0.85rem; background: rgba(255,255,255,0.08); color: var(--text-light); border: 1px solid rgba(255,255,255,0.15); border-radius: 8px; cursor: pointer; font-weight: 500; transition: background 0.2s; }
        .btn-refresh-list:hover { background: rgba(255,255,255,0.12); }

        .global-footer {
            position: fixed;
            bottom: 8px;
            left: 0;
            right: 0;
            text-align: center;
            font-size: 0.75rem;
            color: var(--text-gray);
            z-index: 9000;
            pointer-events: none;
        }

        /* PDV: página toda em tema claro quando estiver no PDV */
        body.pdv-page-light {
            background: #f1f5f9;
            color: #1e293b;
        }
        body.pdv-page-light .dashboard-layout {
            background: #f1f5f9;
        }
        /* Sidebar mantém a cor original da plataforma no PDV */
        body.pdv-page-light .main-content {
            background: #f1f5f9;
        }
        body.pdv-page-light .main-top-bar {
            border-bottom-color: #e2e8f0;
        }
        body.pdv-page-light .user-welcome-wrap #welcomeMessage {
            color: #334155;
        }
        body.pdv-page-light .user-avatar-wrap {
            background: #fff;
            border-color: #e2e8f0;
            color: #334155;
        }
        body.pdv-page-light .user-avatar-wrap:hover {
            background: #f8fafc;
        }
        body.pdv-page-light .user-avatar-wrap .no-photo {
            background: var(--primary-blue);
            color: #fff;
        }
        body.pdv-page-light .user-dropdown {
            background: #fff;
            border-color: #e2e8f0;
            box-shadow: 0 10px 30px rgba(0,0,0,0.12);
        }
        body.pdv-page-light .user-dropdown a {
            color: #334155;
        }
        body.pdv-page-light .user-dropdown a:hover {
            background: #f8fafc;
            color: #0f172a;
        }
        body.pdv-page-light .global-footer {
            color: #64748b;
        }
        body.pdv-page-light .content-header {
            border-bottom-color: #e2e8f0;
        }
        body.pdv-page-light .content-header h1 {
            color: #0f172a;
        }
        body.pdv-page-light .main-inner {
            background: transparent;
        }
        body.pdv-page-light select,
        body.pdv-page-light .pdv-vendedor-select,
        body.pdv-page-light .pdv-section select {
            background: #fff !important;
            color: #1e293b !important;
        }
        body.pdv-page-light .pdv-section select option {
            background: #fff !important;
            color: #1e293b !important;
        }

        /* PDV página única: esconde sidebar, barra superior e footer */
        body.pdv-standalone .sidebar { display: none !important; }
        body.pdv-standalone .main-top-bar { display: none !important; }
        body.pdv-standalone .global-footer { display: none !important; }
        body.pdv-standalone .main-content { margin-left: 0 !important; max-width: none !important; }
        body.pdv-standalone .main-inner { max-width: none; }
        body.pdv-standalone { overflow-x: hidden; }
        .pdv-return-bar { flex-shrink: 0; padding: 0.75rem 1rem; margin-bottom: 0.5rem; border-bottom: 1px solid #e2e8f0; display: flex; align-items: center; background: #f8fafc; }
        .pdv-btn-return { padding: 0.5rem 1rem; background: #fff; color: #334155; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: background 0.2s, box-shadow 0.2s; display: inline-flex; align-items: center; gap: 0.35rem; }
        .pdv-btn-return:hover { background: #f1f5f9; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }

        /* Invoice Print Styles */
        .invoice-print-container {
            background: white;
            color: #333;
            padding: 0;
            border-radius: 0;
        }

        /* Template A4 - Comprovante de venda avulsa (preview no modal) */
        .comprovante-a4 { max-width: 210mm; margin: 0 auto; background: #fff; color: #1e293b; font-family: 'Segoe UI', system-ui, Arial, sans-serif; padding: 1.5rem; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
        .comprovante-a4-header { padding-bottom: 1.25rem; border-bottom: 3px solid #0ea5e9; margin-bottom: 1.25rem; }
        .comprovante-a4-brand { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
        .comprovante-a4-logo { max-height: 56px; max-width: 160px; object-fit: contain; }
        .comprovante-a4-brand-text { flex: 1; min-width: 0; }
        .comprovante-a4-title { margin: 0; font-size: 1.5rem; font-weight: 700; color: #0f172a; }
        .comprovante-a4-subtitle { margin: 0.25rem 0 0; font-size: 0.95rem; color: #64748b; font-weight: 600; letter-spacing: 0.02em; }
        .comprovante-a4-info { margin-bottom: 1.25rem; }
        .comprovante-a4-info-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem 1.5rem; }
        .comprovante-a4-info-grid > div { display: flex; flex-direction: column; gap: 0.15rem; }
        .comprovante-a4-label { font-size: 0.75rem; color: #64748b; text-transform: uppercase; letter-spacing: 0.04em; }
        .comprovante-a4-value { font-size: 0.95rem; font-weight: 600; color: #334155; }
        .comprovante-a4-items { margin-bottom: 1rem; overflow-x: auto; }
        .comprovante-a4-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
        .comprovante-a4-th, .comprovante-a4-td { padding: 0.6rem 0.75rem; text-align: left; border-bottom: 1px solid #e2e8f0; }
        .comprovante-a4-th { background: #f8fafc; color: #475569; font-weight: 600; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; }
        .comprovante-a4-th-qty, .comprovante-a4-td-qty { text-align: center; width: 4rem; }
        .comprovante-a4-th:not(.comprovante-a4-th-name), .comprovante-a4-td:not(.comprovante-a4-td-name) { text-align: right; }
        .comprovante-a4-td-name { max-width: 280px; word-break: break-word; }
        .comprovante-a4-total-wrap { padding: 1rem 0.75rem; background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); border-radius: 10px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
        .comprovante-a4-total-label { font-size: 1rem; font-weight: 600; color: #0c4a6e; }
        .comprovante-a4-total-value { font-size: 1.5rem; font-weight: 800; color: #0369a1; }
        .comprovante-a4-footer { font-size: 0.75rem; color: #94a3b8; text-align: center; padding-top: 0.75rem; border-top: 1px solid #e2e8f0; }
        .comprovante-a4-footer p { margin: 0; }
        @media (max-width: 480px) {
            .comprovante-a4 { padding: 1rem; }
            .comprovante-a4-title { font-size: 1.25rem; }
            .comprovante-a4-info-grid { grid-template-columns: 1fr; }
            .comprovante-a4-th, .comprovante-a4-td { padding: 0.5rem 0.4rem; font-size: 0.85rem; }
            .comprovante-a4-total-value { font-size: 1.25rem; }
        }

        /* Modal comprovante: A4 preview + mobile */
        .comprovante-modal { max-width: min(95vw, 800px); max-height: 92vh; display: flex; flex-direction: column; overflow: hidden; }
        .comprovante-modal-actions { margin-bottom: 1rem; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; flex-shrink: 0; }
        .comprovante-modal-actions span { color: var(--text-gray); font-size: 0.85rem; margin-right: 0.25rem; }
        .comprovante-modal-content { background: #f8fafc; color: #333; padding: 1rem; border-radius: 12px; overflow: auto; flex: 1; min-height: 0; -webkit-overflow-scrolling: touch; }
        @media (max-width: 768px) {
            .comprovante-modal { max-width: 100%; max-height: 90vh; margin: 0.5rem; }
            .comprovante-modal-content { padding: 0.75rem; }
        }

        @media print {
            body * { visibility: hidden; }
            #invoicePrintable, #invoicePrintable * { visibility: visible; }
            #invoicePrintable {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                margin: 0;
                padding: 0;
            }
            .sidebar, .modal-overlay, .btn-voltar, .no-print { display: none !important; }
            .main-content { margin-left: 0 !important; }
        }

        .hidden { display: none !important; }
        #bloqueioMensalidadeVencida {
            display: none;
            position: absolute;
            left: 0; right: 0; top: 0; bottom: 0;
            background: rgba(10,14,39,0.97);
            z-index: 500;
            align-items: center;
            justify-content: center;
            padding: 2rem;
            text-align: center;
        }
        #bloqueioMensalidadeVencida.show { display: flex !important; }
        #bloqueioMensalidadeVencida .bloqueio-box {
            max-width: 420px;
            background: linear-gradient(160deg, rgba(30,41,59,0.98) 0%, rgba(15,23,42,0.98) 100%);
            border: 1px solid rgba(239,68,68,0.35);
            border-radius: 16px;
            padding: 2rem;
            box-shadow: 0 25px 60px rgba(0,0,0,0.5);
        }
        #bloqueioMensalidadeVencida .bloqueio-title { font-size: 1.35rem; color: #FCA5A5; margin-bottom: 0.75rem; font-weight: 700; }
        #bloqueioMensalidadeVencida .bloqueio-text { color: rgba(255,255,255,0.8); font-size: 0.95rem; line-height: 1.5; margin-bottom: 1.25rem; }
        #bloqueioMensalidadeVencida .bloqueio-btn { display: inline-block; padding: 0.75rem 1.5rem; background: var(--primary-blue); color: #fff; border-radius: 10px; font-weight: 600; text-decoration: none; margin-top: 0.5rem; cursor: pointer; border: none; font-size: 1rem; }
        #bloqueioMensalidadeVencida .bloqueio-btn:hover { opacity: 0.9; }

        /* Notification Toast */
        .toast {
            position: fixed;
            bottom: 20px;
            right: 20px;
            background: linear-gradient(135deg, #10B981 0%, #059669 100%);
            color: white;
            padding: 1rem 1.5rem;
            border-radius: 10px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            z-index: 9999;
            transform: translateX(150%);
            transition: transform 0.3s ease;
        }

        .toast.show { transform: translateX(0); }
        .toast.error { background: linear-gradient(135deg, #EF4444 0%, #DC2626 100%); }

        /* Responsive - mobile e tablet */
        @media (max-width: 768px) {
            .dashboard-layout { flex-direction: column; width: 100%; max-width: 100%; overflow-x: hidden; }
            .sidebar {
                width: 100%;
                max-width: 100%;
                position: relative;
                left: 0 !important;
                bottom: auto;
                max-height: 80vh;
                overflow: hidden;
                transition: max-height 0.3s ease, box-shadow 0.3s ease;
                border-right: none;
                border-bottom: 2px solid var(--primary-blue);
            }
            .sidebar.collapsed {
                max-height: 56px;
                width: 100%;
                padding: 0.5rem 1rem;
            }
            .sidebar.collapsed .nav-menu,
            .sidebar.collapsed .sidebar-footer { max-height: 0; overflow: hidden; opacity: 0; pointer-events: none; transition: opacity 0.25s ease; }
            .sidebar.collapsed .sidebar-header { margin-bottom: 0; padding-bottom: 0.5rem; border-bottom: none; }
            .sidebar:not(.collapsed) .nav-menu,
            .sidebar:not(.collapsed) .sidebar-footer { max-height: 500px; opacity: 1; }
            .sidebar-toggle .chevron-desktop { display: none !important; }
            .sidebar-toggle .chevron-mobile { display: inline !important; }
            .sidebar.collapsed .sidebar-toggle .chevron-mobile.chevron-collapse { display: none !important; }
            .sidebar.collapsed .sidebar-toggle .chevron-mobile.chevron-expand { display: inline !important; }
            .sidebar:not(.collapsed) .sidebar-toggle .chevron-mobile.chevron-expand { display: none !important; }
            .sidebar:not(.collapsed) .sidebar-toggle .chevron-mobile.chevron-collapse { display: inline !important; }
            /* No mobile: botão ocultar no topo direito da sidebar para não sobrepor "Sair da conta" */
            .sidebar-toggle { top: 1rem; bottom: auto; right: 1rem; left: auto; transform: none; }
            .sidebar.collapsed .sidebar-toggle { top: 50%; bottom: auto; transform: translateY(-50%); right: 0.5rem; }
            .sidebar { padding-bottom: max(1rem, env(safe-area-inset-bottom, 1rem)); }
            .sidebar-footer { padding-bottom: max(1rem, env(safe-area-inset-bottom, 1rem)); min-height: auto; display: flex; flex-direction: column; justify-content: flex-end; gap: 0.5rem; flex-shrink: 0; }
            .sidebar-footer .btn-voltar { flex-shrink: 0; min-height: 44px; }
            .sidebar-footer .btn-sync-dados { flex-shrink: 0; min-height: 44px; }
            .sidebar .nav-menu { flex: 1; min-height: 0; overflow-y: auto; }
            .main-content,
            .sidebar.collapsed + .main-content { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: 100% !important; padding: 1rem; margin-top: 0; max-height: none; min-height: auto; padding-bottom: 2.5rem; }
            body.sidebar-collapsed .modal-overlay { left: 0 !important; right: 0 !important; }
            .modal-overlay { left: 0 !important; right: 0 !important; }
            body { overflow-x: hidden; }
            .main-inner { margin-left: 0 !important; max-width: 100%; }
            .modal-overlay-admin { padding: 1rem; align-items: flex-start; padding-top: 2rem; }
            .modal-box-admin { max-width: 100%; }
            .stats-grid { grid-template-columns: 1fr; }
            .form-row { grid-template-columns: 1fr; }
            .admin-form-row { grid-template-columns: 1fr; }
            .admin-stats-grid { grid-template-columns: 1fr; }
            .admin-container { padding: 0 1rem; }
            .admin-header { padding: 1rem; flex-wrap: wrap; }
            .admin-header .admin-title { font-size: 1.2rem; }
            .login-card { padding: 2rem 1.5rem; }
            .login-page { padding: 1rem; }
            .content-header { flex-wrap: wrap; gap: 0.75rem; }
            .content-header h1 { font-size: 1.25rem; }
            .card-grid { grid-template-columns: 1fr; }
            .btn-primary { font-size: 0.85rem; padding: 0.6rem 1rem; }
            .toast { left: 1rem; right: 1rem; bottom: 4rem; }
            .global-footer { font-size: 0.7rem; bottom: 4px; }
            /* PDV: modal catálogo — touch e coluna única no mobile */
            .modal.pdv-modal-produtos {
                width: 100% !important;
                max-width: 100% !important;
                max-height: calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 1rem) !important;
                margin: 0 !important;
                border-radius: 16px 16px 0 0 !important;
            }
            .pdv-modal-produtos-header input { font-size: 16px; }
            .pdv-modal-categoria-label { font-size: 0.85rem; }
            .pdv-modal-produtos-filters { flex-direction: column; align-items: stretch; }
            .pdv-modal-produtos-filters select,
            .pdv-modal-categoria-select {
                width: 100%;
                max-width: 100%;
                min-height: 44px;
                font-size: 16px;
                flex: none;
                -webkit-appearance: none;
                appearance: none;
            }
            .pdv-modal-produtos-list {
                grid-template-columns: 1fr 1fr;
                gap: 0.5rem;
            }
            .pdv-modal-prod-item { padding: 0.75rem; min-height: 44px; touch-action: manipulation; }
        }
        @media (max-width: 480px) {
            .pdv-modal-produtos-list { grid-template-columns: 1fr; }
            .stat-card { padding: 1rem; }
            .stat-value { font-size: 1.35rem; }
            .card { padding: 1rem; }
        }
        @media print {
            .global-footer { display: none !important; }
        }
        body { padding-bottom: 28px; }