/*
Theme Name: Pint-Sized Store
Template: storefront
Version: 1.1.0
Description: A simple product catalog for Pint-Sized PC Repair.
*/
:root{--pint-ink:#163c39;--pint-paper:#f8f7f2;--pint-accent:#dce9b4}body{background:var(--pint-paper);color:var(--pint-ink);font-family:Arial,Helvetica,sans-serif}.site-header{background:var(--pint-paper);border-bottom:1px solid #d9ded3;padding-top:2em}.site-branding .site-title a{color:var(--pint-ink);font-size:25px;letter-spacing:-1px}.site-description{color:#52665b!important}.main-navigation ul li a,.site-header ul.menu li.current-menu-item>a{color:var(--pint-ink)}h1,h2,h3,h4,h5,h6{color:var(--pint-ink)}.pint-hero{padding:2.8rem 0 3.5rem;border-bottom:1px solid #d9ded3;margin-bottom:2.5rem}.pint-eyebrow{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase}.pint-hero h1{font-size:clamp(42px,6vw,72px);line-height:1.1;letter-spacing:-2px;max-width:750px;margin:.6em 0 .35em}.pint-hero h1 em{font-family:Georgia,serif;font-weight:400}.pint-hero>p{max-width:590px;line-height:1.8}.pint-categories{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.pint-categories a{background:var(--pint-accent);color:var(--pint-ink);padding:9px 17px;border-radius:24px;text-decoration:none;font-weight:600;font-size:13px}.pint-catalog-note{background:#e9eedf;border-radius:8px;padding:14px;font-size:14px}.woocommerce-products-header{display:none}a{color:#24534b}button,.button,input[type=submit]{background:#204a43;color:#fff;border-radius:5px}a:focus,button:focus{outline:2px solid #204a43;outline-offset:4px}.site-footer{background:#e9eedf;color:var(--pint-ink)}.site-footer a{color:var(--pint-ink)}.site-info{font-size:13px}.stock.in-stock{color:#2a6552}.stock.out-of-stock{color:#8c402a}ul.products li.product{border:1px solid #d9ded3;border-radius:12px;overflow:hidden;padding-bottom:20px;background:#fff}ul.products li.product .woocommerce-loop-product__title{padding:0 12px}ul.products li.product img{width:100%;margin-bottom:20px}ul.products li.product .price{color:var(--pint-ink)}@media(min-width:768px){.right-sidebar .content-area{width:100%;float:none;margin-right:0}.site-branding{width:70%!important}.site-header .site-search{display:none}.storefront-primary-navigation .main-navigation{width:100%}}@media(max-width:767px){.pint-hero{padding:1.5rem 0 2rem}.pint-hero h1{letter-spacing:-1px}.site-branding .site-title a{font-size:22px}}

/* Match the visitor's system appearance; react immediately when it changes. */
:root {
    color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
    :root {
        --pint-ink: #e5eee8;
        --pint-paper: #121c19;
        --pint-accent: #344a31;
        --pint-surface: #1c2a24;
        --pint-border: #40534a;
        --pint-muted: #b0c3b7;
        --pint-link: #a9d8c1;
    }
    body, .site, .site-content, .site-header {
        background-color: var(--pint-paper);
        color: var(--pint-ink);
    }
    .site-header, .pint-hero, hr, .wp-block-separator {
        border-color: var(--pint-border);
    }
    h1, h2, h3, h4, h5, h6,
    .site-branding .site-title a,
    .site-header .main-navigation ul li a,
    .site-header ul.menu li.current-menu-item > a,
    .woocommerce-breadcrumb a, .entry-title a,
    ul.products li.product .price, .product .summary .price {
        color: var(--pint-ink);
    }
    a, .site-footer a, .star-rating span::before {
        color: var(--pint-link);
    }
    a:hover, .site-footer a:hover {
        color: #d4eedf;
    }
    .site-description, .woocommerce-breadcrumb,
    .woocommerce-result-count, .entry-meta, .entry-meta a,
    .posted-on, .posted-on a, .woocommerce-review__published-date,
    .product_meta, .product_meta a, .price del {
        color: var(--pint-muted) !important;
    }
    .site-footer, .pint-catalog-note, ul.products li.product,
    .main-navigation ul ul, .storefront-primary-navigation .main-navigation ul ul,
    .woocommerce-tabs ul.tabs li, .woocommerce-tabs ul.tabs li.active,
    blockquote, pre, code, .woocommerce-message, .woocommerce-info {
        background-color: var(--pint-surface);
        color: var(--pint-ink);
        border-color: var(--pint-border);
    }
    .pint-categories a {
        background-color: var(--pint-accent);
        color: var(--pint-ink);
    }
    input[type=text], input[type=email], input[type=url], input[type=password],
    input[type=search], input[type=number], input[type=tel], textarea, select {
        background-color: #22342b;
        color: var(--pint-ink);
        border-color: var(--pint-border);
        box-shadow: none;
    }
    input::placeholder, textarea::placeholder {
        color: var(--pint-muted);
        opacity: 1;
    }
    input:focus, textarea:focus, select:focus {
        background-color: #2a4034;
        color: var(--pint-ink);
    }
    button, .button, a.button, .button.alt,
    input[type=submit], input[type=button], input[type=reset],
    .site-header button.menu-toggle {
        background-color: #b8d999;
        color: #17211c;
        border-color: #b8d999;
    }
    button:hover, .button:hover, a.button:hover, .button.alt:hover,
    input[type=submit]:hover, .site-header button.menu-toggle:hover {
        background-color: #cde5b7;
        color: #17211c;
    }
    button.menu-toggle::before, button.menu-toggle::after,
    button.menu-toggle span::before {
        background-color: #17211c;
    }
    a:focus, button:focus, input:focus, textarea:focus, select:focus {
        outline-color: #b8d999;
    }
    .stock.in-stock { color: #9bd9ac; }
    .stock.out-of-stock { color: #ffb9a7; }
    .onsale, .woocommerce-tabs ul.tabs, .woocommerce-tabs ul.tabs li,
    .woocommerce-tabs .panel, .commentlist .comment-text,
    table, table td, table th {
        border-color: var(--pint-border);
        color: var(--pint-ink);
    }
    table thead th, table tbody th, table tbody td,
    table tbody tr:nth-child(2n) td,
    .storefront-sorting, .woocommerce-pagination .page-numbers li .page-numbers {
        background-color: var(--pint-surface);
        color: var(--pint-ink);
    }
    .woocommerce-pagination .page-numbers li .page-numbers.current {
        background-color: var(--pint-accent);
    }
}
