/* Technoflexzone admin */
*,*::before,*::after{box-sizing:border-box;margin:0}
:root{
  --brand:#2563c9; --brand-deep:#0f2f63; --brand-light:#5790e6;
  --surface:#f4f4f4; --ink:#0a0a0a; --ink-soft:#717784; --hairline:#e6e8ec;
  --ok:#16a34a; --warn:#d97706; --danger:#dc2626;
}
body{font-family:"Onest",system-ui,sans-serif;background:var(--surface);color:var(--ink);min-height:100vh}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
img{max-width:100%;display:block}

.admin-top{background:var(--brand-deep);color:#fff;padding:1rem 1.5rem;display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.admin-top .brand{display:flex;align-items:center;gap:.5rem;font-weight:500;text-transform:uppercase;letter-spacing:.15em}
.admin-top .brand svg{width:1.25rem;height:1.25rem}
.admin-top nav{display:flex;gap:.25rem;flex:1;flex-wrap:wrap}
.admin-top nav a{padding:.5rem .9rem;border-radius:999px;font-size:.85rem;color:rgba(255,255,255,.75)}
.admin-top nav a:hover{background:rgba(255,255,255,.1);color:#fff}
.admin-top nav a.active{background:rgba(255,255,255,.15);color:#fff}
.admin-top .out{font-size:.85rem;color:rgba(255,255,255,.7)}
.admin-top .out:hover{color:#fff}

.wrap{max-width:70rem;margin:0 auto;padding:1.5rem}
.card{background:#fff;border:1px solid var(--hairline);border-radius:1rem;padding:1.5rem;margin-bottom:1.25rem}
.card h1,.card h2{font-weight:500;letter-spacing:-.01em}
.card h1{font-size:1.5rem}
.card h2{font-size:1.15rem}
.muted{color:var(--ink-soft);font-size:.875rem}

.flash{border-radius:.75rem;padding:.75rem 1rem;margin-bottom:1rem;font-size:.9rem}
.flash.ok{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.flash.err{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}

table{width:100%;border-collapse:collapse;font-size:.9rem}
th{ text-align:left;color:var(--ink-soft);font-weight:500;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;padding:.6rem .75rem;border-bottom:1px solid var(--hairline)}
td{padding:.7rem .75rem;border-bottom:1px solid var(--hairline);vertical-align:middle}
tr:hover td{background:#fafafa}
.unread td{font-weight:500;background:#f0f6ff}

label{display:block;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft);margin-bottom:.35rem}
input[type=text],input[type=email],input[type=password],input[type=number],textarea,select{
  width:100%;border:1px solid var(--hairline);border-radius:.6rem;padding:.65rem .85rem;font:inherit;font-size:.9rem;background:#fff}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--brand-light);box-shadow:0 0 0 2px rgba(87,144,230,.25)}
input[type=file]{font-size:.85rem}
.field{margin-bottom:1rem}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:700px){.grid2{grid-template-columns:1fr}}

.btn{display:inline-flex;align-items:center;gap:.4rem;border:0;border-radius:999px;padding:.6rem 1.2rem;font-size:.85rem;font-weight:500;background:var(--ink);color:#fff}
.btn:hover{background:var(--brand-deep)}
.btn.brand{background:var(--brand)}
.btn.brand:hover{background:var(--brand-deep)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--hairline)}
.btn.ghost:hover{border-color:var(--ink)}
.btn.danger{background:var(--danger)}
.btn.danger:hover{background:#991b1b}
.btn.sm{padding:.35rem .8rem;font-size:.78rem}

.badge{display:inline-block;border-radius:999px;padding:.2rem .7rem;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em}
.badge.quote{background:#eef2ff;color:#3730a3}
.badge.deposit{background:#fef3c7;color:#92400e}
.badge.design{background:#fce7f3;color:#9d174d}
.badge.development{background:#dbeafe;color:#1e40af}
.badge.review{background:#fef9c3;color:#854d0e}
.badge.live{background:#dcfce7;color:#166534}
.badge.cat{background:var(--surface);color:var(--ink-soft)}

.progress{height:.4rem;background:var(--hairline);border-radius:999px;overflow:hidden;min-width:6rem}
.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-light));border-radius:999px}

.timeline{list-style:none;padding:0;margin:0}
.timeline li{border-left:2px solid var(--hairline);padding:0 0 1.25rem 1.25rem;position:relative}
.timeline li::before{content:"";position:absolute;left:-.4rem;top:.2rem;width:.7rem;height:.7rem;border-radius:50%;background:var(--brand)}
.timeline .when{font-size:.75rem;color:var(--ink-soft)}
.timeline img{margin-top:.5rem;border-radius:.6rem;max-width:20rem;border:1px solid var(--hairline)}

.login-shell{min-height:100vh;display:grid;place-items:center;background:var(--brand-deep);padding:1.5rem}
.login-card{background:#fff;border-radius:1.25rem;padding:2rem;width:100%;max-width:24rem}
.login-card .brand{display:flex;align-items:center;gap:.5rem;font-weight:500;text-transform:uppercase;letter-spacing:.15em;color:var(--brand-deep);margin-bottom:1.25rem}
.login-card .brand svg{width:1.4rem;height:1.4rem}

.row-actions{display:flex;gap:.4rem;flex-wrap:wrap}
.copy-link{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.copy-link code{background:var(--surface);padding:.5rem .75rem;border-radius:.5rem;font-size:.8rem;word-break:break-all}
.tabs-note{font-size:.8rem;color:var(--ink-soft);margin-top:.5rem}
.thumb-mini{width:3.5rem;height:2.5rem;object-fit:cover;border-radius:.4rem;border:1px solid var(--hairline)}
