/* ORYON PRO — Cycle Planner */
[hidden]{display:none !important}
.planner{max-width:780px;
  --gold:#c79a2b;--gold-lt:#ecc964;--gold-deep:#a87d18;
  --gold-grad:linear-gradient(135deg,#f3da88,#c79a2b);
  --gold-soft:rgba(199,154,43,.14)}

.ply-storelink{color:#cfe0ff;text-decoration:none;font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.ply-storelink:hover{color:#fff}

.planner-head{margin:.4rem 0 1.2rem}
.planner-head h1{font-weight:300;font-size:1.7rem;letter-spacing:.01em;margin:0 0 .3rem;display:inline-block}
.planner-head h1::after{content:"";display:block;width:54px;height:3px;margin-top:.55rem;border-radius:3px;background:var(--gold-grad);box-shadow:0 1px 5px rgba(199,154,43,.45)}
.planner-sub{margin:0;color:var(--muted);font-size:.92rem;line-height:1.55;max-width:60ch}

/* Form */
.ply{background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius);padding:1.4rem 1.2rem;box-shadow:0 6px 22px rgba(20,45,95,.07);margin-bottom:1.4rem;position:relative;overflow:hidden}
.ply::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--gold-grad);opacity:.9}
.ply__group{margin-bottom:1.2rem}
.ply__group:last-child{margin-bottom:0}
.ply__label{display:flex;align-items:center;gap:.55rem;font-weight:600;color:var(--ink);font-size:.95rem;margin-bottom:.65rem}
.ply__num{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;background:var(--accent);color:#fff;font-size:.74rem;font-weight:700}
.ply__chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.5rem}
/* Inline chip groups (Experience, Cycle length) — always a single equal-width row
   regardless of chip count, no wrapping. */
.ply__chips--inline{display:flex;flex-wrap:nowrap;gap:.5rem}
.ply__chips--inline .ply-chip{flex:1 1 0;min-width:0;text-align:center;align-items:center;padding:.7rem .45rem}
.ply__chips--inline .ply-chip__t{font-size:.9rem;white-space:nowrap}
.ply-chip{appearance:none;border:1.5px solid var(--border-strong);background:#fff;font:inherit;text-align:left;cursor:pointer;color:var(--ink);padding:.7rem .8rem;border-radius:11px;transition:.12s;display:flex;flex-direction:column;gap:.15rem;line-height:1.2}
.ply-chip__t{font-weight:600;font-size:.92rem}
.ply-chip__d{font-size:.72rem;color:var(--muted);font-weight:500;letter-spacing:.01em}
.ply-chip:hover{border-color:var(--accent)}
.ply-chip.is-active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 6px 16px rgba(27,63,150,.28)}
.ply-chip.is-active .ply-chip__d{color:#dbe6ff}

/* Result */
.ply-result{background:var(--surface);border:1px solid var(--gold-lt);border-radius:var(--radius);padding:1.4rem 1.2rem;margin-bottom:1.2rem;position:relative;overflow:hidden;box-shadow:0 12px 34px rgba(199,154,43,.14)}
.ply-result::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--gold-grad)}
.ply-result__head{margin-bottom:1rem}
.ply-result__title{font-size:1.2rem;font-weight:600;color:var(--ink);margin:0 0 .25rem}
.ply-result__sub{margin:0;color:var(--muted);font-size:.88rem;letter-spacing:.04em;text-transform:uppercase;font-weight:600}

.ply-warn{background:rgba(199,125,0,.1);border:1px solid rgba(199,125,0,.4);color:#9a6400;border-radius:11px;padding:.7rem .9rem;font-size:.85rem;line-height:1.5;margin-bottom:1rem}
.ply-warn ul{margin:.35rem 0 0;padding-left:1.2rem}
.ply-warn li{margin:.2rem 0}
.ply-warn--dur{background:rgba(27,63,150,.06);border-color:rgba(27,63,150,.3);color:#1b3f96}
.ply-warn--dur strong{color:#0e2455}

/* Missing products / catalog-gap suggestions */
.ply-missing{background:var(--surface);border:1px solid var(--border-strong);border-radius:12px;padding:.95rem 1.05rem;margin:1.4rem 0 .4rem;box-shadow:0 4px 14px rgba(20,45,95,.05)}
.ply-missing>summary{cursor:pointer;font-weight:600;font-size:.94rem;color:var(--ink);list-style:none;display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.ply-missing>summary::-webkit-details-marker{display:none}
.ply-missing>summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--gold-deep);transition:transform .2s;font-weight:300}
.ply-missing[open]>summary::after{transform:rotate(45deg)}
.ply-missing__sub{margin:.55rem 0 .8rem;color:var(--muted);font-size:.84rem;line-height:1.55;max-width:60ch}
.ply-missing__list{margin:0;padding:0;list-style:none;display:grid;gap:.45rem}
.ply-missing__list li{display:grid;grid-template-columns:minmax(180px,auto) 1fr;gap:.3rem .9rem;align-items:baseline;font-size:.86rem;line-height:1.45;padding:.55rem .75rem;background:#fff;border:1px solid var(--border);border-radius:9px}
.ply-missing__list strong{color:var(--ink);font-weight:600}
.ply-missing__list em{color:var(--muted);font-style:normal;font-size:.8rem}
@media(max-width:520px){
  .ply-missing__list li{grid-template-columns:1fr;gap:.15rem .9rem;padding:.55rem .7rem}
}

/* Stack rows */
.ply-stack{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.2rem}
.ply-row{display:grid;grid-template-columns:60px 1fr auto;gap:.9rem;align-items:center;padding:.7rem;background:#fff;border:1px solid var(--border);border-radius:12px}
.ply-row__img{width:60px;height:60px;border-radius:9px;object-fit:cover;background:var(--surface-2);border:1px solid var(--border)}
.ply-row__info{min-width:0}
.ply-row__name{font-weight:600;font-size:.96rem;color:var(--ink);margin:0 0 .15rem}
.ply-row__dose{font-size:.82rem;color:var(--ink-2);line-height:1.45}
.ply-row__dose strong{color:var(--accent);font-weight:600}
.ply-row__meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.3rem}
.ply-row__tag{display:inline-block;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--muted);background:var(--surface-2);border:1px solid var(--border);padding:.12rem .45rem;border-radius:5px}
.ply-row__actions{display:flex;flex-direction:column;align-items:flex-end;gap:.4rem;flex-shrink:0}
.ply-row__price{font-weight:600;color:var(--accent);font-size:.95rem;white-space:nowrap}
.ply-row__calc{font-size:.72rem;color:var(--accent);text-decoration:none;font-weight:600;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;border:1px solid #c9d8f2;padding:.3rem .55rem;border-radius:7px;background:linear-gradient(180deg,#f4f8ff,#e7eefc);transition:.12s}
.ply-row__calc:hover{border-color:var(--gold);background:linear-gradient(180deg,#eef4ff,#dce8fb);text-decoration:none}

/* Timeline — gold-toned, refined */
.ply-timeline{background:linear-gradient(180deg,#fafbfd,#fff);border:1px solid #e7ecf6;border-radius:14px;padding:1.05rem 1rem 1.1rem;margin-bottom:1.1rem;overflow:hidden;box-shadow:0 4px 14px rgba(20,45,95,.04)}
.ply-timeline__title{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin:0 0 .85rem;display:flex;align-items:center;gap:.55rem}
.ply-timeline__title::before{content:"";width:20px;height:2px;background:var(--gold-grad);border-radius:2px;box-shadow:0 1px 3px rgba(199,154,43,.45)}
.ply-timeline__wrap{overflow-x:auto}
.ply-tl{display:grid;gap:.45rem;min-width:100%}
.ply-tl__row{display:grid;grid-template-columns:130px 1fr;align-items:center;gap:.7rem}
.ply-tl__name{font-size:.78rem;font-weight:600;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.005em}
.ply-tl__bars{display:grid;gap:2px}
.ply-tl__weeks{display:grid;gap:3px;height:16px;border-radius:7px;padding:2px;background:#f4f6fb;box-shadow:inset 0 1px 2px rgba(20,45,95,.05)}
.ply-tl__w{background:linear-gradient(180deg,#ecc964,#c79a2b);border-radius:3px;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 1px 2px rgba(168,125,24,.18);transition:opacity .2s}
.ply-tl__w--off{background:repeating-linear-gradient(45deg,#eaeef5 0 5px,#dee3ed 5px 10px);box-shadow:none}
.ply-tl__legend{display:grid;grid-template-columns:130px 1fr;gap:.7rem;margin-top:.75rem;padding-top:.6rem;border-top:1px dashed #e7ecf6;font-size:.6rem;color:var(--muted);letter-spacing:.09em;text-transform:uppercase;font-weight:700}
.ply-tl__legend-weeks{display:grid;gap:3px;text-align:center}
.ply-tl__legend-weeks>div{color:var(--muted);padding:0 1px}

/* Intensity key — small swatches showing what the bar shades mean */
.ply-tl__key{display:flex;flex-wrap:wrap;gap:.65rem .9rem;margin-top:.75rem;padding-top:.7rem;border-top:1px dashed #e7ecf6;font-size:.65rem;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;font-weight:600}
.ply-tl__key-item{display:inline-flex;align-items:center;gap:.4rem}
.ply-tl__sw{width:18px;height:8px;border-radius:2px;display:inline-block}
.ply-tl__sw--full{background:linear-gradient(180deg,#ecc964,#c79a2b);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.ply-tl__sw--threeq{background:linear-gradient(180deg,#ecc964,#c79a2b);opacity:.72}
.ply-tl__sw--half{background:linear-gradient(180deg,#ecc964,#c79a2b);opacity:.42}
.ply-tl__sw--off{background:repeating-linear-gradient(45deg,#eaeef5 0 4px,#dee3ed 4px 8px)}

/* Actions — grid keeps everything aligned, no stray wraps.
   Desktop:  [   Add full cycle (primary, full row)   ]
             [ Add sample ] [ Print ] [ Email ]
   Tablet:   [   Add full cycle   ]
             [   Add sample   ]
             [ Print ] [ Email ]
   Mobile:   all 4 stacked full-width  */
.ply-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;align-items:stretch}
.ply-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;font-size:.88rem;padding:.7rem 1rem;border-radius:11px;text-decoration:none;width:100%;min-width:0;min-height:46px;line-height:1.15;text-align:center;white-space:normal}
.ply-add{grid-column:1 / -1;font-weight:600;font-size:.98rem;min-height:54px;padding:.85rem 1rem}

.planner-disclaimer{margin:1.4rem auto 0;max-width:600px;text-align:center;color:var(--muted);font-size:.78rem;line-height:1.6}

/* Toast */
.ply-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#0a1c3a;color:#fff;padding:.85rem 1.2rem;border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.25);font-size:.9rem;opacity:0;transition:.25s;z-index:60;display:flex;align-items:center;gap:.8rem;max-width:90vw}
.ply-toast.is-on{opacity:1;transform:translateX(-50%) translateY(0)}
.ply-toast a{color:var(--gold-lt);text-decoration:underline;font-weight:600}

/* Beginner ramp-up — week 1 at half, week 2 at three-quarters of full dose */
.ply-tl__w--half{opacity:.42}
.ply-tl__w--threeq{opacity:.72}

/* Recommended-full-cycle note */
.ply-cycle-note{background:rgba(199,154,43,.08);border:1px solid rgba(199,154,43,.3);border-left-width:3px;border-radius:8px;padding:.75rem .95rem;font-size:.84rem;color:var(--ink-2);line-height:1.55;margin-bottom:1rem}
.ply-cycle-note strong{color:var(--gold-deep)}

/* Per-row ramp note (only on beginner cycles) */
.ply-row__ramp{font-size:.72rem;color:var(--gold-deep);margin:.25rem 0 0;font-weight:500}

/* Coming-soon (un-stocked) product rows */
.ply-row--soon{background:#fafbfd;border-style:dashed}
.ply-row--soon .ply-row__name{color:var(--ink-2)}
.ply-row__img--ph{display:flex;align-items:center;justify-content:center;color:var(--muted);background:linear-gradient(135deg,#eef2f8,#e3eaf3)}
.ply-row__tag--soon{background:var(--gold-soft) !important;border-color:var(--gold-lt) !important;color:var(--gold-deep) !important}
.ply-row__price--soon{color:var(--muted);font-weight:600;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.ply-row__calc--off{color:var(--muted);background:#f2f5fa;border-color:#d9e0ec;cursor:not-allowed;opacity:.75}
.ply-row__calc--off:hover{border-color:#d9e0ec;background:#f2f5fa;text-decoration:none}

/* Tablet: secondary CTA gets full row, utility buttons paired below */
@media(min-width:521px) and (max-width:720px){
  .ply-actions{grid-template-columns:1fr 1fr}
  .ply-add{grid-column:1 / -1}
  #addSample{grid-column:1 / -1}
}

@media(max-width:520px){
  .ply{padding:1.1rem .9rem}
  .ply__chips{grid-template-columns:1fr 1fr}
  /* Inline chips stay in one row on mobile too — flex shrinks each to fit */
  .ply__chips--inline{gap:.35rem}
  .ply__chips--inline .ply-chip{padding:.6rem .2rem;min-height:48px;justify-content:center}
  .ply__chips--inline .ply-chip__t{font-size:.78rem;white-space:normal;line-height:1.15}
  .ply-result{padding:1.1rem .9rem}
  .ply-row{grid-template-columns:52px 1fr;gap:.7rem;padding:.65rem}
  .ply-row__img{width:52px;height:52px}
  .ply-tl__row,.ply-tl__legend{grid-template-columns:80px 1fr}
  .ply-tl__name{font-size:.7rem}

  /* ===== Universal mobile button rule =====
     Every .btn inside the planner becomes a full-width stacked block. */
  .planner .btn{
    width:100%;
    min-width:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    min-height:48px;
    padding:.85rem 1rem;
    font-size:.94rem;
    border-radius:12px;
    gap:.45rem;
  }
  .ply-actions{grid-template-columns:1fr;gap:.55rem}
  .ply-add{font-size:1rem;min-height:52px;padding:.95rem 1rem}

  /* Per-row price + calc link: stack vertically so the link is full-width too */
  .ply-row__actions{
    grid-column:1/-1;
    flex-direction:column;
    align-items:stretch;
    gap:.4rem;
    margin-top:.55rem;
  }
  .ply-row__price{text-align:left;font-size:1rem}
  .ply-row__calc,
  .ply-row__calc--off{
    display:block;
    width:100%;
    text-align:center;
    font-size:.74rem;
    padding:.6rem .7rem;
    white-space:normal;
  }
  .ply-row__price--soon{text-align:left;font-size:.78rem}
}

@media print{
  .topbar,.footer,.ply,.ply-actions,.ply-storelink,.navscrim,.navdrawer,.tbar{display:none !important}
  body{background:#fff}
  /* Force colours through so the timeline bars and tinted rows actually print */
  .ply-result,.ply-result *,.ply-tl,.ply-tl *,.ply-row,.ply-row *{-webkit-print-color-adjust:exact !important;print-color-adjust:exact !important;color-adjust:exact !important}
  .ply-result{box-shadow:none;border-color:#aaa;page-break-inside:avoid}
  .ply-timeline{page-break-inside:avoid}
  .ply-timeline__wrap{overflow:visible}
  /* Solid printable styles for the bars (gradient/hatched bg often gets stripped) */
  .ply-tl__weeks{height:16px;background:#f4f6fb !important}
  .ply-tl__w{background:#c79a2b !important;border-radius:2px;box-shadow:none !important}
  .ply-tl__w--half{background:#ecc964 !important;opacity:1 !important}
  .ply-tl__w--threeq{background:#d5af50 !important;opacity:1 !important}
  .ply-tl__w--off{background:#fff !important;border:1px dashed #b0b0b0 !important;border-radius:2px}
  .ply-tl__sw--full{background:#c79a2b !important}
  .ply-tl__sw--threeq{background:#d5af50 !important;opacity:1 !important}
  .ply-tl__sw--half{background:#ecc964 !important;opacity:1 !important}
  .ply-tl__sw--off{background:#fff !important;border:1px dashed #b0b0b0 !important}
  .ply-row__calc,.ply-actions,.ply-toast{display:none !important}
}