/* WebCore Business Manager – shared styles (works with Tailwind Play CDN) */
:root { --wc-sidebar: #0b1437; --wc-sidebar-2: #101a45; }
body { font-family: 'Inter', ui-sans-serif, system-ui, sans-serif; }
.wc-card { background:#fff; border:1px solid #eef2f7; border-radius:1rem; box-shadow:0 2px 14px rgba(15,23,42,.04); }
.wc-sidebar { background: linear-gradient(180deg, var(--wc-sidebar) 0%, var(--wc-sidebar-2) 100%); }
.wc-sidebar::-webkit-scrollbar, .wc-scroll::-webkit-scrollbar { width:5px; height:5px; }
.wc-sidebar::-webkit-scrollbar-thumb { background:rgba(255,255,255,.12); border-radius:9px; }
.wc-scroll::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:9px; }
.wc-link { display:flex; align-items:center; gap:.7rem; padding:.42rem .6rem; border-radius:.65rem; color:#cbd5e1; font-size:.86rem; transition:all .15s; }
.wc-link:hover { background:rgba(255,255,255,.06); color:#fff; }
.wc-link.active { background:linear-gradient(90deg,#2563eb,#3b82f6); color:#fff; box-shadow:0 8px 20px -6px rgba(37,99,235,.6); }
.wc-link .wc-ico { width:1.75rem; height:1.75rem; border-radius:.5rem; display:flex; align-items:center; justify-content:center; font-size:.78rem; color:#fff; flex-shrink:0; }
.wc-link.active .wc-ico { background:rgba(255,255,255,.18) !important; }
.wc-section { font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:#7b8bb2; padding:.9rem .6rem .35rem; font-weight:600; }
.wc-btn { display:inline-flex; align-items:center; gap:.45rem; padding:.55rem 1rem; border-radius:.7rem; font-size:.85rem; font-weight:600; transition:all .15s; }
.wc-btn-primary { background:linear-gradient(90deg,#2563eb,#7c3aed); color:#fff; box-shadow:0 8px 18px -8px rgba(79,70,229,.7); }
.wc-btn-primary:hover { filter:brightness(1.08); }
.wc-btn-light { background:#fff; border:1px solid #e2e8f0; color:#334155; }
.wc-btn-light:hover { background:#f8fafc; }
.wc-input { width:100%; padding:.6rem .85rem; border:1px solid #e2e8f0; border-radius:.7rem; font-size:.875rem; background:#fff; outline:none; transition:all .15s; }
.wc-input:focus { border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.15); }
.wc-input.w-auto { width:auto; } .wc-input.pl-9 { padding-left:2.25rem; } .wc-input.pr-10 { padding-right:2.5rem; } .wc-input.w-32 { width:8rem; } .wc-input.w-48 { width:12rem; }
.wc-label { display:block; font-size:.8rem; font-weight:600; color:#475569; margin-bottom:.35rem; }
.wc-table th { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:#64748b; font-weight:600; background:#f8fafc; padding:.75rem 1rem; text-align:left; white-space:nowrap; }
.wc-table td { padding:.8rem 1rem; font-size:.875rem; border-top:1px solid #f1f5f9; vertical-align:middle; }
.wc-table tr:hover td { background:#fafbff; }
.wc-pill { display:inline-flex; align-items:center; padding:.22rem .6rem; border-radius:.5rem; font-size:.72rem; font-weight:600; }
.wc-viewall { font-size:.72rem; padding:.3rem .7rem; border-radius:.5rem; background:#eff6ff; color:#2563eb; font-weight:600; }
.wc-viewall:hover { background:#dbeafe; }
.wc-dropdown { display:none; }
.wc-dropdown.open { display:block; }
@media print { .no-print { display:none !important; } body { background:#fff !important; } .print-area { box-shadow:none !important; border:0 !important; } main { padding:0 !important; } .wc-main { margin-left:0 !important; } }

/* ---------------- Dark mode ---------------- */
html.dark body { background:#0b1120 !important; color:#e2e8f0; }
html.dark .wc-card, html.dark .bg-white { background:#111a2e !important; border-color:#1e2a44 !important; }
html.dark .bg-slate-50, html.dark .bg-slate-100, html.dark .bg-\[\#f4f7fe\], html.dark .bg-\[\#f4f7fe\]\/90 { background:#0f172a !important; }
html.dark .border-slate-100, html.dark .border-slate-200, html.dark .border-\[\#eef2f7\] { border-color:#1e2a44 !important; }
html.dark .text-slate-900, html.dark .text-slate-800, html.dark .text-slate-700 { color:#e2e8f0 !important; }
html.dark .text-slate-600, html.dark .text-slate-500 { color:#94a3b8 !important; }
html.dark .wc-input, html.dark input, html.dark select, html.dark textarea { background:#0b1222 !important; color:#e2e8f0 !important; border-color:#24324f !important; }
html.dark .wc-btn-light { background:#111a2e; border-color:#24324f; color:#cbd5e1; }
html.dark .wc-table th { background:#0f172a; color:#94a3b8; }
html.dark .wc-table td { border-color:#1e2a44; }
html.dark .wc-table tr:hover td, html.dark .hover\:bg-slate-50:hover { background:#16213a !important; }
html.dark .divide-slate-100 > * + * { border-color:#1e2a44 !important; }
html.dark .wc-label { color:#94a3b8; }
html.dark .wc-viewall { background:rgba(59,130,246,.15); color:#93c5fd; }
html.dark .bg-blue-50, html.dark .bg-blue-100, html.dark .bg-sky-50, html.dark .bg-sky-100 { background:rgba(59,130,246,.14) !important; }
html.dark .bg-emerald-50, html.dark .bg-emerald-100, html.dark .bg-green-50, html.dark .bg-green-100, html.dark .bg-teal-50, html.dark .bg-teal-100 { background:rgba(16,185,129,.14) !important; }
html.dark .bg-rose-50, html.dark .bg-rose-100, html.dark .bg-red-50, html.dark .bg-red-100 { background:rgba(244,63,94,.14) !important; }
html.dark .bg-amber-50, html.dark .bg-amber-100, html.dark .bg-orange-50, html.dark .bg-orange-100, html.dark .bg-yellow-50, html.dark .bg-yellow-100 { background:rgba(245,158,11,.14) !important; }
html.dark .bg-violet-50, html.dark .bg-violet-100, html.dark .bg-purple-50, html.dark .bg-purple-100, html.dark .bg-indigo-50, html.dark .bg-indigo-100 { background:rgba(139,92,246,.14) !important; }
html.dark .bg-pink-50, html.dark .bg-pink-100 { background:rgba(236,72,153,.14) !important; }
html.dark .bg-cyan-50, html.dark .bg-cyan-100 { background:rgba(6,182,212,.14) !important; }
html.dark [class*="ring-"] { --tw-ring-color: transparent !important; }
.wc-theme-active { background:#fff; color:#2563eb !important; box-shadow:0 4px 14px rgba(15,23,42,.08); }
html.dark .wc-theme-active { background:#1e293b; color:#93c5fd !important; }
.wc-main { min-width:0; overflow-x:clip; }

/* ---------------- Menu layouts: sidebar | compact | topbar ---------------- */
.wc-top-brand { display:none; }
.wc-topnav { display:none; }
.wc-toplink { display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .85rem; border-radius:.7rem; color:#cbd5e1; font-size:.85rem; font-weight:500; white-space:nowrap; transition:all .15s; }
.wc-toplink:hover { background:rgba(255,255,255,.08); color:#fff; }
.wc-toplink.active { background:linear-gradient(90deg,#2563eb,#3b82f6); color:#fff; box-shadow:0 8px 20px -8px rgba(37,99,235,.7); }
#wc-sidebar, .wc-main { transition: width .2s, margin-left .2s; }

@media (min-width: 1024px) {
    /* Compact: icon-only sidebar */
    html.wc-layout-compact #wc-sidebar { width:76px; }
    html.wc-layout-compact .wc-main { margin-left:76px !important; }
    html.wc-layout-compact #wc-sidebar .wc-brand-text,
    html.wc-layout-compact #wc-sidebar .wc-link > span.flex-1,
    html.wc-layout-compact #wc-sidebar .wc-link > .fa-chevron-right,
    html.wc-layout-compact #wc-sidebar .wc-link > span.rounded-full { display:none; }
    html.wc-layout-compact #wc-sidebar > a:first-child { justify-content:center; padding-left:0; padding-right:0; }
    html.wc-layout-compact #wc-sidebar .wc-section { font-size:0; padding:.6rem 0 .3rem; margin:0 1.1rem; border-top:1px solid rgba(255,255,255,.08); }
    html.wc-layout-compact #wc-sidebar .wc-link { justify-content:center; padding:.5rem 0; }
    html.wc-layout-compact #wc-sidebar .wc-link .wc-ico { width:2.1rem; height:2.1rem; font-size:.9rem; }

    /* Top menu: no sidebar, horizontal menu under the header */
    html.wc-layout-topbar #wc-sidebar { display:none; }
    html.wc-layout-topbar .wc-main { margin-left:0 !important; }
    html.wc-layout-topbar .wc-top-brand { display:flex; }
    html.wc-layout-topbar .wc-collapse-btn { display:none !important; }
    html.wc-layout-topbar .wc-topnav { display:block; padding-bottom:.6rem; }
    html.wc-layout-topbar .wc-topnav > div { overflow:visible; flex-wrap:wrap; }
}
html.dark .wc-top-brand .text-\[\#0b1437\] { color:#e2e8f0; }
