@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap');

:root {
  --a-blue:#1a237e; --a-border:#e0e4f5; --a-bg:#f5f7ff;
  --a-text:#0f1228; --a-muted:#64748b; --a-radius:14px;
  --a-t:.18s cubic-bezier(.4,0,.2,1);
}

/* ── Outer wrap ── */
.ac-account-wrap { font-family:'Outfit',system-ui,sans-serif; max-width:780px; margin:0 auto 40px; color:var(--a-text); }

/* ── Brand bar ── */
.ac-account-brand-bar { display:flex; align-items:center; gap:10px; padding:10px 18px; background:linear-gradient(135deg,#0c1442,#1a237e); border-radius:var(--a-radius) var(--a-radius) 0 0; color:#fff; font-size:15px; font-weight:700; }
.ac-account-brand-bar img { height:30px; filter:brightness(0) invert(1); }

/* ── Profile header ── */
.ac-profile-header { background:#fff; border:1.5px solid var(--a-border); border-top:none; padding:20px 22px; display:flex; gap:16px; align-items:flex-start; flex-wrap:wrap; }
.ac-profile-avatar-wrap { flex-shrink:0; }
.ac-profile-avatar { width:60px; height:60px; border-radius:50%; object-fit:cover; border:2.5px solid var(--a-border); }
.ac-avatar-init { width:60px; height:60px; border-radius:50%; background:linear-gradient(135deg,#1a237e,#3949ab); color:#fff; font-size:24px; font-weight:900; display:flex; align-items:center; justify-content:center; }
.ac-profile-info { flex:1; min-width:200px; }
.ac-profile-name  { font-size:18px; font-weight:800; color:var(--a-text); margin-bottom:2px; }
.ac-profile-email { font-size:12.5px; color:var(--a-muted); margin-bottom:9px; }
.ac-profile-stats { display:flex; flex-wrap:wrap; gap:6px; }
.ac-stat-chip { font-size:11px; font-weight:700; padding:3px 10px; background:var(--a-bg); border:1.5px solid var(--a-border); border-radius:50px; color:var(--a-muted); }
.ac-profile-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-left:auto; }
.ac-wa-btn { display:inline-flex; align-items:center; gap:7px; padding:8px 16px; background:#25d366; color:#fff; border-radius:50px; font-size:12.5px; font-weight:700; text-decoration:none; font-family:'Outfit',sans-serif; transition:all var(--a-t); box-shadow:0 3px 10px rgba(37,211,102,.3); }
.ac-wa-btn:hover { background:#128c5e; transform:translateY(-1px); text-decoration:none; color:#fff; }
.ac-signout-btn { font-size:12.5px; font-weight:600; color:var(--a-muted); padding:8px 14px; border:1.5px solid var(--a-border); border-radius:50px; text-decoration:none; transition:all var(--a-t); font-family:'Outfit',sans-serif; }
.ac-signout-btn:hover { color:#c62828; border-color:#fca5a5; background:#fff5f5; text-decoration:none; }

/* ── Tabs ── */
.ac-tabs { display:flex; gap:0; background:#fff; border:1.5px solid var(--a-border); border-top:none; border-bottom:none; overflow-x:auto; }
.ac-tab { padding:11px 18px; border:none; border-bottom:3px solid transparent; background:none; font-family:'Outfit',sans-serif; font-size:13px; font-weight:600; color:var(--a-muted); cursor:pointer; transition:all var(--a-t); white-space:nowrap; display:flex; align-items:center; gap:5px; }
.ac-tab:hover { color:var(--a-blue); background:var(--a-bg); }
.ac-tab-active { color:var(--a-blue); border-bottom-color:var(--a-blue); font-weight:800; }
.ac-tab-count { background:#e8eaf6; color:#1a237e; border-radius:50px; font-size:10px; font-weight:800; padding:1px 7px; }
.ac-tab-hidden { display:none !important; }

/* ── Order cards ── */
.ac-tab-panel { background:#fff; border:1.5px solid var(--a-border); border-top:none; border-radius:0 0 var(--a-radius) var(--a-radius); padding:14px; display:flex; flex-direction:column; gap:10px; }
.ac-order-card { border:1.5px solid var(--a-border); border-radius:12px; padding:14px 16px; background:#fff; transition:box-shadow var(--a-t),transform var(--a-t); }
.ac-order-card:hover { box-shadow:0 4px 18px rgba(26,35,126,.09); transform:translateY(-1px); }
.ac-order-type-badge { display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700; padding:3px 10px; border-radius:50px; margin-bottom:8px; letter-spacing:.3px; text-transform:uppercase; }
.ac-order-title { font-size:14px; font-weight:800; color:var(--a-text); margin-bottom:7px; line-height:1.35; }
.ac-order-meta { display:flex; flex-wrap:wrap; gap:10px; font-size:12px; color:var(--a-muted); margin-bottom:10px; font-weight:500; }
.ac-order-meta span { display:inline-flex; align-items:center; gap:3px; }
.ac-order-bottom { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ac-dl-badge { background:#e3f2fd; color:#0277bd; border-radius:50px; padding:2px 8px; font-size:11px; font-weight:700; }
.ac-dl-low   { background:#fff3e0; color:#e65100; }

/* ── Action buttons ── */
.ac-order-action-btn { display:inline-flex; align-items:center; gap:5px; padding:7px 16px; border-radius:50px; font-size:12.5px; font-weight:700; text-decoration:none; font-family:'Outfit',sans-serif; transition:all var(--a-t); cursor:pointer; border:none; }
.ac-btn-read     { background:#e8eaf6; color:#1a237e; }
.ac-btn-read:hover     { background:#1a237e; color:#fff; text-decoration:none; }
.ac-btn-download { background:#e3f2fd; color:#0277bd; }
.ac-btn-download:hover { background:#0277bd; color:#fff; text-decoration:none; }
.ac-btn-whatsapp { background:#f0fdf4; color:#16a34a; }
.ac-btn-whatsapp:hover { background:#25d366; color:#fff; text-decoration:none; }
.ac-btn-disabled { background:#f5f5f5; color:#9e9e9e; cursor:not-allowed; }

/* ── Status badges ── */
.ac-status-badge { display:inline-flex; align-items:center; gap:4px; padding:4px 12px; border-radius:50px; font-size:11.5px; font-weight:700; }
.ac-s-pending    { background:#fff8e1; color:#f57f17; }
.ac-s-dispatched { background:#e3f2fd; color:#1565c0; }
.ac-s-delivered  { background:#e8f5e9; color:#2e7d32; }

/* ── Empty state ── */
.ac-empty-state { text-align:center; padding:48px 24px; background:#fff; border:1.5px solid var(--a-border); border-top:none; border-radius:0 0 var(--a-radius) var(--a-radius); }
.ac-empty-icon  { font-size:48px; margin-bottom:14px; }
.ac-empty-state h3 { font-size:18px; font-weight:800; color:var(--a-text); margin-bottom:8px; }
.ac-empty-state p  { font-size:14px; color:var(--a-muted); margin-bottom:18px; }
.ac-browse-btn { display:inline-flex; align-items:center; gap:6px; padding:10px 22px; background:linear-gradient(135deg,#1a237e,#283593); color:#fff; border-radius:50px; font-size:13px; font-weight:700; text-decoration:none; transition:all var(--a-t); box-shadow:0 3px 12px rgba(26,35,126,.25); }
.ac-browse-btn:hover { transform:translateY(-2px); box-shadow:0 5px 18px rgba(26,35,126,.35); text-decoration:none; color:#fff; }

/* ── Login wall ── */
.ac-login-wall { padding:0; }
.ac-login-wall-inner { max-width:420px; margin:40px auto; text-align:center; background:#fff; border:1.5px solid var(--a-border); border-radius:var(--a-radius); padding:36px 32px; box-shadow:0 6px 30px rgba(26,35,126,.09); }
.ac-login-logo { height:44px; margin-bottom:16px; }
.ac-login-wall-icon { font-size:40px; margin-bottom:12px; }
.ac-login-wall-inner h2 { font-size:20px; font-weight:900; margin-bottom:8px; color:var(--a-text); }
.ac-login-wall-inner p  { font-size:13.5px; color:var(--a-muted); margin-bottom:20px; line-height:1.6; }
.ac-google-signin-btn { display:inline-flex; align-items:center; gap:10px; padding:11px 24px; background:#fff; border:2px solid var(--a-border); border-radius:50px; font-size:14px; font-weight:700; color:var(--a-text); text-decoration:none; box-shadow:0 2px 10px rgba(0,0,0,.07); transition:all var(--a-t); margin-bottom:12px; font-family:'Outfit',sans-serif; }
.ac-google-signin-btn:hover { border-color:#4285F4; box-shadow:0 4px 16px rgba(66,133,244,.22); transform:translateY(-1px); text-decoration:none; color:var(--a-text); }
.ac-wa-help-btn { display:inline-flex; align-items:center; gap:7px; padding:9px 20px; background:#f0fdf4; border:1.5px solid #86efac; border-radius:50px; font-size:13px; font-weight:700; color:#16a34a; text-decoration:none; transition:all var(--a-t); font-family:'Outfit',sans-serif; }
.ac-wa-help-btn:hover { background:#25d366; color:#fff; border-color:#25d366; text-decoration:none; }

/* ── Floating WhatsApp ── */
.ac-float-wa { position:fixed; bottom:24px; right:24px; width:52px; height:52px; background:#25d366; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 18px rgba(37,211,102,.4); transition:all var(--a-t); z-index:9999; text-decoration:none; animation:acWaPulse 3s ease-in-out infinite; }
.ac-float-wa:hover { transform:scale(1.12); box-shadow:0 6px 24px rgba(37,211,102,.55); background:#128c5e; }
@keyframes acWaPulse { 0%,100%{box-shadow:0 4px 18px rgba(37,211,102,.4)} 50%{box-shadow:0 4px 28px rgba(37,211,102,.6),0 0 0 6px rgba(37,211,102,.1)} }

/* ── Footer ── */
.ac-account-footer { display:flex; align-items:center; justify-content:center; gap:10px; padding:14px; color:var(--a-muted); font-size:12px; margin-top:18px; }
.ac-account-footer img { height:22px !important; max-height:22px !important; width:auto !important; }
.ac-account-footer a { color:var(--a-blue); text-decoration:none; font-weight:600; }

/* ── Mobile ── */
@media (max-width:600px) {
  .ac-profile-header { flex-direction:column; gap:12px; }
  .ac-profile-actions { margin-left:0; }
  .ac-tabs { font-size:12px; }
  .ac-tab  { padding:9px 12px; }
  .ac-login-wall-inner { padding:26px 18px; margin:20px auto; }
  .ac-float-wa { bottom:16px; right:16px; width:46px; height:46px; }
}

.ac-btn-track {
    background: linear-gradient(135deg, #1a237e, #3949ab);
    color: #fff !important;
    font-weight: 700;
    border-radius: 9px;
    padding: 10px 20px;
    text-decoration: none;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: opacity 0.15s;
}
.ac-btn-track:hover { opacity: 0.88; }