/* ===== AUTH CARD (login / signup / password reset) ===== */
body.auth-page{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--cream); position:relative; overflow:hidden; padding:40px 20px;
}
body.auth-page header, body.auth-page footer{display:none;}
.auth-blob1{width:420px; height:420px; background:var(--beige); opacity:.6; top:-140px; left:-120px; animation:morph 14s ease-in-out infinite, float-slow 10s ease-in-out infinite;}
.auth-blob2{width:280px; height:280px; background:var(--green); opacity:.08; bottom:-100px; right:-60px; animation:morph 10s ease-in-out infinite reverse;}
.auth-card{
  position:relative; z-index:2; background:var(--white); border-radius:40px; padding:56px;
  width:440px; max-width:92vw; box-shadow:0 40px 80px rgba(59,36,24,.14);
}
.auth-card .logo{display:flex; align-items:center; gap:10px; font-family:var(--serif); font-size:22px; font-weight:600; margin-bottom:36px; justify-content:center;}
.auth-card .logo svg{width:26px; height:26px; stroke:var(--green);}
.auth-card .logo img{width:40px; height:40px; object-fit:contain;}
.auth-card h1{text-align:center; font-size:28px; margin-bottom:8px;}
.auth-sub{text-align:center; color:var(--brown-muted); font-size:14.5px; margin-bottom:32px;}
.auth-card form{display:flex; flex-direction:column; gap:16px;}
.auth-card .btn-primary{width:100%; padding:16px; margin-top:6px;}
.auth-divider{display:flex; align-items:center; gap:14px; margin:26px 0; font-size:12px; color:var(--brown-muted);}
.auth-divider::before, .auth-divider::after{content:''; flex:1; height:1px; background:var(--line);}
.auth-foot{text-align:center; font-size:12.5px; color:var(--brown-muted); margin-top:28px;}
.auth-foot a{color:var(--green); font-weight:600;}
.back-home{position:fixed; top:28px; left:28px; z-index:5; display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--brown-muted);}
.back-home:hover{color:var(--brown);}
.back-home svg{width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.7;}

/* ===== PROFILE PAGE ===== */
.acc-head{display:flex; align-items:center; gap:20px;}
.avatar-big{width:76px; height:76px; border-radius:50% 45% 55% 50%/55% 50% 50% 45%; background:var(--green); color:var(--cream); font-family:var(--serif); font-size:26px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.acc-layout{display:grid; grid-template-columns:270px 1fr; gap:44px; align-items:start; padding-bottom:120px;}
.side-nav{background:var(--white); border-radius:32px; padding:14px; box-shadow:0 10px 28px rgba(59,36,24,.06); position:sticky; top:100px;}
.side-nav button, .side-nav a{
  width:100%; display:flex; align-items:center; gap:14px; padding:14px 18px; border-radius:100px;
  font-size:14.5px; font-weight:600; color:var(--brown-muted); text-align:left; transition:all .25s ease; margin-bottom:4px;
}
.side-nav svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.6; flex-shrink:0;}
.side-nav button:hover, .side-nav a:hover{background:var(--cream); color:var(--brown);}
.side-nav button.active{background:var(--green); color:var(--cream);}
.side-nav .divider{height:1px; background:var(--line); margin:10px 14px;}
.side-nav .logout{color:var(--danger);}
.side-nav .logout:hover{background:#f4e6e0;}

.tab-panel{display:none;}
.tab-panel.active{display:block;}
.content-card{background:var(--white); border-radius:32px; padding:40px; box-shadow:0 10px 28px rgba(59,36,24,.06); margin-bottom:28px;}
.content-card h2{font-size:24px; margin-bottom:24px;}
.field-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-bottom:8px;}
.save-row{display:flex; justify-content:flex-end; margin-top:24px;}

.addr-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.addr-card{border:1.5px solid var(--line); border-radius:24px; padding:22px; position:relative;}
.addr-card.default{border-color:var(--green); background:var(--cream);}
.addr-card .tag{position:absolute; top:18px; right:18px; font-size:10.5px; background:var(--green); color:var(--cream); padding:4px 11px; border-radius:100px; font-weight:700;}
.addr-card h4{font-size:15px; margin-bottom:6px; font-family:var(--sans); font-weight:600;}
.addr-card p{font-size:13.5px; color:var(--brown-muted); margin-bottom:14px;}
.addr-card .actions{display:flex; gap:16px; font-size:12.5px; font-weight:600; color:var(--green);}
.addr-card .actions button{color:var(--danger); background:none; font-weight:600; font-size:12.5px;}
.addr-add{border:1.5px dashed var(--line); border-radius:24px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--brown-muted); font-size:13.5px; font-weight:600; padding:22px; transition:all .25s ease; cursor:pointer;}
.addr-add:hover{border-color:var(--green); color:var(--green);}
.addr-add svg{width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.6;}
.addr-form{display:none; margin-top:20px;}
.addr-form.open{display:block;}

.order-card{border:1px solid var(--line); border-radius:24px; padding:22px 26px; display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:16px; transition:box-shadow .25s ease;}
.order-card:hover{box-shadow:0 10px 24px rgba(59,36,24,.06);}
.order-left{display:flex; align-items:center; gap:18px;}
.order-thumb{width:56px; height:56px; border-radius:50% 45% 55% 50%/55% 50% 50% 45%; background:linear-gradient(145deg,#d8c299,#b08c56); flex-shrink:0;}
.order-info .oid{font-size:14px; font-weight:600;}
.order-info .odate{font-size:12.5px; color:var(--brown-muted); margin-top:2px;}
.status-pill{font-size:11.5px; font-weight:700; padding:6px 14px; border-radius:100px;}
.status-pill.delivered{background:#E3ECDA; color:var(--green);}
.status-pill.transit{background:var(--beige); color:var(--brown);}
.order-total{font-family:var(--serif); font-size:17px; font-weight:600;}

.verify-banner{background:var(--beige); border-radius:20px; padding:16px 22px; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:28px; font-size:13.5px; flex-wrap:wrap;}
.verify-banner button{color:var(--green-dark); font-weight:700; text-decoration:underline;}

@media (max-width:1000px){
  .acc-layout{grid-template-columns:1fr;}
  .side-nav{position:static; display:flex; overflow-x:auto; gap:6px;}
  .side-nav .divider{display:none;}
  .side-nav button, .side-nav a{white-space:nowrap;}
  .field-grid, .addr-grid{grid-template-columns:1fr;}
}