/* Precioil shared visual foundations. Loaded by the PHP and Node headers in all supported languages. */
html.precioil-theme {
  --po-font: "Segoe UI", "Noto Sans", Roboto, Arial, sans-serif;
  --po-bg: #f4f7fb;
  --po-surface: #ffffff;
  --po-ink: #17324f;
  --po-muted: #596d83;
  --po-blue: #176bc1;
  --po-blue-soft: #eaf3ff;
  --po-line: #dce5ef;
  --po-green: #16804f;
  --po-red: #bd2940;
  --po-radius: 16px;
  --po-control-radius: 10px;
  --po-shadow: 0 3px 12px rgba(23,50,79,.035);
  --po-page-width: 1120px;
}
html.precioil-theme body {
  background: var(--po-bg);
  color: var(--po-ink);
  font-family: var(--po-font);
  --discount-ink: var(--po-ink);
  --discount-muted: var(--po-muted);
  --discount-line: var(--po-line);
  --discount-card: var(--po-surface);
}
/* Shared page titles and introductions; functional layouts keep their own sizing. */
html.precioil-theme :is(.page-provincias .hero-home-like h1,.discounts-hero h1,.stats-title,#routePlanner .hero h1,.municipality-overview h1) {
  font-family: var(--po-font);
  font-size: 36px;
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: -.025em;
  min-height: 0;
  color: var(--po-ink);
  margin-top: 0;
  text-wrap: pretty;
}
html.precioil-theme :is(.page-intro,.discounts-intro,.stats-intro,#routePlanner .hero-copy) {
  font-family: var(--po-font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--po-muted);
  margin-top: 10px;
  padding-bottom: 0;
  border-bottom: 0;
  max-width: 850px;
}
html.precioil-theme :is(.hero-kicker,.discounts-kicker,.stats-kicker,.brand-kicker,.home-national__kicker,#routePlanner .eyebrow) {
  font-family: var(--po-font);
  color: var(--po-blue);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.4;
}
html.precioil-theme :is(.page-provincias .hero-home-like,.discounts-page,.stats-shell) {
  box-sizing: border-box;
  width: calc(100% - 48px);
  max-width: var(--po-page-width);
  margin-left: auto;
  margin-right: auto;
}
html.precioil-theme :is(.discounts-page,.stats-shell) {padding: 0 0 40px;}
html.precioil-theme :is(.discounts-hero,.stats-hero) {margin: 0 0 24px;padding: 28px 0 0;}
html.precioil-theme .page-provincias .hero-home-like {padding:28px 0 2px;}
html.precioil-theme .page-provincias .top {
  box-sizing: border-box;
  width: calc(100% - 48px);
  max-width: var(--po-page-width);
  margin: 24px auto;
  padding: 24px;
}
/* Surfaces share borders and radii, without changing grids or visibility. */
html.precioil-theme :is(.page-provincias .top,.brand-block,.stats-panel,.container-faq,.discounts-empty,.discounts-note,.home-national__panel,.home-ranking,.home-national-links,.municipality-overview,.municipality-list,.municipality-station-card) {
  background: var(--po-surface);
  border: 1px solid var(--po-line);
  border-radius: var(--po-radius);
  box-shadow: var(--po-shadow);
}
html.precioil-theme :is(.plan-card,.country-chart-card,.home-fuel-card) {
  border-color: var(--po-line);
  border-radius: 12px;
  background-color: var(--po-surface);
  box-shadow: none;
}
html.precioil-theme :is(.brand-block,.stats-panel,.container-faq) {padding: 24px;margin-bottom:24px;}
html.precioil-theme :is(.section-head h2,.brand-head h2,.stats-panel-head h2,.container-faq h2,.home-national h2) {
  font-family: var(--po-font);
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -.015em;
  color: var(--po-ink);
}
html.precioil-theme :is(.plan-card h3,.chart-title) {font-family:var(--po-font);font-size:21px;line-height:1.3;color:var(--po-ink);}
html.precioil-theme :is(.plan-amount,.chart-price,.home-fuel-card__metric strong) {font-variant-numeric:tabular-nums;}
html.precioil-theme .plan-amount {color:var(--po-green);font-size:28px;}
html.precioil-theme .chart-price {color:var(--po-ink);font-size:32px;}
html.precioil-theme .plan-type {background:#eef7f1;color:var(--po-green);}
html.precioil-theme .brand-count {border:1px solid var(--po-line);border-radius:12px;background:var(--po-blue-soft);color:var(--po-blue);}
html.precioil-theme .stats-panel-head {text-align:left;max-width:none;margin:0 0 20px;}
html.precioil-theme .stats-panel-head h2 {text-align:left;}
html.precioil-theme :is(.page-provincias .zone-search__field input,.stats-shell #countrySelect,.stats-shell select,.po-brand-filter input,.po-brand-filter select) {
  box-sizing:border-box;font-family:var(--po-font);font-size:16px;min-height:48px;border:1px solid var(--po-line);border-radius:var(--po-control-radius);background:#fff;color:var(--po-ink);
}
html.precioil-theme :is(.stats-shell select,.po-brand-filter input,.po-brand-filter select) {padding:10px 12px;}
html.precioil-theme :is(.page-provincias .provincia a,.page-provincias .municipio-link) {font-family:var(--po-font);font-size:16px;border-radius:10px;}
html.precioil-theme :is(.plan-details summary,.back-link,.zone-search__change-province) {color:var(--po-blue);}
html.precioil-theme :is(.discounts-page,.stats-shell,.page-provincias) :is(a,button,input,select,summary):focus-visible {outline:2px solid var(--po-blue);outline-offset:3px;}
/* Map: retain its search and map behavior, simplify the decoration. */
html.precioil-theme body.home-search-page:is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) {background:var(--po-bg) !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #content.search-panel {background:#fff !important;border:1px solid var(--po-line) !important;border-radius:var(--po-radius) !important;box-shadow:var(--po-shadow) !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) :is(.location-container,#distanceDisplay,#orderToggle,#priceSelect) {background:#fff !important;border-color:var(--po-line) !important;border-radius:var(--po-control-radius) !important;box-shadow:none !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) :is(#addressInput,#priceSelect,#distanceDisplay,#orderToggle) {font-family:var(--po-font) !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #ayuda {background:transparent !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) .results-map-container:has(#ayuda) {background:#fff !important;border:1px solid var(--po-line) !important;border-radius:var(--po-radius) !important;box-shadow:var(--po-shadow) !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #ayuda #btnGetLocation2 {background:var(--po-blue) !important;border-color:var(--po-blue) !important;border-radius:var(--po-control-radius) !important;box-shadow:none !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #searchResults #ayuda #titleH1 {font-family:var(--po-font) !important;font-size:36px !important;line-height:1.18 !important;letter-spacing:-.025em !important;color:var(--po-ink) !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #searchResults #ayuda #titleH1 strong {font:inherit !important;font-weight:700 !important;}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #ayuda button {font-family:var(--po-font);}
html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) :is(.home-national__panel,.home-ranking,.home-national-links) {background:#fff !important;box-shadow:var(--po-shadow) !important;border-radius:var(--po-radius) !important;}
/* Routes already have a compact workspace: align tokens and controls only. */
html.precioil-theme body.route-page {background:var(--po-bg);}
html.precioil-theme #routePlanner {--ink:var(--po-ink);--muted:var(--po-muted);--line:var(--po-line);--paper:#fff;--bg:var(--po-bg);--blue:var(--po-blue);--blue-soft:var(--po-blue-soft);--accent:var(--po-blue);font-family:var(--po-font);}
html.precioil-theme #routePlanner :is(.location-field input,.field select,.unit-input input) {font-family:var(--po-font);border-color:var(--po-line);border-radius:var(--po-control-radius);}
html.precioil-theme #routePlanner :is(.planner-shell,.map-panel) {border-color:var(--po-line);border-radius:var(--po-radius);}
html.precioil-theme #routePlanner .primary-button {background:var(--po-blue);border-radius:var(--po-control-radius);font-family:var(--po-font);box-shadow:none;}
/* Discount navigation replaces the long operator cloud with two compact controls. */
.po-brand-filter {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;padding:20px;margin:0 0 24px;background:#fff;border:1px solid var(--po-line);border-radius:var(--po-radius);}
.po-brand-filter label {display:block;font-family:var(--po-font);font-size:14px;font-weight:600;line-height:1.4;margin-bottom:8px;color:var(--po-ink);}
.po-brand-filter input,.po-brand-filter select {display:block;width:100%;min-width:0;}
.po-brand-filter__status {grid-column:1/-1;margin:0;font-size:13px;line-height:1.4;color:var(--po-muted);}
.po-brand-filter [hidden],.brand-block[hidden] {display:none !important;}
html.precioil-theme .brand-block {scroll-margin-top:20px;}
@media(max-width:700px) {
  html.precioil-theme :is(.page-provincias .hero-home-like,.discounts-page,.stats-shell,.page-provincias .top) {width:calc(100% - 32px);}
  html.precioil-theme :is(.discounts-hero,.stats-hero) {padding-top:24px;margin-bottom:20px;}
  html.precioil-theme .page-provincias .hero-home-like {padding:24px 0 2px;}
  html.precioil-theme :is(.page-provincias .hero-home-like h1,.discounts-hero h1,.stats-title,#routePlanner .hero h1,.municipality-overview h1) {font-size:28px;line-height:1.2;min-height:0;}
  html.precioil-theme :is(.home-locale-es,.home-locale-pt,.home-locale-fr,.home-locale-it) #searchResults #ayuda #titleH1 {font-size:28px !important;line-height:1.2 !important;}
  html.precioil-theme :is(.page-intro,.discounts-intro,.stats-intro,#routePlanner .hero-copy) {font-size:16px;line-height:1.55;}
  html.precioil-theme :is(.page-provincias .top,.brand-block,.stats-panel,.container-faq) {padding:16px;margin-bottom:20px;}
  html.precioil-theme :is(.section-head h2,.brand-head h2,.stats-panel-head h2,.container-faq h2,.home-national h2) {font-size:22px;}
  html.precioil-theme :is(.plan-card h3,.chart-title) {font-size:19px;}
  html.precioil-theme .brand-head {gap:12px;align-items:flex-start;}
  html.precioil-theme .brand-head h2 {overflow-wrap:anywhere;}
  html.precioil-theme .brand-count {flex-shrink:0;min-width:66px;padding:10px;}
  .po-brand-filter {grid-template-columns:minmax(0,1fr);gap:14px;padding:16px;margin-bottom:20px;}
}

html.precioil-theme #countrySelectors {justify-content:flex-start;margin:20px 0 0;}
html.precioil-theme .stats-panel .charts-grid {margin-top:20px;}
@media(max-width:700px){html.precioil-theme #routePlanner .hero {margin-top:10px;}}