/* ==========================================================================
   Petrol THC — Employee Order Dashboard
   Relies on CSS variables/fonts from ../../assets/site.css.
   ========================================================================== */

/* ---------- Login ---------- */
.admin-login-body{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
}
.admin-login-card{
  background:#fff; border:4px solid var(--petrol-blue); border-radius:4px;
  max-width:380px; width:100%; text-align:center; padding:40px 32px;
}
.admin-login-card img{height:56px; margin:0 auto 16px;}
.admin-login-card h1{font-family:var(--font-display); font-size:1.8rem; color:var(--petrol-blue); margin:0 0 6px;}
.admin-login-card p{font-size:0.9rem; color:#666; margin:0 0 20px;}
.admin-login-error{
  background:#fdeceb; color:#c0392b; border:1px solid #c0392b; border-radius:4px;
  padding:10px 14px; font-size:0.85rem; margin:0 0 18px !important;
}
.admin-login-form{display:flex; flex-direction:column; gap:16px; text-align:left;}
.admin-login-form label{
  display:flex; flex-direction:column; font-family:var(--font-stamp); font-size:0.72rem;
  font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--petrol-blue);
}
.admin-login-form input{
  margin-top:8px; padding:12px 14px; border:2px solid var(--petrol-blue); border-radius:2px;
  font-family:var(--font-body); font-size:0.95rem;
}
.admin-login-form .btn{width:100%; justify-content:center; margin-top:6px;}

/* ---------- Shell ---------- */
.admin-body{margin:0;}
.admin-header{background:var(--petrol-blue); padding:16px 0;}
.admin-header-inner{
  max-width:1100px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.admin-brand{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:1.3rem; color:#fff; letter-spacing:0.02em;}
.admin-brand img{height:34px;}
.admin-header-right{display:flex; align-items:center; gap:16px;}
.admin-user{font-family:var(--font-stamp); font-size:0.75rem; color:var(--sign-cream); opacity:0.85;}
.admin-logout{
  font-family:var(--font-stamp); font-size:0.72rem; letter-spacing:0.05em; text-transform:uppercase;
  color:#fff; text-decoration:none; border:2px solid var(--petrol-orange); border-radius:2px; padding:8px 14px;
}
.admin-logout:hover{background:var(--petrol-orange);}

.admin-main{max-width:1100px; margin:0 auto; padding:32px 24px 80px;}

/* ---------- Stats ---------- */
.admin-stats{display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin-bottom:24px;}
.admin-stat{
  background:#fff; border:2px solid var(--petrol-blue); border-radius:4px;
  padding:18px; text-align:center;
}
.admin-stat-num{display:block; font-family:var(--font-display); font-size:2.2rem; color:var(--petrol-blue); line-height:1;}
.admin-stat-label{
  display:block; margin-top:6px; font-family:var(--font-stamp); font-size:0.66rem;
  letter-spacing:0.04em; text-transform:uppercase; color:#888;
}
.admin-stat-new .admin-stat-num{color:var(--petrol-orange);}
.admin-stat-pending .admin-stat-num{color:#c9971f;}
.admin-stat-done .admin-stat-num{color:#2E9E5B;}

@media (max-width:640px){
  .admin-stats{grid-template-columns:1fr 1fr;}
}

/* ---------- Filters ---------- */
.admin-filters{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:24px;}
.admin-filter{
  font-family:var(--font-stamp); font-size:0.72rem; letter-spacing:0.04em; text-transform:uppercase;
  background:#fff; color:var(--petrol-blue); border:2px solid var(--petrol-blue); border-radius:999px;
  padding:8px 16px; cursor:pointer;
}
.admin-filter.is-active{background:var(--petrol-blue); color:#fff;}

/* ---------- Order rows (rollup) ---------- */
.admin-empty{font-size:0.95rem; color:#777; padding:40px 0; text-align:center;}
.admin-orders{display:flex; flex-direction:column; gap:10px;}
.admin-order{background:#fff; border:1px solid rgba(47,47,130,0.2); border-radius:4px;}

.admin-order-row{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 18px; cursor:pointer;
}
.admin-order-row:hover{background:rgba(47,47,130,0.03);}

.admin-order-business{
  font-family:var(--font-display); font-size:1.05rem; color:var(--petrol-blue);
  letter-spacing:0.01em; flex:1 1 180px; min-width:140px;
}
.admin-order-contact-inline{font-size:0.82rem; color:#666; flex:1 1 160px; min-width:120px;}
.admin-order-qty-inline{
  font-family:var(--font-stamp); font-size:0.7rem; font-weight:600; color:var(--petrol-blue);
  border:1px solid var(--petrol-blue); border-radius:999px; padding:3px 10px; white-space:nowrap;
}
.admin-order-time{font-family:var(--font-stamp); font-size:0.68rem; color:#999; white-space:nowrap;}

.admin-badge{
  font-family:var(--font-stamp); font-size:0.66rem; letter-spacing:0.06em; text-transform:uppercase;
  padding:4px 12px; border-radius:999px; color:#fff; white-space:nowrap;
}
.admin-badge-new{background:var(--petrol-orange);}
.admin-badge-pending{background:#c9971f;}
.admin-badge-completed{background:#2E9E5B;}

.admin-check{
  display:flex; align-items:center; gap:6px; font-family:var(--font-stamp); font-size:0.7rem;
  letter-spacing:0.03em; text-transform:uppercase; color:var(--petrol-blue); cursor:pointer; white-space:nowrap;
}
.admin-check input{width:16px; height:16px; accent-color:var(--petrol-orange); cursor:pointer;}

.admin-view-btn{
  display:flex; align-items:center; gap:6px; margin-left:auto;
  font-family:var(--font-stamp); font-size:0.68rem; letter-spacing:0.04em; text-transform:uppercase;
  background:#fff; color:var(--petrol-blue); border:2px solid var(--petrol-blue); border-radius:999px;
  padding:6px 14px; cursor:pointer;
}
.admin-view-btn:hover{background:var(--petrol-blue); color:#fff;}
.admin-view-chevron{display:inline-block; font-size:0.6rem; transition:transform 0.2s ease;}
.admin-view-btn.open .admin-view-chevron{transform:rotate(180deg);}

.admin-order-details{display:none; padding:0 18px 20px; border-top:1px dashed rgba(47,47,130,0.2);}
.admin-order-details.open{display:block; padding-top:16px;}

.admin-order-info{list-style:none; margin:0 0 16px; padding:0; font-size:0.85rem; color:#444; display:grid; grid-template-columns:1fr 1fr; gap:6px 20px;}
.admin-order-info strong{color:var(--petrol-blue);}
.admin-order-info a{color:var(--petrol-blue); text-decoration:none; border-bottom:1px solid transparent;}
.admin-order-info a:hover{border-bottom-color:var(--petrol-orange);}

.admin-order-items{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:16px;}
.admin-item-group h3{
  font-family:var(--font-stamp); font-size:0.68rem; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--petrol-orange); margin:0 0 8px; padding-bottom:4px; border-bottom:1px solid rgba(47,47,130,0.15);
}
.admin-item-group ul{list-style:none; margin:0; padding:0;}
.admin-item-group li{display:flex; justify-content:space-between; gap:10px; font-size:0.85rem; padding:4px 0;}
.admin-item-qty{font-family:var(--font-stamp); font-weight:600; color:var(--petrol-blue); white-space:nowrap;}

.admin-order-total-qty{
  font-family:var(--font-stamp); font-size:0.75rem; font-weight:700; color:var(--petrol-blue);
  margin:16px 0 0; padding-top:12px; border-top:1px dashed rgba(47,47,130,0.2);
}

.admin-order-notes{font-size:0.85rem; color:#444; margin:16px 0 0; background:var(--sign-cream); border-radius:4px; padding:10px 14px;}

@media (max-width:760px){
  .admin-order-row{gap:10px;}
  .admin-view-btn{margin-left:0; order:99; width:100%; justify-content:center;}
  .admin-order-info{grid-template-columns:1fr;}
}