/* ========================================================================
   SwankageTCG v731 — Site-wide Typography Hierarchy

   Type roles
   ------------------------------------------------------------------------
   Tahoma      : all visible text (display, body, forms, metadata, navigation)

   Readability
   ------------------------------------------------------------------------
   Visible user-facing text has a 10px absolute floor. The existing
   swankagetcg-readable-type.js runtime guard enforces that floor without
   touching Font Awesome / icon glyphs. v731 loads that guard in public,
   dashboard, and admin shells.
   ======================================================================== */

@font-face{
  font-family:'Poppins';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('../fonts/poppins/poppins-600.woff2') format('woff2'),
      url('../fonts/poppins/poppins-600.woff') format('woff');
}
@font-face{
  font-family:'Poppins';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url('../fonts/poppins/poppins-700.woff2') format('woff2'),
      url('../fonts/poppins/poppins-700.woff') format('woff');
}
:root{
  --sw-font-display:'Tahoma',Arial,sans-serif;
  --sw-font-body:'Tahoma',Arial,sans-serif;
  --mds-font-main:'Tahoma',Arial,sans-serif;
  --vr-font-dashboard:'Tahoma',Arial,sans-serif;

  --sw-type-page:30px;
  --sw-type-section:22px;
  --sw-type-subsection:18px;
  --sw-type-heading-small:15px;
  --sw-type-body-lg:14px;
  --sw-type-body:13px;
  --sw-type-data:12px;
  --sw-type-meta:11px;
  --sw-type-micro:10px;
  --sw-type-action:11px;
}

html{
  font-synthesis:none;
  text-rendering:optimizeLegibility;
}

/* ------------------------------------------------------------------------
   Body / prose / data family
   ------------------------------------------------------------------------ */
body{
  font-family:var(--sw-font-body);
}

body :where(p,li,dt,dd,blockquote,figcaption,address),
body :where(label,input,select,textarea,option),
body :where(table,thead,tbody,tfoot,tr,th,td,caption),
body :where(.help-block,.form-text,.form-hint,.description,.meta,.metadata){
  font-family:var(--sw-font-body);
}

/* Forms are content/data entry, not actions. This intentionally supersedes
   older one-off component rules that gave text fields the button font. */
body input,
body select,
body textarea,
body option,
.sw-store-page input,
.sw-store-page select,
.sw-store-page textarea{
  font-family:var(--sw-font-body)!important;
}

/* ------------------------------------------------------------------------
   Display / action family
   ------------------------------------------------------------------------ */
body :where(h1,h2,h3,h4,h5,h6),
body :where(.page-title,.section-title,.card-title,.box-title,.panel-title,.modal-title),
body :where(legend),
body :where([class*="kicker"],[class*="eyebrow"]){
  font-family:var(--sw-font-display)!important;
}

body button,
body .btn,
body [role="button"],
body [role="tab"],
body .nav-tabs>li>a,
body .nav-pills>li>a,
body .pagination>li>a,
body .pagination>li>span,
body :where(.badge,.label){
  font-family:var(--sw-font-display)!important;
}

/* ------------------------------------------------------------------------
   Semantic fallback scale. Component-specific rules can still deliberately
   choose another size; this gives unstyled / legacy surfaces a shared ladder.
   ------------------------------------------------------------------------ */
h1{font-size:var(--sw-type-page);font-weight:700;line-height:1.12;letter-spacing:-.02em}
h2{font-size:var(--sw-type-section);font-weight:700;line-height:1.18;letter-spacing:-.015em}
h3{font-size:var(--sw-type-subsection);font-weight:700;line-height:1.22;letter-spacing:-.01em}
h4{font-size:var(--sw-type-heading-small);font-weight:700;line-height:1.28}
h5{font-size:13px;font-weight:700;line-height:1.32}
h6{font-size:11px;font-weight:700;line-height:1.35}

/* Normal prose/data rhythm. These are intentionally low-specificity defaults
   so purpose-built card/detail layouts retain their tuned sizing. */
:where(p,li,dt,dd){line-height:1.5}
:where(table){font-size:var(--sw-type-data)}
:where(label){font-weight:600}
:where(small,.small,.help-block,.form-text,.form-hint){font-size:var(--sw-type-micro)}

/* Actions sit around the agreed 11px baseline without shrinking deliberately
   larger hero CTAs that carry their own component rule. */
body :where(button,.btn,[role="button"],[role="tab"],.nav-tabs>li>a,.nav-pills>li>a){
  font-size:var(--sw-type-action);
  font-weight:600;
  letter-spacing:0;
}

/* Strong UI labels: compact, clear, and distinct from paragraph copy. */
body :where(legend,.badge,.label,[class*="kicker"],[class*="eyebrow"]){
  font-weight:600;
}

/* ------------------------------------------------------------------------
   Dashboard / Admin content hierarchy
   Dashboard/Admin content and navigation use the same Tahoma family.
   ------------------------------------------------------------------------ */
body.swankage-control-panel .content-wrapper,
body.swankage-control-panel .content,
body.swankage-control-panel .modal-content{
  font-family:var(--sw-font-body)!important;
}

body.swankage-control-panel .content-header h1,
body.swankage-control-panel .content h1,
body.swankage-control-panel .content h2,
body.swankage-control-panel .content h3,
body.swankage-control-panel .content h4,
body.swankage-control-panel .content .box-title,
body.swankage-control-panel .content .card-title,
body.swankage-control-panel .modal-title{
  font-family:var(--sw-font-display)!important;
}

body.swankage-control-panel .content :where(.btn,button,[role="button"],[role="tab"],.nav-tabs>li>a,.nav-pills>li>a),
body.swankage-control-panel .modal-content :where(.btn,button,[role="button"]){
  font-family:var(--sw-font-display)!important;
}

body.swankage-control-panel .content :where(input,select,textarea,option,label,table,th,td),
body.swankage-control-panel .modal-content :where(input,select,textarea,option,label){
  font-family:var(--sw-font-body)!important;
}

/* Do not let the global type system interfere with the deliberately matched
   Vendor/Admin sidebar nav or any icon-font glyphs. */
body.swankage-control-panel .main-sidebar,
body.swankage-control-panel .main-sidebar a,
body.swankage-control-panel .main-sidebar span{
  font-family:'Tahoma',Arial,sans-serif;
}

/* Font Awesome 6 uses different families for solid/regular/brands. Re-assert
   them after the typography layer so inherited text rules can never win. */
body :where(.fa,.fas,.fa-solid){font-family:'Font Awesome 6 Free'!important;font-weight:900!important}
body :where(.far,.fa-regular){font-family:'Font Awesome 6 Free'!important;font-weight:400!important}
body :where(.fab,.fa-brands){font-family:'Font Awesome 6 Brands'!important;font-weight:400!important}

/* ------------------------------------------------------------------------
   Responsive readability
   16px form controls on touch-size viewports avoid mobile browser zoom.
   ------------------------------------------------------------------------ */
@media(max-width:768px){
  body input,
  body select,
  body textarea{
    font-size:16px!important;
  }
}