/* ===============================
   Job Status System UI
   =============================== */
:root {
    --bg: #080b12;
    --bg2: #111827;
    --card: rgba(255,255,255,.08);
    --card2: rgba(255,255,255,.12);
    --text: #f8fafc;
    --muted: #a8b3c7;
    --line: rgba(255,255,255,.14);
    --gold: #facc15;
    --green: #22c55e;
    --red: #ef4444;
    --blue: #38bdf8;
    --purple: #a78bfa;
    --orange: #fb923c;
    --radius: 22px;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at top left, rgba(250,204,21,.20), transparent 32rem),
        radial-gradient(circle at top right, rgba(56,189,248,.15), transparent 28rem),
        linear-gradient(135deg, #05070c 0%, #101827 55%, #111827 100%);
    color: var(--text);
    min-height: 100vh;
}
a { color: inherit; }
.container {
    width: min(1180px, calc(100% - 28px));
    margin: 0 auto;
    padding: 24px 0 44px;
}
.topbar {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
}
.brand {
    display: flex;
    align-items: center;
    gap: 12px;
}
.logo {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #facc15, #fb923c);
    color: #111827;
    font-weight: 950;
    box-shadow: 0 14px 32px rgba(250,204,21,.24);
}
.brand h1 {
    margin: 0;
    font-size: clamp(22px, 4vw, 34px);
    line-height: 1.05;
}
.brand p { margin: 4px 0 0; color: var(--muted); }
.btn, button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 15px;
    padding: 11px 16px;
    color: #0f172a;
    background: linear-gradient(135deg, #facc15, #fb923c);
    text-decoration: none;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 16px 36px rgba(251,146,60,.18);
}
.btn.secondary {
    background: rgba(255,255,255,.10);
    color: var(--text);
    border: 1px solid var(--line);
    box-shadow: none;
}
.grid {
    display: grid;
    gap: 16px;
}
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card {
    border: 1px solid var(--line);
    background: linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.055));
    border-radius: var(--radius);
    padding: 18px;
    box-shadow: 0 22px 70px rgba(0,0,0,.26);
    backdrop-filter: blur(14px);
}
.hero {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 16px;
    align-items: stretch;
}
.big-title {
    margin: 0 0 10px;
    font-size: clamp(28px, 5vw, 52px);
    letter-spacing: -1px;
    line-height: .98;
}
.muted { color: var(--muted); }
.stat {
    border: 1px solid var(--line);
    background: rgba(255,255,255,.06);
    border-radius: 18px;
    padding: 14px;
    min-height: 98px;
}
.stat .label {
    color: var(--muted);
    font-size: 13px;
}
.stat .value {
    font-size: clamp(22px, 3vw, 34px);
    font-weight: 950;
    margin-top: 4px;
}
.pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 900;
    font-size: 13px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.08);
}
.status-wait { color: #fde68a; background: rgba(250,204,21,.14); }
.status-ready { color: #7dd3fc; background: rgba(56,189,248,.14); }
.status-work { color: #86efac; background: rgba(34,197,94,.14); }
.status-parts { color: #fdba74; background: rgba(251,146,60,.14); }
.status-pay { color: #fca5a5; background: rgba(239,68,68,.14); }
.status-done { color: #a7f3d0; background: rgba(16,185,129,.14); }
.status-delivered { color: #c4b5fd; background: rgba(167,139,250,.14); }
.status-pause { color: #cbd5e1; background: rgba(148,163,184,.14); }
.progress-wrap {
    margin-top: 18px;
}
.progress-bar {
    width: 100%;
    height: 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    overflow: hidden;
    border: 1px solid var(--line);
}
.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #facc15, #22c55e, #38bdf8);
    border-radius: inherit;
}
.info-list {
    display: grid;
    gap: 10px;
}
.info-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    padding-bottom: 9px;
}
.info-row:last-child { border-bottom: 0; padding-bottom: 0; }
.info-row span:first-child { color: var(--muted); }
.info-row span:last-child { font-weight: 800; text-align: right; }
.section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 14px;
}
.section-title h2 {
    margin: 0;
    font-size: 22px;
}
.timeline {
    position: relative;
    display: grid;
    gap: 14px;
}
.update {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 14px;
    align-items: start;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.055);
    border-radius: 20px;
    padding: 14px;
}
.update img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    border-radius: 16px;
    background: rgba(255,255,255,.08);
}
.update h3 {
    margin: 0 0 6px;
}
.update p {
    margin: 0;
    color: var(--muted);
    line-height: 1.6;
}
.money {
    display: grid;
    gap: 12px;
}
.money-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 12px;
    border-radius: 16px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.09);
}
.money-row strong { color: #fff; }
.table-wrap {
    overflow-x: auto;
}
table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
}
th {
    color: var(--muted);
    font-size: 13px;
    text-align: left;
    font-weight: 700;
}
td {
    padding: 12px;
    background: rgba(255,255,255,.06);
    border-top: 1px solid rgba(255,255,255,.09);
    border-bottom: 1px solid rgba(255,255,255,.09);
}
td:first-child { border-left: 1px solid rgba(255,255,255,.09); border-radius: 14px 0 0 14px; }
td:last-child { border-right: 1px solid rgba(255,255,255,.09); border-radius: 0 14px 14px 0; }
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.form-grid .full { grid-column: 1 / -1; }
label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-weight: 700;
    font-size: 13px;
}
input, select, textarea {
    width: 100%;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.08);
    color: var(--text);
    border-radius: 14px;
    padding: 12px 13px;
    outline: none;
    font: inherit;
}
option { color: #0f172a; }
textarea { min-height: 92px; resize: vertical; }
.admin-layout {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 16px;
    align-items: start;
}
.job-list {
    display: grid;
    gap: 10px;
}
.job-item {
    display: block;
    padding: 14px;
    border-radius: 17px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.055);
    text-decoration: none;
}
.job-item.active {
    border-color: rgba(250,204,21,.5);
    background: rgba(250,204,21,.12);
}
.alert {
    padding: 12px 14px;
    border-radius: 15px;
    background: rgba(34,197,94,.14);
    border: 1px solid rgba(34,197,94,.28);
    margin-bottom: 14px;
    color: #bbf7d0;
}
.danger {
    background: rgba(239,68,68,.12);
    color: #fecaca;
    border-color: rgba(239,68,68,.3);
}
.small {
    font-size: 13px;
}
.copybox {
    display: flex;
    gap: 8px;
    align-items: center;
    background: rgba(0,0,0,.22);
    border: 1px solid var(--line);
    padding: 10px;
    border-radius: 16px;
    overflow: hidden;
}
.copybox input {
    border: 0;
    background: transparent;
    padding: 6px;
}
@media (max-width: 900px) {
    .hero, .admin-layout { grid-template-columns: 1fr; }
    .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }
    .topbar { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 620px) {
    .container { width: min(100% - 18px, 1180px); padding-top: 12px; }
    .card { padding: 14px; border-radius: 18px; }
    .update { grid-template-columns: 1fr; }
    .form-grid { grid-template-columns: 1fr; }
    .brand { align-items: flex-start; }
    .logo { width: 42px; height: 42px; }
    .btn, button { width: 100%; }
    .section-title { align-items: flex-start; flex-direction: column; }
    .info-row { flex-direction: column; gap: 3px; }
    .info-row span:last-child { text-align: left; }
}
@media print {
    body { background: white; color: #111827; }
    .card { box-shadow: none; border-color: #ddd; background: white; }
    .btn, .no-print { display: none !important; }
    .muted, .info-row span:first-child { color: #475569; }
}

.top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.version-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(250,204,21,.35);
    background: rgba(250,204,21,.12);
    color: #fde68a;
    border-radius: 999px;
    padding: 9px 12px;
    font-weight: 900;
    font-size: 13px;
    white-space: nowrap;
}
.checkline {
    display: flex;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    padding: 11px 12px;
}
.checkline input { width: auto; }
.install-page .copybox { justify-content: flex-start; }
.footer-version {
    text-align: center;
    margin: 18px 0 0;
}
@media (max-width: 620px) {
    .top-actions { width: 100%; justify-content: stretch; }
    .top-actions .btn, .top-actions button { flex: 1 1 100%; }
    .version-badge { width: 100%; }
}

/* ===============================
   v0.04 Mobile + parts UI upgrade
   =============================== */
.inline-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.inline-actions form { margin: 0; }
.parts-grid {
    display: grid;
    gap: 12px;
}
.part-card {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.055);
}
.admin-layout > aside.card {
    position: sticky;
    top: 14px;
}
.responsive-table input,
.responsive-table select {
    min-width: 150px;
}
@media (max-width: 900px) {
    .admin-layout > aside.card { position: static; }
    .job-list { max-height: 360px; overflow: auto; padding-right: 2px; }
}
@media (max-width: 760px) {
    body { background-attachment: fixed; }
    .container { width: min(100% - 14px, 1180px); }
    .brand h1 { font-size: 24px; }
    .brand p { font-size: 13px; }
    .stat { min-height: auto; padding: 12px; }
    .stat .value { font-size: 28px; }
    .copybox { flex-direction: column; align-items: stretch; }
    .copybox .btn { width: 100%; }
    .money-row, .part-card { flex-direction: column; }
    .part-card > div:last-child { justify-items: start !important; }
    .table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    table { min-width: 720px; }
    td, th { padding: 10px; }
    .responsive-table { min-width: 0; border-spacing: 0 12px; }
    .responsive-table thead { display: none; }
    .responsive-table tr {
        display: grid;
        gap: 8px;
        background: rgba(255,255,255,.055);
        border: 1px solid rgba(255,255,255,.10);
        border-radius: 18px;
        padding: 12px;
        margin-bottom: 12px;
    }
    .responsive-table td {
        display: grid;
        gap: 6px;
        padding: 0;
        border: 0 !important;
        background: transparent;
        border-radius: 0 !important;
    }
    .responsive-table td::before {
        content: attr(data-label);
        color: var(--muted);
        font-size: 12px;
        font-weight: 800;
    }
    .responsive-table input,
    .responsive-table select { min-width: 0; }
    .inline-actions, .inline-actions form, .inline-actions button { width: 100%; }
}
@media (max-width: 430px) {
    .logo { width: 38px; height: 38px; border-radius: 13px; }
    .card { padding: 12px; }
    .pill { padding: 7px 10px; font-size: 12px; }
    input, select, textarea { padding: 11px; }
    .big-title { font-size: 30px; }
}
.admin-part-card {
    display: grid;
    grid-template-columns: 1.4fr 1fr .8fr 1fr;
    gap: 10px;
    align-items: end;
}
.admin-part-card .wide { grid-column: 1 / -1; }
@media (max-width: 900px) { .admin-part-card { grid-template-columns: 1fr; } }

/* ===============================
   v0.05 Customer day counter boxes
   =============================== */
.day-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.day-stat {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: center;
    border: 1px solid rgba(255,255,255,.14);
    background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
    border-radius: 22px;
    padding: 18px;
    box-shadow: 0 20px 60px rgba(0,0,0,.22);
    min-height: 118px;
}
.day-stat .label {
    color: var(--muted);
    font-size: 14px;
    font-weight: 900;
}
.day-value {
    margin-top: 4px;
    font-size: clamp(28px, 4vw, 46px);
    font-weight: 950;
    line-height: 1;
    letter-spacing: -1px;
}
.day-icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    font-size: 24px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.14);
}
.day-stat p { margin: 6px 0 0; }
.day-stat.is-good { border-color: rgba(34,197,94,.30); background: linear-gradient(180deg, rgba(34,197,94,.14), rgba(255,255,255,.06)); }
.day-stat.is-work { border-color: rgba(56,189,248,.30); background: linear-gradient(180deg, rgba(56,189,248,.14), rgba(255,255,255,.06)); }
.day-stat.is-wait { border-color: rgba(250,204,21,.24); background: linear-gradient(180deg, rgba(250,204,21,.12), rgba(255,255,255,.05)); }
@media (max-width: 900px) {
    .day-stat-grid { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
    .day-stat { grid-template-columns: 1fr; gap: 10px; padding: 14px; }
    .day-icon { width: 44px; height: 44px; border-radius: 15px; }
    .day-value { font-size: 32px; }
}

/* ===============================
   v0.06 Admin usability upgrade
   =============================== */
.admin-v6-container { width: min(1480px, calc(100% - 28px)); }
.admin-v6-layout {
    display: grid;
    grid-template-columns: 380px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
.admin-v6-sidebar {
    position: sticky;
    top: 12px;
    max-height: calc(100vh - 24px);
    overflow: auto;
}
.compact-title { margin-bottom: 10px; }
.admin-search {
    margin-bottom: 10px;
    background: rgba(0,0,0,.24);
}
.admin-filter-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.filter-chip {
    width: auto;
    padding: 8px 10px;
    font-size: 12px;
    border-radius: 999px;
    color: var(--text);
    background: rgba(255,255,255,.08);
    border: 1px solid var(--line);
    box-shadow: none;
}
.filter-chip.active {
    color: #111827;
    background: linear-gradient(135deg, #facc15, #fb923c);
}
.admin-job-list {
    max-height: 54vh;
    overflow: auto;
    padding-right: 3px;
}
.admin-job-item { display: grid; gap: 8px; }
.job-item-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
}
.job-item-head strong { font-size: 17px; }
.job-mini-progress {
    height: 7px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255,255,255,.12);
}
.job-mini-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #facc15, #22c55e, #38bdf8);
}
.job-money-line {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: var(--muted);
}
.admin-create-box {
    margin-top: 14px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(0,0,0,.16);
    padding: 12px;
}
.admin-create-box summary {
    cursor: pointer;
    font-weight: 950;
    color: #fde68a;
}
.compact-form { gap: 10px; }
.compact-form textarea { min-height: 76px; }
.admin-v6-main { display: grid; gap: 16px; min-width: 0; }
.workspace-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}
.workspace-title h2 {
    margin: 12px 0 4px;
    font-size: clamp(28px, 4vw, 48px);
    line-height: .95;
}
.workspace-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}
.progress-topline {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--muted);
    font-weight: 850;
    margin-bottom: 8px;
}
.quick-status-form {
    margin-top: 14px;
    display: grid;
    grid-template-columns: 180px 160px minmax(240px, 1fr) auto;
    gap: 10px;
    align-items: end;
}
.quick-preset-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.quick-preset-row form { margin: 0; }
.quick-preset-row .btn { width: auto; }
.admin-summary-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-summary-cards .stat { min-height: 118px; }
.admin-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
    gap: 16px;
    align-items: start;
}
.admin-quick-adds {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.mini-card .section-title h2 { font-size: 18px; }
.admin-part-card-v6 {
    display: grid;
    grid-template-columns: 1.4fr 1fr .75fr 1fr;
    gap: 10px;
    align-items: end;
}
.admin-part-card-v6 .wide { grid-column: 1 / -1; }
.money-edit-list { display: grid; gap: 12px; }
.money-edit-row {
    display: grid;
    grid-template-columns: 150px 1fr 130px 1fr auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.055);
    border-radius: 18px;
}
.money-actions { justify-content: flex-end; }
.admin-update-card {
    grid-template-columns: 220px minmax(0, 1fr);
    align-items: stretch;
}
.admin-update-card > a img,
.admin-update-card > img { height: 100%; object-fit: cover; }
.no-photo-box {
    display: grid;
    place-items: center;
    min-height: 160px;
}
.update-edit-form { align-content: start; }
.admin-danger-zone { margin-bottom: 8px; }
.empty-state-card { min-height: 280px; display: grid; place-items: center; text-align: center; }
@media (max-width: 1180px) {
    .admin-v6-layout { grid-template-columns: 340px minmax(0, 1fr); }
    .admin-two-col { grid-template-columns: 1fr; }
    .admin-quick-adds { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .quick-status-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .quick-status-form button { grid-column: 1 / -1; }
    .money-edit-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .money-actions { grid-column: 1 / -1; justify-content: stretch; }
}
@media (max-width: 900px) {
    .admin-v6-layout { grid-template-columns: 1fr; }
    .admin-v6-sidebar { position: static; max-height: none; overflow: visible; }
    .admin-job-list { max-height: 380px; }
    .admin-summary-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .workspace-title { flex-direction: column; }
    .workspace-actions { width: 100%; justify-content: stretch; }
    .workspace-actions .btn, .workspace-actions button { flex: 1 1 160px; }
    .admin-update-card { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .admin-v6-container { width: min(100% - 14px, 1480px); }
    .admin-dashboard-cards,
    .admin-summary-cards,
    .admin-quick-adds,
    .quick-status-form,
    .money-edit-row,
    .admin-part-card-v6 { grid-template-columns: 1fr; }
    .admin-summary-cards .stat { min-height: auto; }
    .progress-topline { flex-direction: column; gap: 4px; }
    .quick-preset-row form,
    .quick-preset-row .btn { width: 100%; }
    .job-item-head { flex-direction: column; }
    .admin-update-card > a img { max-height: 260px; }
    .filter-chip { flex: 1 1 calc(50% - 8px); }
}

/* ===============================
   v0.22 Admin split-by-vehicle layout
   =============================== */
.admin-v7-page .container,
.admin-v7-container{max-width:1360px}
.admin-v7-topbar{align-items:flex-start;gap:16px}
.admin-v7-control-panel{display:grid;gap:14px;margin:16px 0 18px}
.admin-v7-new-job summary{cursor:pointer;font-size:18px;font-weight:900;color:#fff;list-style:none;padding:4px 0}
.admin-v7-new-job summary::-webkit-details-marker{display:none}
.add-job-form-v7{margin-top:14px}
.admin-v7-toolbar{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;position:sticky;top:10px;z-index:6;backdrop-filter:blur(12px)}
.admin-v7-toolbar h2{margin:0 0 4px;font-size:24px}
.admin-v7-search-zone{min-width:360px;max-width:580px;flex:1}
.admin-v7-car-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.admin-car-card{display:flex;flex-direction:column;gap:14px;border:1px solid rgba(255,255,255,.09);scroll-margin-top:120px}
.admin-car-card.selected{box-shadow:0 0 0 2px rgba(250,185,30,.6),0 24px 60px rgba(0,0,0,.35)}
.car-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.car-card-head h2{margin:10px 0 5px;font-size:30px;line-height:1}
.car-card-price{text-align:right;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:10px 12px;min-width:120px}
.car-card-price strong{display:block;font-size:24px;line-height:1;color:#fff}
.car-card-price span{display:block;font-size:12px;color:var(--muted)}
.compact-progress{margin-top:0}
.car-mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.car-mini-stats div{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:9px;min-width:0}
.car-mini-stats span,.car-mini-stats em{display:block;color:var(--muted);font-size:11px;font-style:normal}
.car-mini-stats b{display:block;font-size:20px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.car-money-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.car-money-row span{background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.06);border-radius:13px;padding:8px 10px;color:var(--muted);font-size:12px}
.car-money-row b{display:block;color:#fff;font-size:16px;margin-top:3px}
.car-note{margin:0;background:rgba(250,185,30,.10);border:1px solid rgba(250,185,30,.16);padding:11px 12px;border-radius:14px;color:#fff}
.car-card-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.quick-edit-details{display:inline-block;flex:1 1 140px;min-width:140px}
.quick-edit-details>summary{list-style:none;cursor:pointer;text-align:center}
.quick-edit-details>summary::-webkit-details-marker{display:none}
.quick-edit-details[open]{display:block;flex-basis:100%;order:10;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:10px}
.quick-edit-details[open]>summary{margin-bottom:10px;background:rgba(255,255,255,.10)}
.quick-card-form{grid-template-columns:repeat(3,1fr)}
.quick-card-form textarea{min-height:52px}
.card-preset-row{border-top:1px solid rgba(255,255,255,.07);padding-top:10px;margin-top:0}
.card-preset-row form{flex:1}.card-preset-row button{width:100%}
.admin-full-editor{display:grid;gap:14px;margin-top:22px;scroll-margin-top:20px}
.full-editor-title{position:sticky;top:10px;z-index:7;background:rgba(15,23,42,.92);border:1px solid rgba(255,255,255,.09);border-radius:20px;padding:14px;backdrop-filter:blur(12px)}
.full-editor-title h2{margin:0 0 4px}
.inline-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

@media (max-width: 1100px){
    .admin-v7-car-grid{grid-template-columns:1fr}
    .admin-v7-toolbar{position:static;display:grid}
    .admin-v7-search-zone{min-width:0;max-width:none;width:100%}
}
@media (max-width: 720px){
    .admin-v7-page .container{padding:12px}
    .admin-v7-topbar,.admin-v7-topbar .top-actions{display:grid;width:100%}
    .admin-v7-topbar .top-actions .btn,.admin-v7-topbar .top-actions a{width:100%;justify-content:center}
    .car-card-head{display:grid}
    .car-card-head h2{font-size:26px}
    .car-card-price{text-align:left;min-width:0;width:100%}
    .car-mini-stats{grid-template-columns:repeat(2,1fr)}
    .car-money-row{grid-template-columns:1fr}
    .car-card-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
    .car-card-actions .btn,.quick-edit-details,.quick-edit-details>summary{width:100%}
    .quick-edit-details[open]{grid-column:1/-1}
    .quick-card-form{grid-template-columns:1fr}
    .card-preset-row{display:grid;grid-template-columns:1fr 1fr}
    .full-editor-title{position:static}
    .full-editor-title .inline-actions{display:grid;width:100%}
    .full-editor-title .btn{width:100%;justify-content:center}
}

/* ===============================
   v0.22 Compact admin list/grid controls + single manage button
   =============================== */
.admin-v7-container{max-width:1320px}
.admin-dashboard-cards{gap:10px;margin-bottom:10px}
.admin-dashboard-cards .stat{padding:12px 14px;min-height:92px}
.admin-dashboard-cards .stat .value{font-size:26px}
.admin-v7-control-panel{gap:10px;margin:12px 0}
.admin-v7-new-job{padding:14px 16px}
.admin-v7-new-job summary{font-size:16px}
.admin-v7-toolbar{padding:14px 16px;gap:12px;align-items:center}
.admin-v7-toolbar h2{font-size:20px;margin-bottom:2px}
.admin-v7-toolbar p{margin:0;font-size:12px}
.admin-v7-search-zone{display:grid;gap:8px}
.admin-view-controls{display:flex;gap:8px;align-items:end;flex-wrap:wrap;background:rgba(0,0,0,.14);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:8px}
.admin-view-controls label{font-size:11px;color:var(--muted);min-width:130px;display:grid;gap:3px}
.admin-view-controls select{height:34px;border-radius:10px;padding:0 10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.10);color:#fff}
.admin-view-controls #visibleCounter{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.07);margin-left:auto;white-space:nowrap}
.admin-filter-row{gap:6px}
.filter-chip{padding:7px 10px;font-size:12px;border-radius:999px}

.admin-v7-car-grid.view-grid,
.admin-v7-car-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.admin-v7-car-grid.view-list{grid-template-columns:1fr;gap:8px}
.admin-car-card{padding:12px;gap:8px;border-radius:18px;min-height:0}
.admin-car-card.selected{box-shadow:0 0 0 2px rgba(250,185,30,.65),0 14px 34px rgba(0,0,0,.28)}
.car-card-head{gap:8px}
.car-card-head h2{font-size:21px;margin:6px 0 3px;letter-spacing:.2px}
.car-card-head .small{font-size:11px;line-height:1.35}
.car-card-price{padding:7px 9px;border-radius:13px;min-width:88px}
.car-card-price strong{font-size:17px}
.car-card-price span{font-size:10px}
.compact-progress .progress-topline{font-size:11px;margin-bottom:4px}
.compact-progress .progress-bar{height:8px;border-radius:999px}
.car-mini-stats{gap:5px}
.car-mini-stats div{padding:6px 7px;border-radius:11px}
.car-mini-stats span,.car-mini-stats em{font-size:9px;line-height:1.15}
.car-mini-stats b{font-size:14px;line-height:1.2;margin:2px 0}
.car-money-row{gap:5px}
.car-money-row span{padding:6px 7px;border-radius:10px;font-size:10px}
.car-money-row b{font-size:13px;margin-top:1px}
.car-note{font-size:12px;line-height:1.35;padding:8px 9px;border-radius:11px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.car-card-actions-v8{display:grid;grid-template-columns:1fr;gap:7px;margin-top:2px}
.car-card-actions-v8 .btn{width:100%;min-height:36px;padding:8px 10px;font-size:12px;border-radius:12px;justify-content:center}

.admin-v7-car-grid.view-list .admin-car-card{display:grid;grid-template-columns:minmax(190px,1.1fr) minmax(220px,1.3fr) minmax(270px,1.6fr) auto;align-items:center;gap:10px;padding:10px 12px}
.admin-v7-car-grid.view-list .car-card-head{display:flex;align-items:center;min-width:0}
.admin-v7-car-grid.view-list .car-card-head h2{font-size:18px;margin:4px 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-v7-car-grid.view-list .car-card-price{min-width:86px}
.admin-v7-car-grid.view-list .compact-progress{min-width:190px}
.admin-v7-car-grid.view-list .car-mini-stats{grid-template-columns:repeat(4,minmax(58px,1fr));min-width:0}
.admin-v7-car-grid.view-list .car-money-row{grid-template-columns:repeat(3,minmax(70px,1fr));min-width:0}
.admin-v7-car-grid.view-list .car-note{display:none}
.admin-v7-car-grid.view-list .car-card-actions-v8{width:120px;grid-template-columns:1fr;gap:5px}


.car-card-actions-v8.single-action .btn{min-height:38px}
.admin-v7-car-grid.view-list .car-card-actions-v8.single-action{width:120px}

#job-main-form{scroll-margin-top:96px}

@media (max-width: 1280px){
    .admin-v7-car-grid.view-grid,.admin-v7-car-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .admin-v7-car-grid.view-list .admin-car-card{grid-template-columns:1.1fr 1.2fr 1.4fr auto}
}
@media (max-width: 980px){
    .admin-v7-car-grid.view-grid,.admin-v7-car-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .admin-v7-car-grid.view-list .admin-car-card{grid-template-columns:1fr;align-items:stretch}
    .admin-v7-car-grid.view-list .car-card-actions-v8{width:100%;grid-template-columns:1fr}
}
@media (max-width: 720px){
    .admin-v7-toolbar{position:static;display:grid;padding:12px}
    .admin-view-controls{display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
    .admin-view-controls label{min-width:0}
    .admin-view-controls #visibleCounter{grid-column:1/-1;margin-left:0;text-align:center}
    .admin-v7-car-grid.view-grid,.admin-v7-car-grid{grid-template-columns:1fr}
    .admin-car-card{padding:11px}
    .car-card-head{grid-template-columns:1fr auto;display:grid;align-items:start}
    .car-card-price{width:auto;min-width:88px;text-align:right}
    .car-mini-stats{grid-template-columns:repeat(4,1fr)}
    .car-money-row{grid-template-columns:repeat(3,1fr)}
    .car-card-actions-v8{grid-template-columns:1fr!important}
}
@media (max-width: 430px){
    .car-card-head{grid-template-columns:1fr}
    .car-card-price{width:100%;text-align:left}
    .car-mini-stats{grid-template-columns:repeat(2,1fr)}
    .car-money-row{grid-template-columns:1fr}
    .admin-view-controls{grid-template-columns:1fr}
    .car-card-actions-v8{grid-template-columns:1fr!important}
}

/* v0.22 Move view controls below vehicle list */
.admin-bottom-view-controls{
    margin-top:14px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
}
.admin-bottom-view-controls h2{
    margin:0 0 3px;
    font-size:20px;
}
.admin-bottom-view-controls p{
    margin:0;
    font-size:12px;
}
@media (max-width:760px){
    .admin-bottom-view-controls{
        display:grid;
        align-items:stretch;
    }
}

/* v0.22 slim view controls moved into top strip */
.admin-inline-view-strip{margin-top:8px;margin-bottom:10px}.admin-view-controls.slim{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:44px;padding:6px 10px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}.admin-view-controls.slim label{min-width:120px;gap:2px;font-size:10px}.admin-view-controls.slim select{height:32px;border-radius:10px;padding:0 10px}.admin-view-controls.slim #visibleCounter{margin-left:auto;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06)}@media (max-width:760px){.admin-inline-view-strip{margin-top:10px}.admin-view-controls.slim{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;padding:8px}.admin-view-controls.slim label{min-width:0}.admin-view-controls.slim #visibleCounter{grid-column:1/-1;margin-left:0;text-align:center}}@media (max-width:520px){.admin-view-controls.slim{grid-template-columns:1fr}}

/* ===============================
   v0.24 One-click installer update
   =============================== */
.quick-update-box{
    margin:0 0 14px;
    padding:16px;
    border:1px solid rgba(250,204,21,.36);
    border-radius:20px;
    background:
        radial-gradient(circle at top left, rgba(250,204,21,.18), transparent 20rem),
        rgba(250,204,21,.07);
    box-shadow:0 18px 50px rgba(250,204,21,.09);
    display:grid;
    gap:10px;
}
.quick-update-box button{
    width:100%;
    min-height:48px;
    font-size:16px;
}
.quick-update-box p{margin:0;line-height:1.45}
.manual-install-sep{
    margin:8px 0 14px;
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--muted);
    font-size:12px;
    font-weight:800;
}
.manual-install-sep:before,
.manual-install-sep:after{
    content:"";
    height:1px;
    background:rgba(255,255,255,.13);
    flex:1;
}


/* ===============================
   v0.37 Full price display fix
   ไม่ตัดราคาเป็น ... ในการ์ดงาน
   =============================== */
.admin-car-card .money-value{
    white-space:nowrap !important;
    overflow:visible !important;
    text-overflow:clip !important;
    letter-spacing:-.25px;
    font-variant-numeric:tabular-nums;
}
.admin-car-card .car-card-price{
    min-width:96px;
}
.admin-car-card .car-card-price .money-value{
    font-size:16px !important;
    line-height:1.1;
}
.admin-car-card .car-mini-stats .money-value{
    font-size:11px !important;
    line-height:1.15;
}
.admin-car-card .car-money-row .money-value{
    font-size:11px !important;
    line-height:1.2;
}
.admin-v7-car-grid.view-list .car-card-price .money-value{
    font-size:15px !important;
}
@media (max-width:720px){
    .admin-car-card .car-card-price .money-value{font-size:15px !important;}
    .admin-car-card .car-mini-stats .money-value,
    .admin-car-card .car-money-row .money-value{font-size:11px !important;}
}