:root { color-scheme: light; }
html.dark { color-scheme: dark; }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }

/* Local Tailwind fallback. Production can render correctly even when CDN assets are blocked. */
*, ::before, ::after { box-sizing:border-box; }
body { margin:0; background:#f8fafc; color:#0f172a; }
a { color:inherit; text-decoration:none; }
img, svg, video, canvas { display:block; max-width:100%; }
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
table { border-collapse:collapse; border-spacing:0; width:100%; }

.min-h-screen{min-height:100vh}.min-w-0{min-width:0}.min-w-full{min-width:100%}.w-full{width:100%}.h-4{height:1rem}.w-4{width:1rem}.h-5{height:1.25rem}.w-5{width:1.25rem}.h-7{height:1.75rem}.w-7{width:1.75rem}.h-10{height:2.5rem}.w-10{width:2.5rem}.h-16{height:4rem}.w-16{width:4rem}.h-80{height:20rem}.h-96{height:24rem}
.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.block{display:block}.hidden{display:none}
.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.flex-wrap{flex-wrap:wrap}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.place-items-center{place-items:center}
.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.space-y-2>*+*{margin-top:.5rem}.space-y-3>*+*{margin-top:.75rem}.space-y-4>*+*{margin-top:1rem}.space-y-5>*+*{margin-top:1.25rem}.space-y-6>*+*{margin-top:1.5rem}
.mx-auto{margin-left:auto;margin-right:auto}.ml-auto{margin-left:auto}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}
.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}
.border{border-width:1px;border-style:solid}.border-b{border-bottom-width:1px;border-bottom-style:solid}.border-slate-200{border-color:#e2e8f0}.border-slate-300{border-color:#cbd5e1}
.bg-white{background:#fff}.bg-white\/95{background:rgba(255,255,255,.95)}.bg-slate-50{background:#f8fafc}.bg-slate-100{background:#f1f5f9}.bg-indigo-50{background:#eef2ff}.bg-indigo-100{background:#e0e7ff}.bg-slate-950{background:#020617}
.text-white{color:#fff}.text-slate-900{color:#0f172a}.text-slate-800{color:#1e293b}.text-slate-700{color:#334155}.text-slate-600{color:#475569}.text-slate-500{color:#64748b}.text-slate-400{color:#94a3b8}.text-indigo-500{color:#6366f1}.text-indigo-600{color:#4f46e5}.text-indigo-700{color:#4338ca}.text-emerald-300{color:#6ee7b7}.text-emerald-500{color:#10b981}.text-emerald-600{color:#059669}.text-rose-600{color:#e11d48}
.text-center{text-align:center}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-tight{letter-spacing:-.025em}.leading-tight{line-height:1.25}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.object-contain{object-fit:contain}.overflow-x-auto{overflow-x:auto}.relative{position:relative}.sticky{position:sticky}.top-0{top:0}.z-20{z-index:20}.shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}.backdrop-blur{backdrop-filter:blur(8px)}
.max-w-screen-2xl{max-width:1536px}.display{width:100%}.no-sort{}
.hover\:bg-slate-100:hover{background:#f1f5f9}.hover\:text-slate-950:hover{color:#020617}.hover\:underline:hover{text-decoration:underline}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (min-width:640px){.sm\:flex-row{flex-direction:row}.sm\:items-start{align-items:flex-start}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}}
@media (min-width:1024px){.lg\:flex{display:flex}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:col-span-2{grid-column:span 2/span 2}.lg\:px-8{padding-left:2rem;padding-right:2rem}}
@media (min-width:1280px){.xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xl\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* === Dark mode === */
html.dark body { background:#0f172a; color:#e2e8f0; }
html.dark .bg-slate-50 { background:#0f172a !important; }
html.dark .bg-white { background:#1e293b !important; }
html.dark .bg-white\/95 { background:rgba(30,41,59,.95) !important; }
html.dark .border-slate-200 { border-color:#334155 !important; }
html.dark .text-slate-900, html.dark .text-slate-800 { color:#e2e8f0 !important; }
html.dark .text-slate-700 { color:#cbd5e1 !important; }
html.dark .text-slate-600 { color:#94a3b8 !important; }
html.dark .text-slate-500 { color:#94a3b8 !important; }
html.dark .text-slate-400 { color:#64748b !important; }
html.dark aside, html.dark header { background:#1e293b !important; border-color:#334155 !important; }
html.dark .card { background:#1e293b; border-color:#334155; }
html.dark .card-header { border-color:#334155; }
html.dark .form-input, html.dark .select2-container--default .select2-selection--single, html.dark .select2-container--default .select2-selection--multiple {
    background:#0f172a; border-color:#334155; color:#e2e8f0;
}
html.dark .form-input::placeholder { color:#64748b; }
html.dark .form-label { color:#cbd5e1; }
html.dark .btn-secondary { background:#0f172a; color:#e2e8f0; border-color:#334155; }
html.dark .btn-secondary:hover { background:#334155; }
html.dark table.dataTable thead th { background:#0f172a; color:#94a3b8; }
html.dark table.dataTable tbody tr:hover { background:#0f172a; }
html.dark .dt-search input, html.dark .dt-length select { background:#0f172a; border-color:#334155; color:#e2e8f0; }
html.dark .badge { background:#0f172a; color:#e2e8f0; }
html.dark .badge-success { background:rgba(16,185,129,.15); color:#34d399; }
html.dark .badge-failed { background:rgba(239,68,68,.15); color:#fca5a5; }
html.dark .badge-warn { background:rgba(245,158,11,.15); color:#fbbf24; }
html.dark .badge-deferred { background:rgba(148,163,184,.18); color:#cbd5e1; }
html.dark .rounded-lg.bg-slate-50 { background:#0f172a !important; }
html.dark .js-dropzone.dropzone { background:#0f172a; border-color:#334155; }
html.dark pre { background:#020617 !important; }
html.dark .select2-dropdown { background:#1e293b; border-color:#334155; color:#e2e8f0; }
html.dark .select2-container--default .select2-results__option { color:#e2e8f0; }
html.dark .select2-container--default .select2-selection--single .select2-selection__rendered { color:#e2e8f0; }

/* DataTables overrides to fit tailwind look */
table.dataTable thead th { background:#f8fafc; color:#64748b; font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; }
table.dataTable tbody tr:hover { background:#f1f5f9; }
.dt-search input, .dt-length select {
    border:1px solid #cbd5e1; border-radius:.5rem; padding:.4rem .6rem; font-size:.875rem;
    background:#fff;
}
.dt-search input:focus, .dt-length select:focus { outline:none; box-shadow:0 0 0 3px rgba(99,102,241,.25); border-color:#6366f1; }
.dt-paging .dt-paging-button { border-radius:.4rem; padding:.3rem .65rem; margin:0 1px; }
.dt-paging .dt-paging-button.current, .dt-paging .dt-paging-button.current:hover {
    background:#4f46e5 !important; color:#fff !important; border-color:#4f46e5 !important;
}
.dt-info, .dt-length, .dt-search, .dt-paging { color:#475569; font-size:.875rem; }
table.dataTable.no-footer { border-bottom:1px solid #e2e8f0; }
.dt-layout-row { padding:0.6rem 0.25rem; }

/* Select2 overrides */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    min-height:42px; border:1px solid #cbd5e1; border-radius:.5rem; padding:5px 6px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height:30px; padding-left:6px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height:38px; right:4px; }
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--open .select2-selection {
    border-color:#6366f1 !important; box-shadow:0 0 0 3px rgba(99,102,241,.25);
}
.select2-results__option--highlighted[aria-selected] { background-color:#4f46e5 !important; }
.select2-dropdown { border:1px solid #cbd5e1; border-radius:.5rem; }

/* Toastr custom tweaks */
#toast-container > div { opacity:1; border-radius:.6rem; box-shadow:0 10px 25px -5px rgba(15,23,42,.25); }

/* Section header icon */
.page-icon {
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; border-radius:.75rem;
    background:linear-gradient(135deg,#6366f1 0%,#4338ca 100%);
    color:#fff; box-shadow:0 6px 14px -4px rgba(79,70,229,.5);
}
.page-icon-sm { width:36px; height:36px; border-radius:.6rem; }

/* Stat card icon variants */
.stat-icon { width:48px; height:48px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center; }
.stat-icon-indigo { background:linear-gradient(135deg,#6366f1,#4338ca); color:#fff; box-shadow:0 8px 20px -6px rgba(79,70,229,.45); }
.stat-icon-emerald { background:linear-gradient(135deg,#10b981,#047857); color:#fff; box-shadow:0 8px 20px -6px rgba(16,185,129,.45); }
.stat-icon-amber { background:linear-gradient(135deg,#f59e0b,#b45309); color:#fff; box-shadow:0 8px 20px -6px rgba(245,158,11,.45); }
.stat-icon-pink { background:linear-gradient(135deg,#ec4899,#be185d); color:#fff; box-shadow:0 8px 20px -6px rgba(236,72,153,.45); }
.stat-icon-sky { background:linear-gradient(135deg,#0ea5e9,#0369a1); color:#fff; box-shadow:0 8px 20px -6px rgba(14,165,233,.45); }
.stat-icon-rose { background:linear-gradient(135deg,#f43f5e,#9f1239); color:#fff; box-shadow:0 8px 20px -6px rgba(244,63,94,.45); }

/* Platform badge colors */
.badge { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:999px; font-size:.7rem; font-weight:600; }
.badge-instagram { background:#fdf2f8; color:#be185d; }
.badge-facebook  { background:#eff6ff; color:#1d4ed8; }
.badge-x         { background:#f1f5f9; color:#0f172a; }
.badge-linkedin  { background:#eef2ff; color:#3730a3; }
.badge-youtube   { background:#fef2f2; color:#b91c1c; }
.badge-success   { background:#ecfdf5; color:#047857; }
.badge-failed    { background:#fef2f2; color:#b91c1c; }
.badge-warn      { background:#fffbeb; color:#b45309; }
.badge-deferred  { background:#f1f5f9; color:#475569; }

/* Buttons with icons */
.btn { display:inline-flex; align-items:center; gap:6px; padding:.5rem .85rem; border-radius:.5rem; font-size:.875rem; font-weight:500; line-height:1; transition:.15s; border:1px solid transparent; }
.btn svg { width:16px; height:16px; }
.btn-primary { background:#4f46e5; color:#fff; }
.btn-primary:hover { background:#4338ca; }
.btn-secondary { background:#fff; color:#1e293b; border-color:#e2e8f0; }
.btn-secondary:hover { background:#f1f5f9; }
.btn-success { background:#10b981; color:#fff; }
.btn-success:hover { background:#059669; }
.btn-danger { background:#fff; color:#b91c1c; border-color:#fecaca; }
.btn-danger:hover { background:#fef2f2; }
.btn-xs { padding:.3rem .55rem; font-size:.75rem; }

/* Form labels */
.form-label { display:block; font-size:.8rem; font-weight:600; color:#334155; margin-bottom:.35rem; }
.form-input { width:100%; padding:.55rem .75rem; border:1px solid #cbd5e1; border-radius:.5rem; background:#fff; }
.form-input:focus { outline:none; border-color:#6366f1; box-shadow:0 0 0 3px rgba(99,102,241,.25); }

/* Card */
.card { background:#fff; border:1px solid #e2e8f0; border-radius:1rem; box-shadow:0 1px 2px rgba(15,23,42,.04); }
.card-body { padding:1.25rem 1.25rem; }
.card-header { padding:1rem 1.25rem; border-bottom:1px solid #f1f5f9; display:flex; align-items:center; gap:.75rem; }

/* Dropzone */
.js-dropzone.dropzone {
    border:2px dashed #c7d2fe; background:#f8faff;
    border-radius:.75rem; min-height:140px; padding:1.25rem;
    transition:border-color .15s, background .15s;
}
.js-dropzone.dropzone:hover { border-color:#6366f1; background:#eef2ff; }
.js-dropzone.dropzone .dz-message { color:#475569; font-size:.875rem; margin:.5rem 0; }
.js-dropzone.dropzone .dz-preview .dz-image { border-radius:.5rem; }
.js-dropzone.dropzone .dz-preview .dz-remove { color:#dc2626; font-weight:600; font-size:.75rem; }

/* Scrollbar */
.overflow-x-auto { scrollbar-width:thin; }

/* Radar siren branding */
.brand-siren,
.panel-beacon {
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    isolation:isolate;
}

.brand-siren {
    width:40px;
    height:40px;
}

.brand-siren__body {
    position:relative;
    display:block;
    width:40px;
    height:40px;
    border-radius:12px;
    overflow:hidden;
    background:linear-gradient(180deg,#1e1b4b 0%,#312e81 55%,#111827 100%);
    box-shadow:0 10px 24px -12px rgba(15,23,42,.75);
    animation:brand-siren-rock 2.4s ease-in-out infinite;
    z-index:2;
}

.brand-siren__body::before {
    content:"";
    position:absolute;
    top:6px;
    left:7px;
    width:26px;
    height:18px;
    border-radius:14px 14px 10px 10px;
    background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,.04));
    border:1px solid rgba(255,255,255,.16);
    z-index:0;
}

.brand-siren__body::after {
    content:"";
    position:absolute;
    left:8px;
    right:8px;
    bottom:7px;
    height:6px;
    border-radius:999px;
    background:rgba(15,23,42,.55);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
    z-index:0;
}

.brand-siren__light {
    position:absolute;
    top:8px;
    bottom:13px;
    width:13px;
    border-radius:10px 10px 8px 8px;
    opacity:.98;
    z-index:1;
}

.brand-siren__light--left {
    left:7px;
    background:linear-gradient(180deg,#93c5fd 0%,#3b82f6 48%,#1d4ed8 100%);
}

.brand-siren__light--right {
    right:7px;
    background:linear-gradient(180deg,#fda4af 0%,#ef4444 48%,#b91c1c 100%);
}

.brand-siren__badge {
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    font-size:.9rem;
    font-weight:700;
    color:#fff;
    text-shadow:0 0 14px rgba(255,255,255,.35);
    z-index:2;
}

.brand-siren__halo,
.panel-beacon__pulse {
    position:absolute;
    top:50%;
    width:26px;
    height:18px;
    border-radius:999px;
    filter:blur(7px);
    opacity:.65;
    transform:translateY(-50%);
    z-index:0;
    pointer-events:none;
}

.brand-siren__halo--left,
.panel-beacon__pulse--left {
    left:-11px;
    background:radial-gradient(circle at right center, rgba(59,130,246,.95), rgba(59,130,246,0) 72%);
    animation:siren-flash-left 1.35s linear infinite;
}

.brand-siren__halo--right,
.panel-beacon__pulse--right {
    right:-11px;
    background:radial-gradient(circle at left center, rgba(239,68,68,.95), rgba(239,68,68,0) 72%);
    animation:siren-flash-right 1.35s linear infinite;
}

.panel-beacon {
    width:40px;
    height:40px;
}

.panel-beacon > .grid {
    position:relative;
    z-index:2;
    box-shadow:0 6px 20px -14px rgba(79,70,229,.85);
    animation:panel-beacon-drift 2.4s ease-in-out infinite;
}

.panel-beacon--calendar .panel-beacon__pulse {
    width:24px;
    height:16px;
    filter:blur(8px);
    opacity:.56;
}

html.dark .brand-siren__body {
    background:linear-gradient(180deg,#312e81 0%,#1e1b4b 55%,#020617 100%);
    box-shadow:0 12px 28px -14px rgba(15,23,42,.95);
}

html.dark .brand-siren__body::after {
    background:rgba(2,6,23,.78);
}

html.dark .panel-beacon > .grid {
    box-shadow:0 10px 24px -16px rgba(148,163,184,.45);
}

@keyframes siren-flash-left {
    0%, 18%, 100% { opacity:.18; transform:translateY(-50%) scale(.85); }
    26%, 44% { opacity:.9; transform:translateY(-50%) scale(1.2); }
    52%, 70% { opacity:.28; transform:translateY(-50%) scale(.95); }
}

@keyframes siren-flash-right {
    0%, 44%, 100% { opacity:.18; transform:translateY(-50%) scale(.85); }
    52%, 70% { opacity:.9; transform:translateY(-50%) scale(1.2); }
    78%, 92% { opacity:.28; transform:translateY(-50%) scale(.95); }
}

@keyframes brand-siren-rock {
    0%, 100% { transform:rotate(-1.5deg) translateY(0); }
    25% { transform:rotate(1.5deg) translateY(-1px); }
    50% { transform:rotate(-1deg) translateY(0); }
    75% { transform:rotate(1deg) translateY(-1px); }
}

@keyframes panel-beacon-drift {
    0%, 100% { transform:translateY(0); }
    50% { transform:translateY(-1px); }
}

@media (prefers-reduced-motion: reduce) {
    .brand-siren__body,
    .brand-siren__halo,
    .panel-beacon > .grid,
    .panel-beacon__pulse {
        animation:none !important;
    }
}
