@charset "UTF-8";

/* ========================================
   Common (site-wide additions)
   Shared by index / purchase / cart /
   checkout / legal pages
======================================== */

/* ---- Header cart icon ---- */

.header-actions{

    display:flex;
    align-items:center;
    gap:1rem;

}

.header-cart{

    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    width:2.4rem;
    height:2.4rem;

    color:var(--color-text);

    transition:transform var(--transition);

}

.header-cart:hover{

    transform:scale(1.08);

}

.header-cart svg{

    width:1.5rem;
    height:1.5rem;

}

.header-cart-count{

    position:absolute;

    top:-4px;
    right:-6px;

    min-width:1.2rem;
    height:1.2rem;
    padding:0 .3rem;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:.65rem;
    font-weight:700;

    color:var(--color-white);
    background:var(--color-primary);

    border-radius:999px;
    line-height:1;

}

.header-cart-count[hidden]{

    display:none;

}

/* ---- Toast notification (add-to-cart feedback) ---- */

.toast{

    position:fixed;

    left:50%;
    bottom:2rem;

    transform:translate(-50%,1rem);

    background:var(--color-text);
    color:var(--color-white);

    padding:.9rem 1.6rem;

    border-radius:999px;

    font-size:.9rem;

    box-shadow:var(--shadow-medium);

    opacity:0;
    pointer-events:none;

    transition:opacity var(--transition),transform var(--transition);

    z-index:999;

    white-space:nowrap;

}

.toast.show{

    opacity:1;
    transform:translate(-50%,0);

}

/* ---- Footer legal nav (shared by every page) ---- */

.footer-legal-nav{

    display:flex;
    flex-wrap:wrap;

    justify-content:center;

    gap:.4rem 1.2rem;

    margin:1.2rem 0;

    font-size:.85rem;

}

.footer-legal-nav a{

    opacity:.85;

    text-decoration:underline;
    text-underline-offset:3px;

}

.footer-legal-nav a:hover{

    opacity:1;

}

/* ========================================
   Simple content page shell
   (legal pages, checkout confirmation, etc.)
======================================== */

.page-hero{

    padding:7rem 0 2rem;

    text-align:center;

}

.page-hero h1{

    font-size:1.9rem;
    font-weight:700;

}

.page-hero p{

    color:var(--color-sub);
    margin-top:.5rem;

}

.legal-section{

    padding:2rem 0 6rem;

}

.legal-box{

    max-width:820px;
    margin:0 auto;

    background:var(--color-white);

    border-radius:var(--radius-medium);

    padding:2.4rem clamp(1.2rem,4vw,3rem);

    box-shadow:var(--shadow-small);

    line-height:1.9;

}

.legal-box h2{

    font-size:1.15rem;

    margin-top:2.2rem;
    margin-bottom:.6rem;

    color:var(--color-text);

}

.legal-box h2:first-child{

    margin-top:0;

}

.legal-box p,
.legal-box li{

    color:var(--color-sub);

    font-size:.95rem;

}

.legal-box ul{

    padding-left:1.2rem;
    list-style:disc;

}

.legal-box table{

    width:100%;
    border-collapse:collapse;

    margin-top:.5rem;

}

.legal-box table th,
.legal-box table td{

    text-align:left;
    vertical-align:top;

    padding:.9rem .6rem;

    border-bottom:1px solid var(--color-accent);

    font-size:.9rem;

}

.legal-box table th{

    width:9rem;

    color:var(--color-text);
    font-weight:700;

    white-space:nowrap;

}

.legal-box table td{

    color:var(--color-sub);

}

.legal-note{

    margin-top:2.5rem;

    padding:1rem 1.2rem;

    background:var(--color-primary-pale);

    border-radius:var(--radius-small);

    font-size:.8rem;

    color:var(--color-sub);

}

.back-link{

    display:inline-block;

    margin:2rem auto 0;

    text-align:center;

    color:var(--color-primary);

    font-weight:700;
    text-decoration:underline;

}

.back-link-wrap{

    text-align:center;

}

/* ---- Product not found (purchase.html) ---- */

.product-not-found{

    padding:8rem 1rem 6rem;

    text-align:center;

}

.product-not-found h1{

    font-size:1.6rem;

    margin-bottom:.8rem;

}

.product-not-found p{

    color:var(--color-sub);

    margin-bottom:1.8rem;

}