/* =========================================================
   Customer Account Panel — built on style.css tokens
   Sidebar layout for dashboard/profile/booking pages,
   split-screen layout for login/register.
   ========================================================= */

/* ---------- Account shell (sidebar + content) ---------- */
.account-shell{
  display:grid;grid-template-columns:280px 1fr;gap:32px;align-items:start;
}
@media(max-width:900px){.account-shell{grid-template-columns:1fr;}}

.account-sidebar{
  background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);
  padding:30px 24px;position:sticky;top:100px;
}
@media(max-width:900px){.account-sidebar{position:relative;top:0;}}

.account-avatar{
  width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg, var(--forest), var(--forest-dark));
  color:var(--gold-light);display:flex;align-items:center;justify-content:center;
  font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;margin-bottom:14px;
  box-shadow:0 6px 16px rgba(27,58,50,.25);
}
.account-sidebar h3{font-size:1.15rem;margin-bottom:2px;}
.account-sidebar .email{color:var(--muted);font-size:.82rem;margin-bottom:22px;display:block;word-break:break-all;}

.account-nav{display:flex;flex-direction:column;gap:4px;}
.account-nav a{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--radius-sm);
  font-size:.92rem;color:var(--ink);transition:all .2s ease;
}
.account-nav a .ic{width:20px;text-align:center;flex:none;}
.account-nav a:hover{background:var(--forest-tint);}
.account-nav a.active{background:var(--forest);color:var(--white);font-weight:500;}
.account-nav hr{border:none;border-top:1px solid #EFEBDF;margin:10px 0;}
.account-nav a.danger-link{color:var(--danger);}
.account-nav a.danger-link:hover{background:#F4E4DE;}

.account-content h1{margin-bottom:4px;}
.account-welcome{
  background:linear-gradient(120deg, var(--forest) 0%, var(--forest-dark) 100%);
  border-radius:var(--radius-lg);padding:34px 38px;color:var(--white);margin-bottom:28px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  position:relative;overflow:hidden;
}
.account-welcome::after{
  content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle, rgba(201,161,90,.18), transparent 70%);
}
.account-welcome h1{color:var(--white);margin-bottom:6px;}
.account-welcome p{color:rgba(255,255,255,.75);margin:0;}
.account-welcome .eyebrow{color:var(--gold-light);}

/* ---------- Stat row (reuses .stat-card look, tuned) ---------- */
.account-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:30px;}
@media(max-width:640px){.account-stats{grid-template-columns:1fr;}}
.account-stats .stat-card{border-top:3px solid var(--gold);}

/* ---------- Booking cards ---------- */
.booking-list{display:flex;flex-direction:column;gap:18px;}
.booking-card{
  background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);
  display:grid;grid-template-columns:140px 1fr auto;gap:22px;padding:18px;align-items:center;
  transition:box-shadow .2s ease, transform .2s ease;
}
.booking-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
.booking-card .thumb{width:140px;height:100px;border-radius:var(--radius-sm);overflow:hidden;}
.booking-card .thumb img{width:100%;height:100%;object-fit:cover;}
.booking-card .info h3{font-size:1.08rem;margin-bottom:4px;}
.booking-card .info .ref{font-size:.78rem;color:var(--muted);letter-spacing:.02em;}
.booking-card .info .dates{display:flex;gap:18px;margin:10px 0;font-size:.85rem;flex-wrap:wrap;}
.booking-card .info .dates span{display:flex;align-items:center;gap:6px;color:var(--ink);}
.booking-card .info .dates strong{color:var(--forest);}
.booking-card .badges{display:flex;gap:8px;flex-wrap:wrap;}
.booking-card .side{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
.booking-card .amount{font-family:'Playfair Display',serif;font-size:1.3rem;color:var(--forest);}
.booking-card .actions{display:flex;gap:8px;}
@media(max-width:720px){
  .booking-card{grid-template-columns:1fr;text-align:left;}
  .booking-card .thumb{width:100%;height:160px;}
  .booking-card .side{align-items:flex-start;flex-direction:row;justify-content:space-between;width:100%;}
}

/* ---------- Empty state ---------- */
.empty-state{
  background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);
  padding:60px 30px;text-align:center;
}
.empty-state .glyph{font-size:2.6rem;margin-bottom:14px;}
.empty-state h3{margin-bottom:8px;}

/* ---------- Profile section headers ---------- */
.panel-head{display:flex;align-items:center;gap:12px;margin-bottom:20px;}
.panel-head .ic{width:40px;height:40px;border-radius:10px;background:var(--forest-tint);color:var(--forest);display:flex;align-items:center;justify-content:center;flex:none;font-size:1.1rem;}
.panel-head h3{margin:0;}

/* ---------- Booking detail hero card ---------- */
.detail-hero{
  border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);background:var(--white);
  display:grid;grid-template-columns:1fr 1fr;
}
@media(max-width:800px){.detail-hero{grid-template-columns:1fr;}}
.detail-hero .img-side{min-height:280px;position:relative;}
.detail-hero .img-side img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
.detail-hero .content-side{padding:34px;}
.detail-hero .ref-chip{
  display:inline-block;background:var(--forest-tint);color:var(--forest);font-weight:600;
  padding:6px 14px;border-radius:999px;font-size:.8rem;letter-spacing:.03em;margin-bottom:14px;
}

/* ---------- Auth split screen (login / register) ---------- */
.auth-shell{
  min-height:calc(100vh - 82px);display:grid;grid-template-columns:1fr 1fr;
}
@media(max-width:860px){.auth-shell{grid-template-columns:1fr;}}
.auth-visual{
  background:linear-gradient(160deg, rgba(16,36,32,.92), rgba(16,36,32,.72)), url('../images/hero-bg.jpg') center/cover no-repeat, var(--forest-dark);
  color:var(--white);padding:60px;display:flex;flex-direction:column;justify-content:space-between;
}
@media(max-width:860px){.auth-visual{display:none;}}
.auth-visual .brand{color:var(--white);font-size:1.3rem;}
.auth-visual .brand span{color:var(--gold);}
.auth-visual blockquote{font-family:'Playfair Display',serif;font-size:1.6rem;line-height:1.4;max-width:420px;margin:0;}
.auth-visual .quote-by{margin-top:16px;color:rgba(255,255,255,.7);font-size:.88rem;}
.auth-visual .perks{display:flex;flex-direction:column;gap:14px;margin-top:40px;}
.auth-visual .perks div{display:flex;align-items:center;gap:12px;font-size:.9rem;color:rgba(255,255,255,.88);}
.auth-visual .perks .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex:none;}

.auth-form-side{display:flex;align-items:center;justify-content:center;padding:60px 24px;background:var(--cream);}
.auth-form-wrap{width:100%;max-width:400px;}
.auth-form-wrap .eyebrow{justify-content:flex-start;}