/* =============================================================================
   TRAXIO.UK — share.css
   Share buttons, "Love Traxio.uk? Spread the word", the guide share strip and
   the /share.html recommendation page. Uses the tokens in traxio-uk.css.
   ============================================================================= */

/* ------------------------------------------------------------ share kit -- */
.tx-share-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.tx-share-list>li{margin:0;padding:0}
.tx-share-list>li[hidden]{display:none}
.tx-share-btn{--dot:var(--brand-3);display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--brand);font:inherit;font-size:.9375rem;font-weight:620;line-height:1.2;text-decoration:none;cursor:pointer;transition:border-color .15s,background-color .15s}
.tx-share-btn::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--dot)}
.tx-share-btn:hover{border-color:var(--brand-2);background:var(--paper);color:var(--brand)}
.tx-share-btn .ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tx-share-btn--icon::before{display:none}
.tx-share-btn[data-share-to="whatsapp"]{--dot:#25D366}
.tx-share-btn[data-share-to="facebook"]{--dot:#1877F2}
.tx-share-btn[data-share-to="x"]{--dot:#0F1419}
.tx-share-btn[data-share-to="reddit"]{--dot:#FF4500}
.tx-share-btn[data-share-to="linkedin"]{--dot:#0A66C2}
.tx-share-btn--native{background:var(--amber);border-color:#E39420;color:#26170B}
.tx-share-btn--native:hover{background:#F3B04F;border-color:#E39420;color:#26170B}
.tx-share-btn.is-done{border-color:var(--brand-3);background:#F1F7F5;color:var(--brand)}
.tx-share-status{min-height:1.5em;margin:10px 0 0;font-size:.875rem;color:var(--brand-2);font-weight:560}
.tx-share-status:empty{min-height:0;margin:0}

/* ------------------------------ "Love Traxio.uk? Spread the word" block -- */
.tx-recommend-grid{display:grid;gap:clamp(1.25rem,1rem + 2vw,2.5rem);align-items:start}
@media (min-width:900px){.tx-recommend-grid{grid-template-columns:1.05fr 1fr}}
.tx-recommend-links{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;margin:0}
.tx-recommend-note{font-size:.875rem;color:var(--text-dim);margin:.9rem 0 0}

/* ----------------------------------------------- guide "share this" strip -- */
.tx-share-strip{margin:2.5rem 0 0;padding:1.25rem 1.35rem;border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:var(--r-md);background:var(--paper)}
.tx-share-strip h2{font-family:var(--sans);font-size:1.15rem;font-weight:660;letter-spacing:0;margin:0 0 .25rem}
.prose .tx-share-strip h2{margin-top:0}
.tx-share-strip>p{margin:0 0 .9rem;font-size:.95rem}
.tx-share-strip .tx-share-btn{min-height:40px;padding:0 14px;font-size:.875rem}

/* ------------------------------------------------------ /share.html page -- */
.tx-compose{display:grid;gap:clamp(1.25rem,1rem + 2vw,2.5rem)}
@media (min-width:960px){.tx-compose{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:start}}
.tx-picks{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 1.1rem;padding:0;list-style:none}
.tx-pick{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--text);font:inherit;font-size:.875rem;font-weight:600;cursor:pointer}
.tx-pick:hover{border-color:var(--brand-2)}
.tx-pick[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:#fff}
.tx-msg-label{display:block;font-weight:660;color:var(--head);margin:0 0 .35rem}
.tx-msg-help{font-size:.875rem;color:var(--text-dim);margin:0 0 .6rem}
.tx-msg{display:block;width:100%;min-height:136px;padding:.85rem 1rem;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);color:var(--text);font:inherit;font-size:1rem;line-height:1.55;resize:vertical}
.tx-msg:focus{outline:3px solid var(--amber);outline-offset:1px}
.tx-msg--input{min-height:0;max-width:260px;margin-bottom:.4rem}
.tx-msg-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:.5rem 0 1rem;font-size:.8125rem;color:var(--text-dim)}
.tx-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:clamp(1.1rem,1rem + 1vw,1.9rem)}
.tx-panel h3{margin:0 0 .75rem}
.tx-review-rules{margin:0;padding-left:1.2rem}
.tx-review-rules li{margin:0 0 .45rem}
.tx-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin-top:.75rem}
.tx-season-status{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:.95rem}
.tx-season-status dt{font-weight:650;color:var(--head)}
.tx-season-status dd{margin:0}

@media print{.tx-share,.tx-share-strip,.tx-recommend{display:none !important}}
