/* ===== Craftly Admin styles ===== */
:root { color-scheme: light dark; }
* { -webkit-tap-highlight-color: transparent; }
body { overflow-x: hidden; }

.card { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; }
[data-theme="dark"] .card { background: #0f172a; border-color: #1e293b; }

.btn { display:inline-flex; align-items:center; gap:.5rem; font-weight:600; border-radius:10px; padding:.55rem .9rem; font-size:.9rem; cursor:pointer; transition:all .15s; border:1px solid transparent; white-space:nowrap; }
.btn-sm { padding:.4rem .7rem; font-size:.82rem; }
.btn-primary { background:#4f46e5; color:#fff; }
.btn-primary:hover { background:#4338ca; }
.btn-outline { border-color:#cbd5e1; color:#334155; background:transparent; }
[data-theme="dark"] .btn-outline { border-color:#334155; color:#cbd5e1; }
.btn-outline:hover { background:#f1f5f9; }
[data-theme="dark"] .btn-outline:hover { background:#1e293b; }
.btn-danger { background:#e11d48; color:#fff; }
.btn-danger:hover { background:#be123c; }
.btn-ghost { background:transparent; color:#64748b; }
.btn-ghost:hover { color:#4f46e5; background:rgba(99,102,241,.08); }
.btn:disabled { opacity:.6; cursor:not-allowed; }

.field { border:1px solid #cbd5e1; border-radius:10px; padding:.55rem .75rem; font-size:.9rem; background:#fff; color:#0f172a; width:100%; }
[data-theme="dark"] .field { background:#0f172a; border-color:#334155; color:#e2e8f0; }
.field:focus { outline:none; border-color:#6366f1; box-shadow:0 0 0 3px rgba(99,102,241,.15); }
label.lbl { font-size:.8rem; font-weight:600; color:#64748b; display:block; margin-bottom:.25rem; }

/* sidebar */
.nav-link { display:flex; align-items:center; gap:.7rem; padding:.6rem .85rem; border-radius:10px; font-size:.9rem; color:#475569; transition:all .15s; cursor:pointer; position:relative; }
[data-theme="dark"] .nav-link { color:#94a3b8; }
.nav-link:hover { background:#f1f5f9; color:#4f46e5; }
[data-theme="dark"] .nav-link:hover { background:#1e293b; color:#a5b4fc; }
.nav-link.active { background:rgba(99,102,241,.1); color:#4f46e5; font-weight:600; }
[data-theme="dark"] .nav-link.active { color:#a5b4fc; }
.nav-link.active::before { content:''; position:absolute; left:0; top:.4rem; bottom:.4rem; width:3px; border-radius:3px; background:#6366f1; }
.nav-link i { width:20px; text-align:center; }

/* table */
table.tbl { width:100%; border-collapse:collapse; font-size:.86rem; }
table.tbl th { text-align:left; padding:.6rem .7rem; color:#94a3b8; font-weight:600; font-size:.74rem; text-transform:uppercase; letter-spacing:.03em; border-bottom:1px solid #e2e8f0; white-space:nowrap; }
[data-theme="dark"] table.tbl th { border-color:#1e293b; }
table.tbl td { padding:.65rem .7rem; border-bottom:1px solid #f1f5f9; vertical-align:middle; }
[data-theme="dark"] table.tbl td { border-color:#1e293b; }
table.tbl tr:hover td { background:#f8fafc; }
[data-theme="dark"] table.tbl tr:hover td { background:#0b1220; }

.badge { display:inline-flex; align-items:center; gap:.25rem; padding:.15rem .55rem; border-radius:999px; font-size:.72rem; font-weight:600; }
.badge-green { background:#dcfce7; color:#15803d; }
.badge-red { background:#fee2e2; color:#b91c1c; }
.badge-amber { background:#fef3c7; color:#b45309; }
.badge-blue { background:#dbeafe; color:#1d4ed8; }
.badge-gray { background:#e2e8f0; color:#475569; }
.badge-purple { background:#ede9fe; color:#6d28d9; }
[data-theme="dark"] .badge-green { background:rgba(34,197,94,.15); color:#4ade80; }
[data-theme="dark"] .badge-red { background:rgba(239,68,68,.15); color:#f87171; }
[data-theme="dark"] .badge-amber { background:rgba(245,158,11,.15); color:#fbbf24; }
[data-theme="dark"] .badge-blue { background:rgba(59,130,246,.15); color:#60a5fa; }
[data-theme="dark"] .badge-gray { background:rgba(148,163,184,.15); color:#cbd5e1; }
[data-theme="dark"] .badge-purple { background:rgba(139,92,246,.15); color:#c4b5fd; }

.spinner { width:20px; height:20px; border:3px solid rgba(99,102,241,.25); border-top-color:#6366f1; border-radius:50%; animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

.toast { pointer-events:auto; padding:.7rem 1rem; border-radius:12px; font-size:.85rem; font-weight:500; box-shadow:0 8px 30px rgba(2,6,23,.2); animation:slidein .25s; max-width:340px; }
@keyframes slidein { from { transform:translateX(20px); opacity:0; } }
.toast-success { background:#059669; color:#fff; }
.toast-error { background:#e11d48; color:#fff; }
.toast-info { background:#4f46e5; color:#fff; }

.modal-wrap { position:fixed; inset:0; z-index:90; display:flex; align-items:center; justify-content:center; padding:1rem; }
.modal-bg { position:absolute; inset:0; background:rgba(2,6,23,.6); backdrop-filter:blur(3px); }
.modal-card { position:relative; width:100%; background:#fff; border-radius:16px; max-height:90vh; overflow:auto; box-shadow:0 20px 60px rgba(2,6,23,.4); animation:pop .2s; }
[data-theme="dark"] .modal-card { background:#0f172a; }
@keyframes pop { from { transform:scale(.96); opacity:0; } }

.stat-card { padding:1.1rem 1.2rem; border-radius:16px; }
.kpi { font-size:1.7rem; font-weight:800; line-height:1; }
.muted { color:#94a3b8; }
.mono { font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:.8rem; }

.truncate-1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
a.link { color:#6366f1; cursor:pointer; }
a.link:hover { text-decoration:underline; }