/* AusPepLabs — global design system (loaded first, sitewide).
   One source of truth for colour, type, radius, spacing and base element styles.
   Component files (apl.css, apl-product.css, apl-shop.css) consume these tokens. */
:root{
  /* palette */
  --apl-navy:#173B57;        /* headings, key text, secondary button */
  --apl-navy-deep:#102C42;   /* footer, deepest surfaces */
  --apl-teal:#168C91;        /* primary interactive */
  --apl-teal-d:#117479;      /* hover */
  --apl-teal-a:#0E6065;      /* active */
  --apl-teal-pale:#E8F5F6;   /* selected / soft teal surface */
  --apl-orange:#E66B32;      /* sparing highlights (sale badge) */
  --apl-bg:#FFFFFF;
  --apl-soft:#F5F8FA;        /* soft surfaces / image stage */
  --apl-text:#172B3A;        /* primary text */
  --apl-text2:#718096;       /* secondary text: meta, captions, large text only (4.0:1 on white) */
  --apl-muted:#5E6E83;       /* secondary text for paragraphs (AA 5.3:1 on white) */
  --apl-line:#E5EBF0;        /* borders */
  --apl-ring:#8cc7ca;        /* focus ring */
  /* legacy aliases used by earlier components */
  --apl-ink:var(--apl-navy);--apl-mint:var(--apl-teal-pale);--apl-blue:var(--apl-soft);--apl-cream:var(--apl-soft);
  --apl-btn:var(--apl-teal);--apl-btn-h:var(--apl-teal-d);--apl-btn-a:var(--apl-teal-a);
  /* type */
  --apl-font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --apl-fw-body:400;--apl-fw-medium:500;--apl-fw-bold:700;
  /* shape + layout */
  --apl-r-sm:8px;--apl-r-md:12px;--apl-r-lg:16px;
  --apl-wrap:1200px;--apl-gutter:24px;
  --apl-shadow:0 8px 24px rgba(16,44,66,.08);
}

/* ---------- base ---------- */
body{background:var(--apl-bg);color:var(--apl-text);font-family:var(--apl-font)}
body.woocommerce-cart,body.woocommerce-checkout,body.woocommerce-account,body.woocommerce-order-received{background:var(--apl-soft)}
body :is(h1,h2,h3,h4,h5,h6){font-family:var(--apl-font);color:var(--apl-navy);letter-spacing:-.02em}
body :is(h1,h2,h3,h4,h5,h6){font-weight:700}
body p{color:inherit}
/* links: replace Hello's pink #c36 / #336 */
body a{color:var(--apl-teal);text-decoration:none}
body a:hover,body a:active{color:var(--apl-teal-d)}
body :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--apl-ring);outline-offset:2px;box-shadow:none}
/* buttons: replace Hello's pink outline buttons */
body :is([type=button],[type=submit],button){border-color:var(--apl-teal);border-radius:var(--apl-r-sm);color:var(--apl-teal);font-family:var(--apl-font)}
body :is([type=button],[type=submit],button):is(:hover,:focus){background-color:var(--apl-teal);border-color:var(--apl-teal);color:#fff}
/* form fields: replace Hello's #666 borders */
body :is(input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],input[type=search],input[type=url],input[type=date],textarea,select){
  border:1px solid var(--apl-line);border-radius:var(--apl-r-sm);background:#fff;color:var(--apl-text);font-family:var(--apl-font);min-height:46px;padding:10px 14px;transition:border-color .15s,box-shadow .15s}
body textarea{min-height:120px}
body :is(input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],input[type=search],input[type=url],input[type=date],textarea,select):focus{border-color:var(--apl-teal);box-shadow:0 0 0 3px rgba(22,140,145,.14);outline:0}
body ::placeholder{color:#8a99ab;opacity:1}
body :is(input[type=checkbox],input[type=radio]){accent-color:var(--apl-teal)}
/* tables: replace Hello's striped grey grid */
body table tbody>tr:nth-child(odd)>td,body table tbody>tr:nth-child(odd)>th{background-color:transparent}
body table tbody tr:hover>td,body table tbody tr:hover>th{background-color:var(--apl-soft)}
body table td,body table th{border-color:var(--apl-line)}
/* notices */
body :is(.woocommerce-message,.woocommerce-info,.woocommerce-error){border:1px solid var(--apl-line);border-left:3px solid var(--apl-teal);border-radius:var(--apl-r-sm);background:var(--apl-soft);color:var(--apl-text)}
body .woocommerce-error{border-left-color:#B4432E}
/* prices: strong, readable (kit's #A9B3C7 body text made prices pale) */
body :is(.price,.woocommerce-Price-amount,.wc-block-components-formatted-money-amount,.wc-block-components-product-price){color:var(--apl-text)}
body :is(.price del,.price del .woocommerce-Price-amount,.wc-block-components-product-price__regular){color:var(--apl-text2);font-weight:400}
body :is(.price ins,.wc-block-components-product-price__value.is-discounted){text-decoration:none;color:var(--apl-text)}
/* sale badge */
body .onsale{background:var(--apl-orange);color:#fff;border-radius:999px;font-family:var(--apl-font);font-size:12px;font-weight:600;line-height:1;min-height:0;min-width:0;padding:6px 10px;text-transform:none}
/* breadcrumbs */
body :is(.woocommerce-breadcrumb,.elementor-widget-woocommerce-breadcrumb nav){font-family:var(--apl-font);font-size:13px;color:var(--apl-text2)}
body :is(.woocommerce-breadcrumb a){color:var(--apl-text2)}
body :is(.woocommerce-breadcrumb a):hover{color:var(--apl-teal)}
/* screen-reader utility */
.apl-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(prefers-reduced-motion:reduce){body *{scroll-behavior:auto!important}}

/* ---------- add-to-cart success notice (.woocommerce-message only): icon | message | View cart ---------- */
body .woocommerce-message{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;position:relative;padding:14px 18px;text-align:left;line-height:1.5}
body .woocommerce-message::before{position:static;top:auto;left:auto;display:block;flex:0 0 20px;width:20px;height:20px;margin:0;font-size:18px;line-height:20px;text-align:center;color:var(--apl-teal)}
body .woocommerce-message::after{display:none}
body .woocommerce-message a.button{order:3;flex:0 0 auto;margin:0 0 0 auto;white-space:nowrap;float:none}
body .woocommerce-message.apl-notice-out{opacity:0;transform:translateY(-4px);transition:opacity .25s ease,transform .25s ease}
@media(max-width:480px){
  body .woocommerce-message{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px 12px;align-items:center}
  body .woocommerce-message a.button{grid-column:1 / -1;order:0;margin:2px 0 0;text-align:center;white-space:normal}
}
@media(prefers-reduced-motion:reduce){body .woocommerce-message.apl-notice-out{transition:none}}
/* the notice container is focused by WooCommerce on load for screen readers; it is not interactive, so no ring (the View cart button keeps its own) */
body .woocommerce-message:focus,body .woocommerce-message:focus-visible{outline:0;box-shadow:none}
