/*
Theme Name:   LIMS.Science Child
Theme URI:    https://lims.science
Description:  Child theme of Astra. Restyles the existing Elementor markup: brand-aligned
              palette, type pairing and accent system. Changes no markup, no URL, no content —
              Polylang, Yoast and Elementor are untouched.
Author:       Lims.science LTD.
Template:     astra
Version:      1.0.0
Text Domain:  lims-science-child
*/

/* ============================================================
   1. PALETTE — aligned to the logo
   The site previously used #046bd2 as its primary, a blue that
   appears nowhere in the logo. These are the Astra and Elementor
   global variables, so redefining them restyles the whole site.
   Contrast measured against #FFFFFF and #F4F7FC (WCAG 2.1 AA).
   ============================================================ */
:root{
  --ast-global-color-0:#24306B;   /* primary · logo navy · 12.28:1 */
  --ast-global-color-1:#1A2350;   /* hover · 15.00:1 */
  --ast-global-color-2:#141A38;   /* headings · 17.01:1 */
  --ast-global-color-3:#48546F;   /* body · 7.57:1 */
  --ast-global-color-4:#FFFFFF;
  --ast-global-color-5:#F4F7FC;   /* light ground, blue-biased */
  --ast-global-color-6:#141A38;
  --ast-global-color-7:#DDE3F1;   /* hairlines */
  --ast-global-color-8:#141A38;

  --e-global-color-astglobalcolor0:#24306B;
  --e-global-color-astglobalcolor1:#1A2350;
  --e-global-color-astglobalcolor2:#141A38;
  --e-global-color-astglobalcolor3:#48546F;
  --e-global-color-astglobalcolor4:#FFFFFF;
  --e-global-color-astglobalcolor5:#F4F7FC;
  --e-global-color-astglobalcolor6:#141A38;
  --e-global-color-astglobalcolor7:#DDE3F1;
  --e-global-color-astglobalcolor8:#141A38;

  /* brand additions */
  --lims-navy:#24306B;
  --lims-red:#D91F35;          /* the logo's single red node · 5.00:1 */
  --lims-red-soft:rgba(217,31,53,.10);
  --lims-teal:#0F7F72;         /* semantic "verified" only */
  --lims-ink:#141A38;
  --lims-body:#48546F;
  --lims-muted:#5E678A;        /* 4.91:1 on the raised ground */
  --lims-line:#DDE3F1;
  --lims-line-strong:#AFBBD6;  /* interactive borders · 3:1 (WCAG 1.4.11) */
  --lims-ground:#F4F7FC;
  --lims-raised:#EDF1FA;
  --lims-display:"Archivo","IBM Plex Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --lims-sans:"IBM Plex Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --lims-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ============================================================
   2. TYPOGRAPHY
   Display face for headings, humanist sans for reading, mono for
   the data a laboratory actually handles (sample ids, methods,
   standards). Replaces Inter used at every level.
   ============================================================ */
body,.elementor-widget-text-editor,.elementor-widget-theme-post-content{
  font-family:var(--lims-sans);
  color:var(--lims-body);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,
.elementor-heading-title,
.elementor-widget-elementskit-heading .ekit-heading--title{
  font-family:var(--lims-display);
  color:var(--lims-ink);
  letter-spacing:-.021em;
  text-wrap:balance;
}
h1,.elementor-widget-heading h1.elementor-heading-title{font-weight:700;line-height:1.12}
h2,h3,h4{font-weight:600;line-height:1.2}
p{line-height:1.65}
.entry-content p,.elementor-widget-text-editor p{max-width:74ch}

/* ============================================================
   3. BUTTONS
   ============================================================ */
.elementor-button,.ast-button,.wp-block-button__link,input[type=submit],button.submit{
  font-family:var(--lims-sans);
  font-weight:600;
  letter-spacing:.005em;
  border-radius:9px;
  transition:transform .12s ease,background-color .12s ease,box-shadow .12s ease;
}
.elementor-button:hover,.ast-button:hover,.wp-block-button__link:hover{
  transform:translateY(-1px);
}
/* primary */
.elementor-button:not(.elementor-button-link),
.ast-button,input[type=submit]{
  background-color:var(--lims-navy);
  color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 6px 16px -8px rgba(36,48,107,.55);
}
.elementor-button:not(.elementor-button-link):hover,
.ast-button:hover,input[type=submit]:hover{background-color:#33418A;color:#fff}
/* a button sitting on a dark section inverts */
.elementor-element[class*="e-con"][style*="24306B"] .elementor-button,
.lims-on-dark .elementor-button{background-color:#fff;color:var(--lims-navy)}

/* ============================================================
   4. ELEMENTOR CONTAINERS AND CARDS
   ============================================================ */
.e-con-inner>.elementor-widget-container,
.elementor-widget-icon-box .elementor-icon-box-wrapper{border-radius:14px}
.elementor-widget-icon-box,.elementor-widget-image-box{transition:transform .15s ease}
.elementor-widget-icon-box:hover,.elementor-widget-image-box:hover{transform:translateY(-2px)}
.elementor-icon-box-title,.elementor-image-box-title{
  font-family:var(--lims-display);color:var(--lims-ink);letter-spacing:-.012em;
}

/* ============================================================
   5. NESTED TABS AND ACCORDIONS
   These carry the parameter panels and the FAQs on the market
   pages, so they get the clearest treatment.
   ============================================================ */
.e-n-tabs-heading .e-n-tab-title{
  font-family:var(--lims-mono);
  font-size:.78rem;letter-spacing:.05em;
  border-radius:8px;
  color:var(--lims-body);
}
.e-n-tabs-heading .e-n-tab-title[aria-selected="true"]{
  background:var(--lims-navy);color:#fff;
}
.e-n-tabs-heading .e-n-tab-title[aria-selected="true"]::after{
  content:"";display:block;height:2px;background:var(--lims-red);
  border-radius:1px;margin-top:5px;
}
.e-n-accordion-item{border-bottom:1px solid var(--lims-line)}
.e-n-accordion-item-title{
  font-family:var(--lims-display);font-weight:600;color:var(--lims-ink);
}
.e-n-accordion-item-title:hover{color:var(--lims-red)}
.e-n-accordion-item-title-icon svg{fill:var(--lims-red)}
.e-n-accordion details[open] .e-n-accordion-item-title{color:var(--lims-navy)}

/* ============================================================
   6. RED ACCENT — from the logo's single red node
   Kept as identity, not as status: the red already means
   "exception" and "regulatory constraint" on this site.
   ============================================================ */
::selection{background:rgba(217,31,53,.22)}
::-moz-selection{background:rgba(217,31,53,.22)}

/* current page in the menu */
.main-header-menu .current-menu-item>a,
.elementor-nav-menu .current-menu-item>a,
.elementor-nav-menu .elementor-item.elementor-item-active{
  box-shadow:inset 0 -2px 0 var(--lims-red);
  color:var(--lims-navy);
}
/* eyebrow / small caps label above a heading */
.lims-eyebrow{
  font-family:var(--lims-mono);font-size:.8rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--lims-navy);font-weight:500;
  position:relative;padding-left:20px;display:inline-block;
}
.lims-eyebrow::before{
  content:"";position:absolute;left:0;top:.52em;width:12px;height:2px;
  background:var(--lims-red);border-radius:1px;
}
/* text links */
.entry-content a:not(.elementor-button):hover,
.elementor-widget-text-editor a:hover{color:var(--lims-red)}

/* ============================================================
   7. UTILITY CLASSES
   Apply these from the Elementor editor (Advanced > CSS Classes)
   to get the approved components without changing any markup.
   ============================================================ */

/* Official Odoo Partner / fair-priced credential badge */
.lims-badge{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--lims-mono);font-size:.76rem;letter-spacing:.06em;
  text-transform:uppercase;font-weight:500;
  padding:8px 14px;border-radius:999px;
  background:var(--lims-raised);border:1px solid var(--lims-line-strong);
  color:var(--lims-ink);
}
.lims-badge::before{
  content:"";width:16px;height:16px;border-radius:50%;flex:none;
  background:var(--lims-teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.4 2.4L9.6 3.9' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/10px no-repeat;
}
.lims-badge--on-dark{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.28);color:#fff}

/* callout with the brand red rule */
.lims-callout{
  border-left:2px solid var(--lims-red);
  padding:2px 0 2px 16px;color:var(--lims-body);line-height:1.6;max-width:68ch;
}

/* compliance / standards emphasis on a container */
.lims-regulatory{
  border:1px solid rgba(217,31,53,.30);
  border-left:3px solid var(--lims-red);
  border-radius:14px;
}

/* a long list of parameters reads as a blob: switch to columns */
.lims-reference-list ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:3px 14px;
}
.lims-reference-list ul li{
  position:relative;padding-left:12px;font-size:.86rem;line-height:1.5;
}
.lims-reference-list ul li::before{
  content:"";position:absolute;left:0;top:.62em;width:4px;height:4px;
  border-radius:50%;background:var(--lims-red);opacity:.55;
}

/* tabular figures wherever numbers line up */
.lims-figures,.lims-figures *{font-variant-numeric:tabular-nums}

/* ============================================================
   8. ACCESSIBILITY
   ============================================================ */
:focus-visible{outline:2px solid var(--lims-navy);outline-offset:3px;border-radius:4px}
.lims-on-dark :focus-visible,
.elementor-element[class*="e-con"][style*="24306B"] :focus-visible{outline-color:#8FE3D2}
/* interactive borders need 3:1 (WCAG 1.4.11); the hairline is decorative only */
input:not([type=submit]),select,textarea,.elementor-field-textual{
  border-color:var(--lims-line-strong)!important;
  border-radius:8px;
  font-family:var(--lims-sans);
}
input:focus,select:focus,textarea:focus,.elementor-field-textual:focus{
  border-color:var(--lims-navy)!important;
}

/* ============================================================
   9. FOOTER
   ============================================================ */
.site-footer h4,.elementor-location-footer h4{
  font-family:var(--lims-mono);font-size:.78rem;letter-spacing:.13em;
  text-transform:uppercase;position:relative;padding-left:19px;
}
.site-footer h4::before,.elementor-location-footer h4::before{
  content:"";position:absolute;left:0;top:.52em;width:12px;height:2px;
  background:var(--lims-red);border-radius:1px;
}

/* ============================================================
   10. PRINT — a laboratory prints things
   ============================================================ */
@media print{
  .elementor-nav-menu,.site-footer,.elementor-location-footer,
  .cmplz-cookiebanner,.elementor-widget-button{display:none!important}
  body{color:#000;font-size:11pt}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#444}
}
