/*
 * Garagetalk theme extras.
 *
 * Companion to assets/gt.css (the canonical Open Design stylesheet, copied
 * verbatim). Covers only the pieces the canonical sheet does not style:
 * skip link, share tray, comment list and form plumbing, partner callout
 * and real image rendering inside the design's placeholder components.
 * All values use the design tokens declared in gt.css.
 */

/* Skip link: invisible until focused (WCAG 2.4.1). */
.gt-skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.gt-skip-link:focus{position:fixed;left:var(--s4);top:var(--s4);z-index:1000;width:auto;height:auto;padding:var(--s2) var(--s4);background:var(--accent);color:var(--fg-dark);font-weight:700;border-radius:var(--r-sm)}

/* Share tray (article footer). */
.gt-share{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--border)}
.gt-share__title{margin:0;font-family:var(--font-body);font-weight:700;font-size:0.8125rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted)}
.gt-share__links{display:flex;gap:var(--s2);flex-wrap:wrap}
.gt-share__link{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--fg)}
.gt-share__link:hover{border-color:var(--accent-strong);color:var(--accent-strong);box-shadow:var(--shadow-1)}
.gt-share__link:focus-visible{outline:var(--focus);outline-offset:2px}
.gt-share__link svg{width:16px;height:16px}

/* Forms as a vertical stack (contact and comment forms). */
.gt-form{display:flex;flex-direction:column}
.gt-form > *{margin-bottom:var(--s4)}
.gt-form > *:last-child{margin-bottom:0}

/* Partner CTA callout: accent border + accent icon chip. */
.gt-callout--partner{border-color:var(--accent)}
.gt-callout--partner .gt-callout__icon{background:var(--accent);color:var(--fg-dark)}

/* Initials avatar chip used in comments and author contexts. */
.gt-callout__icon--avatar{background:var(--surface-2);color:var(--fg);font-family:var(--font-display);font-weight:800;font-size:1rem;text-transform:uppercase}

/* Comment list (design calls it out as gt-callout rows). */
.gt-comments{list-style:none;margin:0 0 var(--s6);padding:0;display:flex;flex-direction:column;gap:var(--s4)}
.gt-comments .children{list-style:none;margin:var(--s4) 0 0;padding-left:var(--s6)}
.gt-comments .gt-callout{margin:0}
.gt-comment__reply{margin-top:var(--s2);display:inline-block}

/* comment_form() wraps each field in <p class="comment-form-*">. */
.comment-form-author,.comment-form-email,.comment-form-url,.comment-form-comment{margin:0 0 var(--s4)}
.comment-form-cookies-consent{display:flex;gap:var(--s2);align-items:flex-start;margin:0 0 var(--s4)}
.comment-form-cookies-consent input{margin-top:0.25em}
#cancel-comment-reply-link{margin-left:var(--s3);font-weight:600}

/* Real images inside the design's placeholder components. */
.gt-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.gt-product__media img{width:100%;height:100%;object-fit:contain;display:block}
.gt-figure-ratio img{width:100%;height:100%;object-fit:cover;display:block}

/* Cookie consent banner (Consent Mode v2). */
.gt-cookie{position:fixed;left:0;right:0;bottom:0;z-index:900;background:var(--surface);border-top:1px solid var(--border-strong);box-shadow:0 -8px 24px rgba(0,0,0,0.12);padding:var(--s4) 0;padding-bottom:calc(var(--s4) + env(safe-area-inset-bottom,0px));display:none}
.gt-cookie[data-open="true"]{display:block}
.gt-cookie__inner{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);justify-content:space-between}
.gt-cookie__text{flex:1 1 340px;margin:0;font-size:0.9375rem;color:var(--fg)}
.gt-cookie__text a{font-weight:600;text-decoration:underline}
.gt-cookie__actions{display:flex;gap:var(--s2);flex-wrap:wrap}
.gt-cookie__actions .gt-btn{white-space:nowrap}
.gt-cookie__actions .gt-btn--dark{background:var(--fg);color:var(--surface)}

/* Footer "Cookie settings" reopen button renders as a plain link. */
.gt-footer__link-btn{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}