/* Account flow, sized patterns, beginner content and progress tracking */

/* ---------- NAV ACCOUNT ---------- */
.nav-signup-btn{
  padding:9px 18px;border-radius:999px;background:var(--indigo);color:#fff;
  font-size:0.84rem;font-weight:700;box-shadow:0 6px 16px rgba(16,45,68,0.22);
  transition:transform .15s ease, box-shadow .15s ease;
}
.nav-signup-btn:hover{transform:translateY(-1px);box-shadow:0 10px 20px rgba(16,45,68,0.26);}
.nav-signup-btn[hidden]{display:none;}
.profile-btn.is-signed-in{box-shadow:0 0 0 2px var(--yellow);}
[data-guest-only][hidden],[data-user-only][hidden]{display:none !important;}

/* ---------- AUTH (profile modal) ---------- */
.pm-auth-tabs{display:flex;gap:4px;padding:4px;margin-bottom:12px;border-radius:12px;background:#efe9df;}
.pm-auth-tabs button{flex:1;padding:8px 10px;border-radius:9px;font-size:0.82rem;font-weight:700;color:var(--text-dim);transition:background .15s ease, color .15s ease;}
.pm-auth-tabs button.active{background:#fff;color:var(--indigo);box-shadow:0 2px 6px rgba(16,45,68,0.1);}
.pm-auth-fields-3 #authName{grid-column:1 / -1;}
.pm-auth-fields-1{grid-template-columns:1fr;}
.pm-btn-link{flex:0 0 auto;background:none;color:var(--blue);padding:11px 6px;}
.pm-btn-link:hover{text-decoration:underline;transform:none;}
.pm-auth-msg.is-ok{color:#2e7d32;}
.pm-overlay[data-stage="account"] #bd-form{opacity:.45;pointer-events:none;filter:grayscale(.3);}

/* ---------- DISCOVER ---------- */
.size-banner{
  display:flex;align-items:center;gap:16px;padding:16px 20px;margin-bottom:22px;border-radius:18px;
  background:linear-gradient(135deg,#fff8e1 0%,#fdebdc 100%);border:1px solid rgba(243,155,91,0.35);
}
.size-banner-icon{font-size:1.8rem;flex-shrink:0;}
.size-banner div{flex:1;min-width:0;}
.size-banner b{display:block;font-size:0.95rem;color:var(--indigo);margin-bottom:2px;}
.size-banner p{font-size:0.84rem;color:var(--text-dim);}
.size-banner .btn{flex-shrink:0;}
.pc-sized{color:#2e7d32;font-weight:700;}

/* ---------- PATTERN DETAIL ---------- */
.detail-desc{font-size:0.95rem;line-height:1.65;color:var(--text-dim);max-width:640px;margin-bottom:6px;}
.detail-tabs{
  position:sticky;top:8px;z-index:5;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;
  padding:6px;margin:-8px 0 28px;border-radius:999px;background:rgba(249,245,239,0.92);
  backdrop-filter:blur(8px);border:1px solid var(--border);
}
.detail-tabs::-webkit-scrollbar{display:none;}
.detail-tabs button{flex-shrink:0;padding:8px 16px;border-radius:999px;font-size:0.84rem;font-weight:600;color:var(--text-dim);transition:background .15s ease,color .15s ease;}
.detail-tabs button:hover{background:#fff;color:var(--indigo);}

.detail-block{margin-bottom:38px;scroll-margin-top:80px;}
.detail-block h2{font-family:'Unbounded',sans-serif;font-size:1.25rem;letter-spacing:-0.02em;margin-bottom:14px;}
.detail-block-intro{font-size:0.9rem;color:var(--text-dim);margin-bottom:12px;}
.detail-list{display:grid;gap:8px;list-style:none;padding:0;}
.detail-list li{position:relative;padding:12px 14px 12px 40px;border-radius:12px;background:var(--surface);border:1px solid var(--border);font-size:0.9rem;line-height:1.5;color:var(--text);}
.detail-list li::before{content:"✂";position:absolute;left:14px;top:12px;color:var(--orange);}
.detail-list-check li::before{content:"✓";color:#2e7d32;font-weight:800;}

.prep-list{list-style:none;padding:0;counter-reset:prep;display:grid;gap:10px;}
.prep-list li{counter-increment:prep;position:relative;padding:14px 16px 14px 56px;border-radius:14px;background:var(--surface);border:1px solid var(--border);}
.prep-list li::before{
  content:counter(prep);position:absolute;left:14px;top:14px;width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:var(--indigo);color:#fff;
  font-family:'Unbounded',sans-serif;font-size:0.78rem;font-weight:700;
}
.prep-list b{display:block;font-size:0.95rem;margin-bottom:4px;}
.prep-list p{font-size:0.88rem;line-height:1.55;color:var(--text-dim);}

/* ---------- YOUR SIZE CARD ---------- */
.size-card{border-color:rgba(58,122,183,0.3);}
.size-note{font-size:0.84rem;line-height:1.5;color:var(--text-dim);margin-bottom:12px;}
.size-ok{color:#2e7d32;font-weight:600;}
.size-warn{color:#a8551c;}
.size-cta{width:100%;margin-bottom:14px;justify-content:center;}
.size-table{width:100%;border-collapse:collapse;font-size:0.84rem;margin-bottom:14px;}
.size-table th{text-align:left;font-weight:600;color:var(--text-dimmer);font-size:0.72rem;text-transform:uppercase;letter-spacing:.06em;padding:4px 0;}
.size-table td{padding:7px 0;border-top:1px solid var(--border);}
.size-table td.is-yours{color:var(--blue);font-weight:700;}
.size-table td.is-missing{color:var(--text-dimmer);}
.size-finished{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;padding:12px;border-radius:12px;background:var(--surface-2, #efe7dc);}
.size-finished span{grid-column:1 / -1;font-size:0.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dimmer);}
.size-finished div{font-size:0.74rem;color:var(--text-dim);line-height:1.3;}
.size-finished b{display:block;font-size:0.9rem;color:var(--indigo);}
/* ---------- GET YOUR PATTERN CARD ---------- */
.detail-actions .is-saved{color:#e0457b;}
.files-card h3{margin-bottom:14px;}
.file-hero{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;
  padding:18px 18px 16px;border-radius:16px;text-align:left;color:#fff;overflow:hidden;
  background:linear-gradient(140deg,#102d44 0%,#1d4b70 60%,#3a7ab7 100%);
  box-shadow:0 10px 24px rgba(16,45,68,0.25);transition:transform .18s ease, box-shadow .18s ease;
}
.file-hero::after{
  content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;
  border:2px dashed rgba(244,216,107,0.35);pointer-events:none;
}
.file-hero:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(16,45,68,0.32);}
.file-hero:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;}
.file-hero-badge{padding:3px 10px;border-radius:999px;background:var(--yellow);color:var(--indigo);font-size:0.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px;}
.file-hero b{font-family:'Unbounded',sans-serif;font-size:1.02rem;letter-spacing:-0.01em;}
.file-hero small{font-size:0.8rem;line-height:1.45;color:#cfe0ef;}
.file-hero-cta{margin-top:10px;font-size:0.84rem;font-weight:700;color:var(--yellow);}

.file-sub{margin:18px 0 8px;font-size:0.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dimmer);}
.file-list{display:grid;gap:8px;}
.file-row{
  display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;
  background:#fff;border:1px solid var(--border);color:var(--text);transition:border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.file-row:hover{border-color:rgba(58,122,183,0.45);transform:translateY(-1px);box-shadow:0 6px 14px rgba(18,49,77,0.08);}
.file-icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#fdebdc;color:#c0602a;}
.file-text{flex:1;min-width:0;display:flex;flex-direction:column;}
.file-text b{font-size:0.86rem;}
.file-text small{font-size:0.74rem;color:var(--text-dimmer);}
.file-dl{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--surface-2, #efe7dc);color:var(--indigo);transition:background .15s ease,color .15s ease;}
.file-row:hover .file-dl{background:var(--indigo);color:#fff;}

/* ---------- PATTERN PREVIEW MODAL ---------- */
.pp-overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(7,29,50,0.55);backdrop-filter:blur(4px);}
.pp-overlay.open{display:flex;}
.pp-card{display:flex;flex-direction:column;width:min(1000px,100%);height:min(92vh,1100px);border-radius:22px;overflow:hidden;background:var(--surface);box-shadow:0 30px 80px rgba(7,29,50,0.4);}
.pp-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--border);}
.pp-eyebrow{font-size:0.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);}
.pp-title h3{font-family:'Unbounded',sans-serif;font-size:1.15rem;margin:2px 0;}
.pp-title p{font-size:0.8rem;color:var(--text-dimmer);}
.pp-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.pp-seg{display:flex;padding:4px;border-radius:12px;background:#efe9df;}
.pp-seg button{padding:7px 12px;border-radius:9px;font-size:0.8rem;font-weight:700;color:var(--text-dim);}
.pp-seg button.active{background:#fff;color:var(--indigo);box-shadow:0 2px 6px rgba(16,45,68,0.1);}
.pp-print{padding:10px 16px;border-radius:12px;background:var(--indigo);color:#fff;font-size:0.84rem;font-weight:700;box-shadow:0 6px 16px rgba(16,45,68,0.22);transition:transform .15s ease;}
.pp-print:hover{transform:translateY(-1px);}
.pp-close{width:38px;height:38px;border-radius:50%;background:#efe9df;color:var(--indigo);font-size:1.4rem;line-height:1;}
.pp-close:hover{background:#e7dfd1;}
.pp-tip{padding:10px 20px;font-size:0.8rem;color:#7a5410;background:#fff8e1;border-bottom:1px solid rgba(243,155,91,0.25);}
.pp-frame{flex:1;width:100%;border:0;background:#e9e4dc;}

/* ---------- MY PATTERNS ---------- */
.mp-stats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
.mp-stat-num{display:inline-block;min-width:20px;margin-left:4px;padding:1px 6px;border-radius:999px;background:rgba(18,49,77,0.08);font-size:0.72rem;}
.chip.active .mp-stat-num{background:rgba(255,255,255,0.2);}
.mp-note-link{color:var(--blue);font-weight:700;text-decoration:underline;font-size:inherit;}

/* ---------- REQUESTS ---------- */
.req-status{margin-left:auto;padding:3px 9px;border-radius:999px;font-size:0.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#eef4fa;color:#3a7ab7;}
.req-status-planned{background:#ece5f8;color:#6b4fb0;}
.req-status-in_progress{background:#fdebdc;color:#a8551c;}
.req-status-released{background:#ecf3d9;color:#4f6b1d;}
.req-status-declined{background:#eee;color:#777;}
.req-mine{padding:3px 9px;border-radius:999px;font-size:0.66rem;font-weight:700;background:var(--indigo);color:#fff;}

@media (max-width:640px){
  .nav-signup-btn{padding:7px 12px;font-size:0.76rem;}
  .size-banner{flex-wrap:wrap;padding:14px;}
  .size-banner .btn{width:100%;justify-content:center;}
  .detail-tabs{top:4px;}
  .detail-block h2{font-size:1.08rem;}
  .size-finished{grid-template-columns:1fr 1fr;}
  .pp-overlay{padding:0;}
  .pp-card{height:100%;border-radius:0;}
  .pp-head{padding:12px 14px;}
  .pp-controls{width:100%;}
  .pp-print{flex:1;}
  .pp-close{position:absolute;top:10px;right:10px;}
  .pp-tip{padding:8px 14px;font-size:0.74rem;}
}

/* ---------- admin-managed media ---------- */
.hero-logo-img{display:block;max-width:min(420px,80%);max-height:180px;width:auto;height:auto;object-fit:contain;}
.hero-visual.has-media{display:flex;align-items:center;justify-content:center;}
.hero-media{display:block;width:100%;max-width:520px;max-height:460px;object-fit:cover;border-radius:24px;box-shadow:0 18px 40px rgba(16,45,68,.16);}
.how-img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:14px;margin-bottom:12px;}
.step-media{display:block;width:100%;max-width:520px;max-height:360px;object-fit:contain;border-radius:12px;margin:10px 0;background:#f9f5ef;}
@media (max-width:700px){
  .hero-media{max-height:300px;border-radius:18px;}
  .hero-logo-img{max-height:120px;}
}