﻿        /* ========== APPLE MINIMALIST THEME ========== */
        *, *::before, *::after { box-sizing: border-box; }

        body {
            background: #f5f5f7;
            color: #1d1d1f;
            font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
            margin: 0;
            -webkit-font-smoothing: antialiased;
        }

        .container {
            max-width: 1060px;
            margin: 0 auto;
            padding: 40px 48px 60px;
        }

        /* --- Tabs com slider animado --- */
        .tabs {
            display: flex;
            gap: 4px;
            margin-bottom: 36px;
            background: #e8e8ed;
            border-radius: 12px;
            padding: 3px;
            width: fit-content;
            position: relative;
        }
        .tab-slider {
            position: absolute;
            top: 3px;
            height: calc(100% - 6px);
            background: #fff;
            border-radius: 10px;
            box-shadow: 0 1px 4px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
            transition: left .3s cubic-bezier(.4, 0, .2, 1), width .3s cubic-bezier(.4, 0, .2, 1);
            z-index: 0;
        }
        .tab {
            padding: 10px 24px;
            cursor: pointer;
            border-radius: 10px;
            color: #6e6e73;
            font-size: .9rem;
            font-weight: 500;
            transition: color .2s ease, font-weight .2s ease;
            user-select: none;
            position: relative;
            z-index: 1;
        }
        .tab:hover { color: #1d1d1f; }
        .tab.active {
            color: #1d1d1f;
            font-weight: 600;
        }

        /* --- Typography --- */
        h2 {
            color: #1d1d1f;
            font-size: 1.6rem;
            font-weight: 700;
            letter-spacing: -0.02em;
            margin: 0 0 24px 0;
        }
        .form-section {
            grid-column: 1/3;
            font-size: .8rem;
            font-weight: 600;
            color: #86868b;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            padding: 8px 0 0 0;
            border-top: 1px solid #e8e8ed;
            margin-top: 4px;
        }
        label {
            display: block;
            font-size: .82rem;
            font-weight: 500;
            color: #6e6e73;
            margin: 0 0 6px 0;
        }
        .obrig { color: #ff3b30; margin-left: 3px; font-size: .85em; font-weight: 600; }

        /* --- Inputs --- */
        input, select, textarea {
            background: #fff;
            color: #1d1d1f;
            border: 1px solid #d2d2d7;
            font-size: .95rem;
            padding: 10px 14px;
            border-radius: 10px;
            transition: border-color .2s, box-shadow .2s;
            outline: none;
            font-family: inherit;
            width: 100%;
        }
        input:focus, select:focus, textarea:focus {
            border-color: #0071e3;
            box-shadow: 0 0 0 3px rgba(0,113,227,.15);
        }
        textarea { min-height: 100px; font-family: 'SF Mono', Consolas, monospace; font-size: .85rem; line-height: 1.5; }
        .filexml { width: auto; display: inline-block; font-size: .9rem; padding: 6px 14px; }
        .erro { border-color: #ff3b30 !important; background: #fff5f5 !important; }

        /* --- Buttons --- */
        .btn {
            background: #0071e3;
            color: #fff;
            padding: 11px 24px;
            border: none;
            border-radius: 10px;
            font-size: .9rem;
            font-weight: 600;
            cursor: pointer;
            transition: all .2s ease;
            font-family: inherit;
        }
        .btn:hover { background: #0077ed; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,113,227,.25); }
        .btn:active { transform: translateY(0); }
        .btn-mini { padding: 8px 16px; font-size: .85rem; margin: 0; }
        .btn-secondary { background: #e8e8ed; color: #1d1d1f; }
        .btn-secondary:hover { background: #dddde1; box-shadow: none; }
        .btn-excel { background: #34c759; color: #fff; }
        .btn-excel:hover { background: #30b855; box-shadow: 0 4px 12px rgba(52,199,89,.25); }
        .btn-enviar { background: #1d1d1f; color: #fff; }
        .btn-enviar:hover { background: #333; box-shadow: 0 4px 16px rgba(0,0,0,.2); }
        .btn-danger { background: #ff3b30; color: #fff; }
        .btn-danger:hover { background: #e8352b; }

        /* --- Cards / Panels --- */
        .card {
            background: #fff;
            border-radius: 16px;
            padding: 28px 32px;
            box-shadow: 0 1px 3px rgba(0,0,0,.04), 0 1px 2px rgba(0,0,0,.02);
            margin-bottom: 20px;
        }

        /* --- Forms --- */
        form.remetente-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 28px; max-width: 680px; margin-bottom: 24px; }
        .api-config-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 28px; max-width: 680px; margin-bottom: 24px; }
        .api-config-grid .full { grid-column: 1/3; }

        /* --- Table --- */
        .tablewrap { max-width: 100%; overflow-x: auto; margin-top: 20px; max-height: 480px; overflow-y: auto; border-radius: 12px; border: 1px solid #e8e8ed; }
        table { border-collapse: collapse; width: 100%; background: #fff; }
        th, td { border-bottom: 1px solid #f0f0f2; padding: 10px 10px; font-size: .88rem; text-align: left; vertical-align: middle; }
        th { background: #fafafa; color: #6e6e73; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; position: sticky; top: 0; z-index: 1; border-bottom: 1px solid #e8e8ed; }
        tr:hover { background: #f5f5f7; }
        td input { border: 1px solid transparent; background: transparent; padding: 6px 8px; border-radius: 8px; font-size: .88rem; color: #1d1d1f; }
        td select { border: 1px solid #d2d2d7; background: #fff; padding: 6px 8px; border-radius: 8px; font-size: .85rem; color: #1d1d1f; -webkit-appearance: auto; appearance: auto; width: auto; }
        td input:focus, td select:focus { border-color: #0071e3; background: #fff; box-shadow: 0 0 0 2px rgba(0,113,227,.12); }

        /* --- Actions bar --- */
        .actions { margin-top: 20px; display: flex; gap: 12px; margin-bottom: 24px; align-items: center; flex-wrap: wrap; }
        .panel-lote { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
        .panel-lote label { margin: 0; white-space: nowrap; }
        .panel-lote select { width: auto; }

        /* --- Alerts --- */
        .success { color: #34c759; font-weight: 600; margin-top: 12px; font-size: .9rem; }
        .msg-erro { background: #fff5f5; color: #1d1d1f; border: 1px solid #fecdd3; font-weight: 500; padding: 16px 20px; border-radius: 12px; margin: 20px 0 16px 0; position: relative; font-size: .9rem; }
        .msg-erro .fechar { background: transparent; border: none; color: #ff3b30; font-weight: bold; position: absolute; top: 10px; right: 16px; font-size: 1.4em; cursor: pointer; }
        .api-status { padding: 12px 16px; border-radius: 12px; margin: 16px 0; font-weight: 600; font-size: .9rem; white-space: pre-wrap; line-height: 1.6; }
        .api-status.ok { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
        .api-status.fail { background: #fff5f5; color: #dc2626; border: 1px solid #fecdd3; }
        .api-status.loading { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }

        /* --- Log --- */
        .envio-log { background: #1d1d1f; color: #a1a1a6; margin-top: 16px; padding: 20px; border-radius: 12px; font-family: 'SF Mono', Consolas, monospace; font-size: .82rem; max-height: 280px; overflow-y: auto; white-space: pre-wrap; line-height: 1.6; }
        .preview { background: #1d1d1f; color: #a1a1a6; margin-top: 24px; padding: 20px; border-radius: 12px; font-family: 'SF Mono', Consolas, monospace; font-size: .85rem; white-space: pre-wrap; }

        /* --- Excel paste area --- */
        .excel-area { margin-bottom: 16px; background: #fafafa; padding: 20px; border-radius: 12px; border: 2px dashed #d2d2d7; }
        .excel-instr { font-size: .85rem; color: #86868b; margin-bottom: 12px; display: block; line-height: 1.5; }

        /* --- ADM --- */
        .adm-panel { max-width: 830px; margin: 0; }
        .adm-title { font-size: 1.6rem; color: #1d1d1f; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 28px; }
        .adm-services { display: flex; flex-wrap: wrap; gap: 16px; }
        .adm-card { min-width: 220px; max-width: 310px; background: #fafafa; padding: 20px; border-radius: 14px; border: 1px solid #e8e8ed; position: relative; margin-bottom: 12px; flex: 1 0 220px; display: flex; flex-direction: column; gap: 8px; }
        .adm-card label { font-size: .82rem; color: #6e6e73; }
        .adm-card input { width: 100%; }
        .adm-del { background: #ff3b30; color: #fff; border: none; border-radius: 8px; padding: 3px 10px; position: absolute; right: 10px; top: 10px; cursor: pointer; font-size: 1.1em; transition: background .15s; }
        .adm-del:hover { background: #e8352b; }
        .adm-add { margin: 8px 0 0 0; display: inline-block; }

        /* --- Badge / Footer --- */
        .badge-api { display: inline-block; background: #34c759; color: #fff; font-size: .65rem; padding: 2px 8px; border-radius: 8px; margin-left: 6px; vertical-align: middle; font-weight: 600; letter-spacing: .02em; }
        .footer-credit { text-align: center; margin-top: 32px; padding-bottom: 24px; font-size: .78rem; color: #86868b; }

        /* --- Toolbar compacta --- */
        .toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
        .toolbar-group { display: flex; gap: 1px; background: #e8e8ed; border-radius: 10px; overflow: hidden; }
        .toolbar-group .tbtn { background: #fff; color: #1d1d1f; border: none; padding: 8px 16px; font-size: .82rem; font-weight: 500; cursor: pointer; transition: background .15s; font-family: inherit; }
        .toolbar-group .tbtn:hover { background: #f0f0f2; }
        .toolbar-sep { width: 1px; height: 24px; background: #d2d2d7; margin: 0 4px; }
        .send-bar { display: flex; gap: 12px; align-items: center; margin-top: 20px; justify-content: flex-end; }

        /* --- Dark mode toggle --- */
        .theme-toggle { position: fixed; top: 16px; right: 20px; z-index: 100; background: #e8e8ed; border: none; cursor: pointer; font-size: 1.1rem; padding: 8px; border-radius: 50%; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; transition: background .2s; color: #1d1d1f; }
        .theme-toggle:hover { background: #d2d2d7; }
        [data-theme="dark"] .theme-toggle { background: #2c2c2e; color: #f5f5f7; }
        [data-theme="dark"] .theme-toggle:hover { background: #3a3a3c; }

        /* ========== DARK MODE ========== */
        [data-theme="dark"] body { background: #000; color: #f5f5f7; }
        [data-theme="dark"] h2 { color: #f5f5f7; }
        [data-theme="dark"] .container { }
        [data-theme="dark"] .tabs { background: #1c1c1e; }
        [data-theme="dark"] .tab { color: #8e8e93; }
        [data-theme="dark"] .tab:hover { color: #f5f5f7; }
        [data-theme="dark"] .tab.active { color: #f5f5f7; }
        [data-theme="dark"] .tab-slider { background: #2c2c2e; box-shadow: none; }
        [data-theme="dark"] .form-section { color: #8e8e93; border-top-color: #2c2c2e; }
        [data-theme="dark"] label { color: #8e8e93; }
        [data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea { background: #1c1c1e; color: #f5f5f7; border-color: #3a3a3c; }
        [data-theme="dark"] input:focus, [data-theme="dark"] select:focus, [data-theme="dark"] textarea:focus { border-color: #0a84ff; box-shadow: 0 0 0 3px rgba(10,132,255,.2); }
        [data-theme="dark"] .card { background: #1c1c1e; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
        [data-theme="dark"] .btn { background: #0a84ff; }
        [data-theme="dark"] .btn:hover { background: #409cff; box-shadow: 0 4px 12px rgba(10,132,255,.3); }
        [data-theme="dark"] .btn-secondary { background: #2c2c2e; color: #f5f5f7; }
        [data-theme="dark"] .btn-secondary:hover { background: #3a3a3c; }
        [data-theme="dark"] .btn-enviar { background: #f5f5f7; color: #000; }
        [data-theme="dark"] .btn-enviar:hover { background: #e5e5e7; box-shadow: 0 4px 16px rgba(255,255,255,.1); }
        [data-theme="dark"] .btn-danger { background: #ff453a; }
        [data-theme="dark"] .btn-excel { background: #30d158; }
        [data-theme="dark"] .tablewrap { border-color: #2c2c2e; }
        [data-theme="dark"] table { background: #1c1c1e; }
        [data-theme="dark"] th { background: #2c2c2e; color: #8e8e93; border-bottom-color: #3a3a3c; }
        [data-theme="dark"] th, [data-theme="dark"] td { border-bottom-color: #2c2c2e; }
        [data-theme="dark"] tr:hover { background: #2c2c2e; }
        [data-theme="dark"] td input { color: #f5f5f7; background: transparent; }
        [data-theme="dark"] td select { color: #f5f5f7; background: #2c2c2e; border-color: #3a3a3c; }
        [data-theme="dark"] td input:focus, [data-theme="dark"] td select:focus { border-color: #0a84ff; background: #1c1c1e; box-shadow: 0 0 0 2px rgba(10,132,255,.15); }
        [data-theme="dark"] .toolbar-group { background: #2c2c2e; }
        [data-theme="dark"] .toolbar-group .tbtn { background: #1c1c1e; color: #f5f5f7; }
        [data-theme="dark"] .toolbar-group .tbtn:hover { background: #2c2c2e; }
        [data-theme="dark"] .toolbar-sep { background: #3a3a3c; }
        [data-theme="dark"] .panel-lote select { background: #1c1c1e; color: #f5f5f7; border-color: #3a3a3c; }
        [data-theme="dark"] .msg-erro { background: #3a1c1c; color: #f5f5f7; border-color: #5c2c2c; }
        [data-theme="dark"] .api-status.ok { background: #1a2e1a; color: #30d158; border-color: #2a4a2a; }
        [data-theme="dark"] .api-status.fail { background: #3a1c1c; color: #ff453a; border-color: #5c2c2c; }
        [data-theme="dark"] .api-status.loading { background: #1a2a3a; color: #0a84ff; border-color: #2a3a5c; }
        [data-theme="dark"] .envio-log { background: #1c1c1e; color: #8e8e93; }
        [data-theme="dark"] .preview { background: #1c1c1e; color: #8e8e93; }
        [data-theme="dark"] .excel-area { background: #1c1c1e; border-color: #3a3a3c; }
        [data-theme="dark"] .excel-instr { color: #8e8e93; }
        [data-theme="dark"] .adm-card { background: #2c2c2e; border-color: #3a3a3c; }
        [data-theme="dark"] .footer-credit { color: #48484a; }
        [data-theme="dark"] .theme-toggle:hover { background: rgba(255,255,255,.08); }
        [data-theme="dark"] .erro { border-color: #ff453a !important; background: #3a1c1c !important; }
        [data-theme="dark"] .obrig { color: #ff453a; }
        [data-theme="dark"] .badge-api { background: #30d158; }

        .hidden { display: none; }
