@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css');

:root {
    color-scheme: light;
    --bg: #f4f7fb;
    --surface: #ffffff;
    --surface-2: #eef3f8;
    --surface-3: #e5edf6;
    --text: #142033;
    --muted: #64748b;
    --border: #dbe4ef;
    --primary: #0b6e75;
    --primary-2: #075a61;
    --accent: #e59a2f;
    --danger: #c2414b;
    --success: #23845b;
    --shadow: 0 18px 45px rgba(27, 49, 75, .10);
    --sidebar: #102539;
    --sidebar-text: #d8e4ee;
    --sidebar-muted: #91a7ba;
    --sidebar-active: rgba(49, 188, 190, .16);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --bg: #07111c;
    --surface: #0d1b29;
    --surface-2: #122334;
    --surface-3: #182d41;
    --text: #edf5fb;
    --muted: #9bb0c3;
    --border: #243b50;
    --primary: #31bcbf;
    --primary-2: #50d1d3;
    --accent: #f2b455;
    --danger: #fb7185;
    --success: #4ade80;
    --shadow: 0 22px 55px rgba(0, 0, 0, .32);
    --sidebar: #050d15;
    --sidebar-text: #e8f1f7;
    --sidebar-muted: #7f97aa;
    --sidebar-active: rgba(49, 188, 190, .18);
}

* { box-sizing: border-box; }
html { font-family: Vazirmatn, Vazir, Tahoma, "Segoe UI", sans-serif; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); direction: rtl; min-height: 100vh; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-shell { display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: 100vh; }
.sidebar {
    position: sticky; top: 0; height: 100vh; overflow-y: auto;
    padding: 22px 18px; background: var(--sidebar); color: var(--sidebar-text);
    border-left: 1px solid rgba(255,255,255,.06); z-index: 50;
}
.brand { display: flex; align-items: center; gap: 12px; padding: 6px 8px 22px; }
.brand-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: linear-gradient(135deg, #31bcbf, #0a7282); font-weight: 900; color: white; box-shadow: 0 10px 24px rgba(49,188,191,.25); }
.brand strong { display: block; font-size: 1.05rem; }
.brand small { display: block; margin-top: 4px; color: var(--sidebar-muted); }
.nav-title { margin: 18px 10px 8px; color: var(--sidebar-muted); font-size: .75rem; font-weight: 700; }
.nav { display: grid; gap: 6px; }
.nav-link { display: flex; align-items: center; gap: 11px; padding: 11px 12px; border-radius: 12px; color: var(--sidebar-text); transition: .2s ease; }
.nav-link:hover { background: rgba(255,255,255,.06); transform: translateX(-2px); }
.nav-link.active { background: var(--sidebar-active); color: #72e5e6; box-shadow: inset -3px 0 0 #31bcbf; }
.nav-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; background: rgba(255,255,255,.06); font-size: .9rem; }
.sidebar-footer { margin-top: 22px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.08); }
.user-mini { display:flex; align-items:center; gap:10px; padding: 8px; }
.avatar { width: 38px; height: 38px; border-radius: 50%; display:grid; place-items:center; background: #20394f; color:#7de8e8; font-weight:800; }
.user-mini small { display:block; color:var(--sidebar-muted); margin-top:3px; }

.main { min-width: 0; }
.topbar { height: 76px; position: sticky; top: 0; z-index: 40; display:flex; align-items:center; justify-content:space-between; gap:16px; padding: 0 28px; background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: blur(14px); border-bottom:1px solid var(--border); }
.topbar-actions { display:flex; align-items:center; gap:10px; }
.icon-button { width:42px; height:42px; border:1px solid var(--border); border-radius:12px; background:var(--surface); color:var(--text); display:grid; place-items:center; }
.mobile-menu { display:none; }
.content { padding: 28px; max-width: 1600px; margin: 0 auto; }
.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:22px; }
.page-head h1 { margin:0; font-size: clamp(1.45rem, 2.5vw, 2rem); letter-spacing:-.5px; }
.page-head p { margin:8px 0 0; color:var(--muted); line-height:1.8; }

.grid { display:grid; gap:18px; }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.card { background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:20px; box-shadow:var(--shadow); }
.stat-card { position:relative; overflow:hidden; min-height:126px; }
.stat-card::after { content:""; position:absolute; left:-26px; bottom:-32px; width:100px; height:100px; border-radius:50%; background:color-mix(in srgb, var(--primary) 12%, transparent); }
.stat-label { color:var(--muted); font-size:.9rem; }
.stat-value { margin-top:12px; font-size:2rem; font-weight:900; }
.stat-foot { margin-top:8px; color:var(--primary); font-size:.8rem; }

.section-title { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:16px; }
.section-title h2 { margin:0; font-size:1.1rem; }
.muted { color:var(--muted); }
.badge { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border-radius:999px; font-size:.75rem; font-weight:700; background:var(--surface-2); color:var(--muted); border:1px solid var(--border); }
.badge.official { background:color-mix(in srgb, var(--success) 12%, var(--surface)); color:var(--success); border-color:color-mix(in srgb, var(--success) 35%, var(--border)); }
.badge.warning { color:var(--accent); }

.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:9px 15px; border-radius:12px; border:1px solid transparent; font-weight:700; transition:.18s ease; }
.btn:hover { transform:translateY(-1px); }
.btn-primary { background:var(--primary); color:white; }
html[data-theme="dark"] .btn-primary { color:#051014; }
.btn-secondary { background:var(--surface-2); color:var(--text); border-color:var(--border); }
.btn-danger { background:color-mix(in srgb, var(--danger) 12%, var(--surface)); color:var(--danger); border-color:color-mix(in srgb, var(--danger) 28%, var(--border)); }
.btn-sm { min-height:34px; padding:6px 10px; font-size:.82rem; border-radius:9px; }

.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.field { display:grid; gap:7px; }
.field.full { grid-column:1/-1; }
label { font-size:.86rem; font-weight:700; }
.input, select, textarea { width:100%; border:1px solid var(--border); background:var(--surface-2); color:var(--text); border-radius:12px; padding:11px 13px; outline:none; transition:.18s ease; }
.input:focus, select:focus, textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 15%, transparent); }
textarea { min-height:120px; resize:vertical; line-height:1.8; }
.error-text { color:var(--danger); font-size:.78rem; }
.filters { display:grid; grid-template-columns:minmax(220px,2fr) repeat(2,minmax(150px,1fr)) auto; gap:12px; align-items:end; }

.table-wrap { overflow:auto; border:1px solid var(--border); border-radius:15px; }
table { width:100%; border-collapse:collapse; min-width:760px; }
th, td { padding:13px 14px; text-align:right; border-bottom:1px solid var(--border); vertical-align:top; }
th { font-size:.78rem; color:var(--muted); background:var(--surface-2); position:sticky; top:0; }
tr:last-child td { border-bottom:0; }
tbody tr:hover { background:color-mix(in srgb, var(--primary) 4%, var(--surface)); }
.code { direction:ltr; text-align:left; display:inline-block; font-family:Consolas,monospace; font-weight:900; color:var(--primary); }
.actions { display:flex; flex-wrap:wrap; gap:7px; }

.error-list { display:grid; gap:12px; }
.error-item { display:grid; grid-template-columns:110px minmax(0,1fr) auto; gap:16px; align-items:center; padding:17px; background:var(--surface); border:1px solid var(--border); border-radius:16px; transition:.18s ease; }
.error-item:hover { border-color:color-mix(in srgb, var(--primary) 45%, var(--border)); transform:translateY(-1px); box-shadow:var(--shadow); }
.error-code { direction:ltr; font:900 1.15rem Consolas,monospace; color:var(--primary); }
.error-item h3 { margin:0 0 6px; font-size:1rem; }
.error-item p { margin:0; color:var(--muted); line-height:1.7; font-size:.88rem; }
.error-meta { display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }

.flash { padding:13px 15px; margin-bottom:18px; border-radius:13px; background:color-mix(in srgb, var(--success) 12%, var(--surface)); color:var(--success); border:1px solid color-mix(in srgb, var(--success) 30%, var(--border)); }
.empty { text-align:center; padding:48px 20px; color:var(--muted); }
.pagination { display:flex; flex-wrap:wrap; gap:6px; margin-top:18px; }
.pagination .page-link { display:grid; place-items:center; min-width:38px; height:38px; padding:0 10px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.pagination .active .page-link { background:var(--primary); color:white; border-color:var(--primary); }

.auth-page { min-height:100vh; display:grid; grid-template-columns:minmax(380px, .9fr) 1.1fr; background:var(--bg); }
.auth-panel { display:grid; place-items:center; padding:40px; }
.auth-box { width:min(440px,100%); }
.auth-visual { position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:55px; color:white; background:radial-gradient(circle at 70% 18%,rgba(49,188,191,.42),transparent 27%),linear-gradient(145deg,#071521,#123a4a 58%,#0d6f77); }
.auth-visual::before { content:""; position:absolute; inset:0; background:linear-gradient(transparent,rgba(0,0,0,.46)); }
.auth-copy { position:relative; max-width:650px; }
.auth-copy h1 { font-size:clamp(2.2rem,5vw,4.7rem); margin:0; letter-spacing:-2px; }
.auth-copy p { font-size:1.1rem; line-height:2; color:#d9edf0; }
.login-logo { display:flex; align-items:center; gap:12px; margin-bottom:34px; }
.login-logo .brand-mark { width:52px; height:52px; }

.detail-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,.7fr); gap:18px; }
.detail-section { padding:18px 0; border-bottom:1px solid var(--border); }
.detail-section:last-child { border-bottom:0; }
.detail-section h3 { margin:0 0 10px; font-size:.95rem; color:var(--muted); }
.detail-section p { margin:0; line-height:2; white-space:pre-line; }

.overlay { display:none; }
@media (max-width: 1150px) { .grid-4 { grid-template-columns:repeat(2,1fr); } .grid-3 { grid-template-columns:repeat(2,1fr); } }
@media (max-width: 900px) {
    .app-shell { grid-template-columns:1fr; }
    .sidebar { position:fixed; right:-300px; width:280px; transition:.25s ease; box-shadow:0 0 50px rgba(0,0,0,.4); }
    body.sidebar-open .sidebar { right:0; }
    .overlay { display:block; position:fixed; inset:0; background:rgba(0,0,0,.48); opacity:0; pointer-events:none; z-index:45; transition:.2s; }
    body.sidebar-open .overlay { opacity:1; pointer-events:auto; }
    .mobile-menu { display:grid; }
    .content { padding:20px; }
    .topbar { padding:0 18px; }
    .filters { grid-template-columns:1fr 1fr; }
    .detail-grid { grid-template-columns:1fr; }
    .auth-page { grid-template-columns:1fr; }
    .auth-visual { display:none; }
}
@media (max-width: 620px) {
    .grid-4,.grid-3,.grid-2 { grid-template-columns:1fr; }
    .form-grid,.filters { grid-template-columns:1fr; }
    .page-head { flex-direction:column; }
    .error-item { grid-template-columns:1fr; }
    .auth-panel { padding:25px 18px; }
    .content { padding:16px; }
}

/* ATM AI Laravel 0.3 additions */
.flash-error{background:color-mix(in srgb,var(--danger) 12%,var(--surface));color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,var(--border))}.flash-error ul{margin:8px 18px 0}
.filter-panel{display:grid;grid-template-columns:minmax(260px,2fr) repeat(5,minmax(130px,1fr));gap:12px;align-items:end}.filter-search{grid-column:span 2}.filter-actions{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.check-line{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--muted)}
.list-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--border)}.list-row:last-child{border-bottom:0}.list-row:hover{color:var(--primary)}
.machine-card h3{margin:12px 0 8px}.machine-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--primary) 45%,var(--border))}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;color:var(--muted);font-size:.78rem;margin-top:14px}.status-dot{padding:5px 9px;border-radius:999px;font-size:.75rem;background:var(--surface-2);border:1px solid var(--border)}.status-dot.online{color:var(--success)}.status-dot.offline{color:var(--danger)}.status-dot.maintenance{color:var(--accent)}
.priority-critical{color:var(--danger)!important;border-color:color-mix(in srgb,var(--danger) 35%,var(--border))!important}.priority-high{color:#d97706!important}.priority-normal{color:var(--primary)!important}.priority-low{color:var(--muted)!important}
.check-list{margin:0;padding:0 22px 0 0;line-height:2}.comment{padding:14px;border:1px solid var(--border);background:var(--surface-2);border-radius:14px;margin-bottom:10px}.comment-head{display:flex;justify-content:space-between;gap:12px}.comment p{margin:8px 0 0;white-space:pre-line;line-height:1.9}.repair-card{padding:15px 0;border-bottom:1px solid var(--border)}.repair-card:last-child{border-bottom:0}.repair-card p{line-height:1.8}.bulkbar{display:flex;gap:10px;align-items:center;margin-bottom:12px}.bulkbar select{width:auto;min-width:160px}.progress-row{margin:15px 0}.progress-row>div:first-child{display:flex;justify-content:space-between;margin-bottom:7px}.progress{height:9px;border-radius:999px;background:var(--surface-2);overflow:hidden}.progress i{display:block;height:100%;background:var(--primary);border-radius:999px}
@media(max-width:1300px){.filter-panel{grid-template-columns:repeat(3,minmax(0,1fr))}.filter-search{grid-column:span 2}}
@media(max-width:900px){.filter-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-search{grid-column:1/-1}}
@media(max-width:620px){.filter-panel{grid-template-columns:1fr}.filter-search{grid-column:auto}.mini-grid{grid-template-columns:1fr}.comment-head{flex-direction:column}}

/* جداسازی بصری پنل مدیر و تکنسین */
.role-switch{margin:14px 0 4px;padding:12px 13px;border:1px solid rgba(255,255,255,.1);border-radius:13px;display:flex;flex-direction:column;gap:4px}.role-switch strong{font-size:.9rem}.role-switch span{font-size:.74rem;color:var(--sidebar-muted)}.role-admin{background:linear-gradient(135deg,rgba(246,173,85,.16),rgba(255,255,255,.03))}.role-technician{background:linear-gradient(135deg,rgba(49,188,190,.17),rgba(255,255,255,.03))}.role-kicker{display:inline-flex;padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--primary) 12%,transparent);color:var(--primary);font-size:.78rem;font-weight:800;margin-bottom:8px}.quick-actions{display:flex;gap:10px;flex-wrap:wrap}.technician-help{background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 7%,var(--surface)),var(--surface))}
.catalog-range{margin:0 4px 10px;font-size:.84rem}.ai-warning{border:1px solid #f1b44c;background:#fff8e6;color:#7a4b00;padding:12px 14px;border-radius:12px}

/* ATM AI 0.5.1: آموزش چندرسانه‌ای، کاتالوگ تصویری و مرکز آپدیت */
.media-card,.model-card{padding:0;overflow:hidden;transition:.2s ease}.media-card:hover,.model-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--primary) 48%,var(--border))}.media-cover,.model-photo{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,var(--surface-2),var(--surface-3));overflow:hidden}.media-cover img,.model-photo img,.model-main-photo img,.lesson-hero img,.chapter-media img,.media-resource img,.machine-photo img,.model-profile img{width:100%;height:100%;object-fit:cover;display:block}.media-card-body,.model-card-body{padding:18px}.media-card h2,.model-card h2{font-size:1.08rem;margin:12px 0 8px}.media-card p,.model-card p{line-height:1.8;margin:0}.media-placeholder,.model-photo>span{position:absolute;inset:0;display:grid;place-items:center;font-size:3rem;font-weight:900;color:var(--primary)}.play-chip{position:absolute;left:12px;bottom:12px;padding:6px 11px;border-radius:999px;background:rgba(7,17,28,.78);color:white;font-size:.78rem;font-weight:800}.lesson-hero{padding:0;overflow:hidden}.lesson-hero video,.chapter-media video,.media-resource video{width:100%;max-height:680px;background:#050b10;display:block}.video-embed{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:14px;background:#050b10}.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.lesson-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:18px;align-items:start}.lesson-toc{position:sticky;top:96px;display:grid;gap:8px}.lesson-toc h3{margin:0 0 8px}.lesson-toc a{padding:9px 10px;border-radius:10px;color:var(--muted);font-size:.86rem}.lesson-toc a:hover{background:var(--surface-2);color:var(--primary)}.lesson-content{display:grid;gap:18px}.lesson-chapter{scroll-margin-top:96px}.lesson-body{line-height:2.1}.chapter-media,.media-resource{margin:14px 0;border-radius:14px;overflow:hidden}.check-card{margin-top:18px;padding:16px;border-radius:14px;background:color-mix(in srgb,var(--primary) 7%,var(--surface));border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border))}.model-main-photo{aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:var(--surface-2)}.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}.gallery-grid img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px}.mini-model{padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);text-align:center;font-weight:800}.form-preview{width:180px;max-height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--border);margin-top:6px}.table-thumb{width:72px;height:52px;object-fit:cover;border-radius:9px}.admin-chapter{padding:14px 0;border-bottom:1px solid var(--border)}.admin-chapter:last-child{border-bottom:0}.admin-chapter summary{cursor:pointer;font-weight:800;margin-bottom:14px}.update-log{direction:ltr;text-align:left;white-space:pre-wrap;max-width:620px;max-height:300px;overflow:auto;background:#07111c;color:#d7e8f4;border-radius:10px;padding:12px;font-size:.75rem}.machine-photo{aspect-ratio:16/7;margin:-20px -20px 14px;overflow:hidden;border-radius:18px 18px 0 0;background:var(--surface-2)}.model-profile{display:flex;align-items:center;gap:18px;margin-bottom:18px}.model-profile img{width:180px;height:120px;border-radius:12px}.model-profile a{color:var(--primary);font-size:.86rem}.check-line.full{grid-column:1/-1}
@media(max-width:900px){.lesson-layout{grid-template-columns:1fr}.lesson-toc{position:static}.gallery-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.gallery-grid{grid-template-columns:repeat(2,1fr)}.model-profile{flex-direction:column;align-items:stretch}.model-profile img{width:100%;height:auto}.lesson-chapter{padding:15px}}