/* ==== FLEET — generic rules, no element IDs ==== v1.3-cis (2026-09-24: NO STANDARD BUTTON — Damien. The standard-button block,
   card/variant tokens, popup CTA and dark-mode button restatement are removed; every button keeps its editor design.
   Previous version: fleet.css.pre-20260924-nostdbtn)
   Generated 2026-09-06 from the TR ui-polish.css. Load fleet.css on every site;
   the site file holds Elementor element IDs that exist on ONE install and must be
   re-discovered (scripts/cards_list.php pattern) before any reuse. */

/* QNET UI polish — category filter, Load More, hero rhythm.
   Dark text on the accent (brand rule + passes WCAG AA), responsive, dark-mode aware. */

:root{
  --qn-accent:#ED6125;
  --qn-accent-tint:rgba(237,97,37,.12);
  --qn-on-accent:#ffffff;      /* white label on the active pill (your call) */
  --qn-ink:#1a1a1a;
  --qn-muted:#5b5651;
  --qn-line:rgba(0,0,0,.16);
}
body[data-theme="dark"]{
  --qn-accent-tint:rgba(237,97,37,.20);
  --qn-ink:#efeae4;
  --qn-muted:#b3aca4;
  --qn-line:rgba(255,255,255,.20);
}

/* ---------- Category filter → pills ---------- */
/* breathing room between the search block above and the filter row */
.elementor-widget-taxonomy-filter{margin-top:clamp(18px,3vw,32px)}
.elementor-widget-taxonomy-filter .e-filter{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
  align-items:center;
  margin:0 auto;
}
.elementor-widget-taxonomy-filter .e-filter-item{
  appearance:none;
  /* flex centring + line-height:1 => text is optically centred whatever the
     font metrics do (fixes the high-sitting label) */
  display:inline-flex;
  align-items:center;
  justify-content:center;
  /* theme-proof colours: inherit the theme's own text colour (correct in light
     AND dark) and mute it with opacity, instead of hard-coding a grey that only
     passes contrast in one theme. Border is a neutral translucent that reads on
     both grounds. */
  color:inherit;   /* theme's own text colour => AA in light and dark by construction */
  opacity:1;
  border:none;                      /* no outline — filled chip */
  background:rgba(128,128,128,.12); /* light grey; translucent so it also reads on dark */
  font-size:.92rem;
  font-weight:500;
  line-height:1;
  /* optical centring: the em-box is centred but the ink (cap-top -> descender)
     sits ~2px low in Encode Sans Condensed, so shift it up by trading 2px of
     top padding for bottom padding. Pill height is unchanged. */
  padding:.48em 1.05em .76em;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  transition:background-color .16s ease;
}
/* hover: just bring the label to full strength + a neutral wash.
   No border change, no orange (orange belongs to the active pill alone). */
.elementor-widget-taxonomy-filter .e-filter-item:hover{
  background:rgba(128,128,128,.22);
}
.elementor-widget-taxonomy-filter .e-filter-item[aria-pressed="true"]{
  background:var(--qn-accent);   /* brand orange, unchanged */
  color:var(--qn-on-accent);     /* white — note: 3.31:1, below AA for this text size */
  font-weight:600;
}
.elementor-widget-taxonomy-filter .e-filter-item:focus-visible{
  outline:2px solid var(--qn-accent);
  outline-offset:2px;
}

/* No theme-specific colour overrides are needed: the label inherits the theme's
   own text colour, so it is correct in light and dark by construction. The only
   fixed pair is dark-on-orange for the active pill, which passes AA on both. */

/* Mobile: one swipeable row instead of a ragged wrap */
@media (max-width:640px){
  .elementor-widget-taxonomy-filter .e-filter{
    flex-wrap:nowrap;
    justify-content:flex-start;
    overflow-x:auto;
    padding:2px 4px 6px;
    scrollbar-width:none;
    -ms-overflow-style:none;
    -webkit-overflow-scrolling:touch;
  }
  .elementor-widget-taxonomy-filter .e-filter::-webkit-scrollbar{display:none}
  .elementor-widget-taxonomy-filter .e-filter-item{
    flex:0 0 auto;
    font-size:.86rem;
    padding:.34em .9em .62em;
  }
}


/* ---------- Hero rhythm ---------- */
.elementor-widget-foxiz-heading .heading-title{
  letter-spacing:-.015em;
  text-wrap:balance;
}
.elementor-widget-foxiz-heading .heading-title span{line-height:1.08}
@media (max-width:640px){
  .elementor-widget-foxiz-heading .heading-title{font-size:clamp(1.7rem,7vw,2.3rem)}
}

/* ---------- Card grid: keep the 10px gutter honest on small screens ---------- */
@media (max-width:480px){
  .elementor-widget-loop-grid .elementor-grid{gap:10px}
}

@media (prefers-reduced-motion:reduce){
  .elementor-widget-taxonomy-filter .e-filter-item,
  .elementor-widget-loop-grid .elementor-button{transition:none}
}


/* ---------- Footer = navy (Damien 2026-09-10) ----------
   The three footer templates carry #0E1726 in their data; the WPML language strip Foxiz prints
   under them is a separate element with its own grey — same navy, hairline separator, muted links. */
.wpml-ls-statics-footer{ background:#0E1726 !important; border-top:1px solid rgba(255,255,255,.08); }
.wpml-ls-statics-footer a{ color:#A9B6C6; background:transparent; }
.wpml-ls-statics-footer a:hover, .wpml-ls-statics-footer a:focus-visible{ color:#fff; }
/* dark mode: Foxiz repaints the strip #1C1E23 — keep it the same navy as the footer above it (2026-09-24) */
body[data-theme="dark"] .wpml-ls-statics-footer,
body[data-theme="dark"] .wpml-ls-statics-footer .wpml-ls-item,
body[data-theme="dark"] .wpml-ls-statics-footer a{ background:#0E1726 !important; }


/* ---------- Loop grid must fill its container ----------
   A Foxiz grid was a block element; the Elementor loop-grid is a flex child. In a
   container set to `align-items:center` (very common on these pages) it shrinks to
   its content width — and since the grid track is itself flexible, that collapses
   to ~30px and the section renders as an empty gap with the heading and CTA still
   visible. Seen on /basaranlar/ (grid 795a1bd6). */
.elementor-widget-loop-grid{ width:100%; align-self:stretch; }

/* ---------- Content width = Elementor Site Settings (1250, like qnet.net) — 2026-09-24 ----------
   The old ≥1600px widening (1400/1560) is removed: it overrode every boxed width on large screens. */

/* ---------- Single post: prev/next thumbnails are rectangles (fleet card language), not circles ---------- */
.entry-pagination .nav-inner img{width:96px;height:64px;aspect-ratio:3/2;object-fit:cover;border-radius:8px!important}
@media (max-width:767px){.entry-pagination .nav-inner img{width:72px;height:48px}}

/* ---------- Promoted headings keep their original size ----------
   qnet-heading-semantics turns Foxiz's h4/h5 list titles into h2 for the outline and adds the
   original level as a class. Foxiz sizes these by TAG (measured on prod: h5 14px/21px, h4 16px/23px),
   so the class carries the size back. */
h2.entry-title.h4,h2.heading-title.h4{font-size:16px!important;line-height:1.45!important}
h2.entry-title.h5,h2.heading-title.h5{font-size:14px!important;line-height:1.5!important}
h2.entry-title.h6,h2.heading-title.h6{font-size:13px!important;line-height:1.5!important}
h2.entry-title.h3,h2.heading-title.h3{font-size:18px!important;line-height:1.4!important}

/* ---------- Font Awesome → SVG masks, everywhere except the header ----------
   Measured on the homepage: three webfont files, 278 KB, for eleven glyphs. The
   footer socials and the content glyphs below are painted from their own outlines
   (extracted from the theme's FA 6.1.1 brands file and Elementor's FA solid file,
   so the shapes are the ones the site already shows), as 8 KB of inline masks.
   The <i class="fab fa-…"> markup stays untouched, so Elementor keeps working;
   `font-family:inherit` on these classes is what stops the brands font from being
   fetched at all. The header keeps its three FA icons until it is redesigned —
   that is the only remaining reason fa-solid / fa-regular still load. */
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-x-twitter, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-facebook, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-youtube, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-instagram, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-tiktok, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-check, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-chevron-right{
  font-family:inherit !important;
  line-height:1;
}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-facebook::before, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-youtube::before, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-instagram::before, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-tiktok::before, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-check::before, :is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-chevron-right::before{
  content:"" !important;
  display:inline-block;
  height:1em;
  vertical-align:-.125em;
  background-color:currentColor;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-size:contain; mask-size:contain;
}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-facebook::before{width:1.0em;-webkit-mask-image:url("masks/mask-1.svg");mask-image:url("masks/mask-2.svg")}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-youtube::before{width:1.125em;-webkit-mask-image:url("masks/mask-3.svg");mask-image:url("masks/mask-4.svg")}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-instagram::before{width:0.875em;-webkit-mask-image:url("masks/mask-5.svg");mask-image:url("masks/mask-6.svg")}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-tiktok::before{width:0.875em;-webkit-mask-image:url("masks/mask-7.svg");mask-image:url("masks/mask-8.svg")}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-check::before{width:1.0em;-webkit-mask-image:url("masks/mask-9.svg");mask-image:url("masks/mask-10.svg")}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-chevron-right::before{width:0.625em;-webkit-mask-image:url("masks/mask-11.svg");mask-image:url("masks/mask-12.svg")}


/* --- CIS addition: Telegram (footer social) --- */
.fa-telegram{font-family:inherit!important}
:is(main,footer,.footer-wrap,.elementor-popup-modal) .fa-telegram::before{content:"";display:inline-block;width:0.969em;height:1em;background:currentColor;-webkit-mask:url("masks/mask-13.svg") center/contain no-repeat;mask:url("masks/mask-14.svg") center/contain no-repeat;vertical-align:-0.125em}

/* WPML footer language switcher (3 flags under the footer) hidden — the header region selector covers every language (Damien 2026-09-24) */
.wpml-ls-statics-footer{display:none !important}
