/* Shared styles for login / account / admin pages */
.auth-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:40px 20px;background:
  radial-gradient(90% 120% at 80% 10%,rgba(120,70,150,.25),transparent 55%),
  linear-gradient(135deg,#16101f,#0e0b14 60%,#1a0f16)}
.auth-brand{display:flex;flex-direction:column;align-items:center;line-height:1}
.auth-brand .brand-mark{color:#fff}
.auth-card{background:#fff;width:100%;max-width:420px;border-radius:10px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.auth-tabs{display:flex;gap:8px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.auth-tab{flex:1;background:none;border:none;padding:12px;font-family:var(--font-b);font-weight:700;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.auth-tab.active{color:var(--black);border-bottom-color:var(--red)}
.auth-form{display:flex;flex-direction:column;gap:16px}
.auth-form label{display:flex;flex-direction:column;gap:6px;font-size:.78rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.auth-form input{padding:13px 14px;border:1px solid var(--line);border-radius:6px;font-family:var(--font-b);font-size:.95rem;color:var(--ink)}
.auth-form input:focus{outline:none;border-color:var(--red)}
.auth-msg{margin-top:16px;font-size:.86rem;text-align:center;min-height:20px}
.auth-msg.err{color:var(--red)}
.auth-msg.ok{color:#1a8a3c}
.auth-note{margin-top:14px;font-size:.76rem;color:var(--muted);text-align:center}

/* Dashboard shell (account + admin) */
.dash{min-height:100vh;background:var(--grey)}
.dash-top{background:#fff;border-bottom:1px solid var(--line)}
.dash-top .container{display:flex;align-items:center;justify-content:space-between;height:72px}
.dash-top .brand{flex-direction:row;gap:8px;align-items:baseline}
.dash-top .brand-mark{font-size:1.4rem}
.dash-top .brand-sub{margin:0}
.dash-actions{display:flex;align-items:center;gap:16px}
.dash-actions a{font-weight:600;font-size:.9rem}
.dash-actions a:hover{color:var(--red)}
.logout-btn{background:var(--black);color:#fff;border:none;padding:9px 18px;border-radius:4px;font-family:var(--font-b);font-weight:700;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.logout-btn:hover{background:var(--red)}
.dash-body{max-width:1100px;margin:0 auto;padding:40px 24px}
.dash-h{font-family:var(--font-d);font-weight:400;font-size:2.4rem;text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px}
.dash-sub{color:var(--muted);margin-bottom:30px}
.panel{background:#fff;border:1px solid var(--line);border-radius:10px;padding:24px;margin-bottom:26px}
.panel h3{font-family:var(--font-d);font-weight:400;font-size:1.4rem;text-transform:uppercase;letter-spacing:.03em;margin-bottom:18px}

/* Tables */
.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th,.tbl td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl th{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tbl tr:last-child td{border-bottom:none}
.pill{display:inline-block;padding:4px 10px;border-radius:20px;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#e9f7ee;color:#1a8a3c}
.empty{color:var(--muted);text-align:center;padding:40px 0}

/* Admin product manager */
.prod-row{display:grid;grid-template-columns:48px 1fr 90px 90px 110px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.prod-row img{width:48px;height:60px;object-fit:contain;background:#100c16;border-radius:4px}
.prod-row input{padding:8px 10px;border:1px solid var(--line);border-radius:5px;font-family:var(--font-b);font-size:.86rem;width:100%}
.mini{background:none;border:1px solid var(--line);border-radius:5px;padding:7px 12px;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.mini.save{background:var(--black);color:#fff;border-color:var(--black)}
.mini.del{color:var(--red);border-color:#f0c2c8}
.mini:hover{opacity:.85}

/* Product cards with photo manager */
.prod-card{border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:16px}
.prod-card .pc-head{display:grid;grid-template-columns:56px 1fr 110px auto auto;gap:14px;align-items:center}
.prod-card .pc-head img{width:56px;height:70px;object-fit:contain;background:#100c16;border-radius:5px}
.prod-card .pc-name{font-weight:800;font-size:1rem}
.prod-card .pc-slug{font-size:.72rem;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
.prod-card input[type="number"],.prod-card input[type="text"]{padding:8px 10px;border:1px solid var(--line);border-radius:5px;font-family:var(--font-b);font-size:.86rem;width:100%}
.prod-card .pc-avail{display:flex;align-items:center;gap:6px;font-size:.8rem;white-space:nowrap}
.photos{margin-top:14px;border-top:1px dashed var(--line);padding-top:12px}
.photos h4{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.photo-row{display:grid;grid-template-columns:42px 1fr 90px auto;gap:10px;align-items:center;margin-bottom:8px}
.photo-row img{width:42px;height:52px;object-fit:contain;background:#100c16;border-radius:4px}
.photo-row .ph-label{font-size:.72rem;color:var(--muted);text-align:center}
.photos .add-photo{margin-top:4px}
.add-form{display:grid;grid-template-columns:1fr 1fr 100px 100px auto;gap:10px;margin-top:18px}
.add-form input{padding:10px 12px;border:1px solid var(--line);border-radius:6px;font-family:var(--font-b);font-size:.88rem}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:26px}
.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px}
.stat .n{font-family:var(--font-d);font-weight:400;font-size:2rem;color:var(--black)}
.stat .l{font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

/* Dashboard tabs */
.tabs{display:flex;gap:6px;margin-bottom:22px;flex-wrap:wrap}
.tab-btn{background:#fff;border:1px solid var(--line);border-radius:30px;padding:9px 20px;font-family:var(--font-b);font-weight:700;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);cursor:pointer;transition:.2s}
.tab-btn:hover{color:var(--ink)}
.tab-btn.active{background:var(--black);color:#fff;border-color:var(--black)}
.tab-pane[hidden]{display:none}

/* Panel header with inline tools (filter) */
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.panel-head h3{margin-bottom:0}
.panel-head .filter{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:none;border:1px solid var(--line);border-radius:20px;padding:6px 14px;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);cursor:pointer}
.chip.active{background:var(--grey);color:var(--ink);border-color:#ccc}

/* Status select + pills */
.status-sel{padding:6px 8px;border:1px solid var(--line);border-radius:6px;font-family:var(--font-b);font-size:.8rem;font-weight:600;cursor:pointer;background:#fff}
.pill.pending{background:#fff4e5;color:#b5651d}
.pill.fulfilled{background:#e9f7ee;color:#1a8a3c}
.pill.cancelled{background:#fdeef0;color:var(--red)}
.pill.paid{background:#e9f7ee;color:#1a8a3c}
.pill.created,.pill.cod{background:#eef1f7;color:#4a5878}
.pill.failed{background:#fdeef0;color:var(--red)}
.tbl td .muted{color:var(--muted);font-size:.82rem}

/* Coupons */
.coupon-form{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:end}
.coupon-form label{display:flex;flex-direction:column;gap:6px;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.coupon-form input,.coupon-form select{padding:9px 10px;border:1px solid var(--line);border-radius:5px;font-family:var(--font-b);font-size:.88rem;text-transform:none;letter-spacing:0}
.coupon-form #cCode{text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.coupon-form button{grid-column:1/-1;justify-self:start}
.c-toggle,.c-del{margin-right:6px}
.c-del{color:var(--red);border-color:#f0c2c8}

@media(max-width:700px){
  .add-form,.prod-row{grid-template-columns:1fr 1fr}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .coupon-form{grid-template-columns:1fr 1fr}
}
