/* Network page: Algeria map + dealer cards. Loaded after main.css. */
.network {
  --map-idle: #e6eaf0;
  --map-idle-hover: #d9dfe7;
  --map-active: var(--g-accent);
  --map-hover: #3d7ee6;
  --map-dealers: #9dbdf0;
  --map-stroke: #ffffff;
  display: grid;
  gap: clamp(28px, 4vw, 48px);
}
/* Hero */
.network-hero { position: relative; overflow: hidden; background: var(--g-dark); color: var(--g-on-dark); }
.network-hero::before { content: ""; position: absolute; inset: -20% -10% auto auto; inline-size: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(15, 95, 214, 0.45), rgba(15, 95, 214, 0)); pointer-events: none; }
.network-hero__inner { position: relative; display: grid; gap: clamp(28px, 4vw, 64px); align-items: end; padding-block: clamp(56px, 8vw, 110px) clamp(40px, 6vw, 72px); }
@media (min-width: 900px) { .network-hero__inner { grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); } }
.network-hero .section__eyebrow { color: #9cc0ff; }
.network-hero__title { margin: 0 0 16px; color: #fff; font-size: clamp(2.6rem, 6vw, 4.6rem); }
.network-hero__lead { margin: 0; max-width: 56ch; color: var(--g-on-dark-muted); font-size: 1.12rem; }
.network-hero__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.network-hero__stats div { padding: 18px 20px; border-radius: var(--g-radius-sm); background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); }
.network-hero__stats dd { margin: 0 0 4px; font-size: clamp(1.6rem, 2.6vw, 2.3rem); font-weight: 600; letter-spacing: -0.03em; color: #fff; line-height: 1.05; }
.network-hero__stats dt { font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--g-on-dark-muted); font-weight: 600; }
@media (max-width: 599px) { .network-hero__stats { grid-template-columns: 1fr 1fr; } }

.network__toolbar { display: grid; gap: 20px; align-items: end; }
@media (min-width: 900px) { .network__toolbar { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); } .network__toolbar .network__field { justify-self: end; inline-size: 100%; } }
.network__intro { max-width: 720px; }
.network__heading { font-size: clamp(1.6rem, 3vw, 2.4rem); margin-block-end: 8px; }
.network__field { display: grid; gap: 8px; max-width: 460px; margin: 0; }
.network__label { font-weight: 600; color: var(--g-ink); }
.network__select { inline-size: 100%; font: inherit; color: var(--g-ink); background: #fff; border: 1px solid var(--g-line-strong); border-radius: 999px; padding-block: 13px; padding-inline: 18px; }
.network__select:focus-visible { outline: 2px solid var(--g-accent); outline-offset: 2px; }
.network__layout { display: grid; gap: 32px; align-items: start; }
@media (min-width: 960px) { .network__layout { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.network__map { position: relative; background: #fff; border: 1px solid var(--g-line); border-radius: var(--g-radius); padding: clamp(12px, 2vw, 24px); box-shadow: var(--g-shadow); }
.algeria-map__svg { display: block; inline-size: 100%; block-size: auto; overflow: visible; }
.algeria-map__svg .wilaya { fill: var(--map-idle); stroke: var(--map-stroke); stroke-width: 1.1; stroke-linejoin: round; transition: fill 0.25s var(--g-ease); }
.algeria-map__svg .wilaya:not(.has-dealers):hover { fill: var(--map-idle-hover); }
.algeria-map__svg .wilaya.has-dealers { fill: var(--map-dealers); cursor: pointer; }
.algeria-map__svg .wilaya.has-dealers:hover { fill: var(--map-hover); }
.algeria-map__svg .wilaya.is-active { fill: var(--map-active); stroke: #fff; stroke-width: 2; }
.algeria-map__svg .wilaya:focus { outline: none; }
.algeria-map__svg .wilaya:focus-visible { outline: 3px solid var(--g-accent); outline-offset: 3px; stroke: #fff; stroke-width: 2.4; }
@media (prefers-reduced-motion: reduce) { .algeria-map__svg .wilaya { transition: none; } }
.network__tooltip { position: absolute; inset-block-start: 0; inset-inline-start: 0; z-index: 2; pointer-events: none; padding-block: 6px; padding-inline: 12px; border-radius: 999px; background: var(--g-ink); color: #fff; font-size: 0.85rem; white-space: nowrap; box-shadow: var(--g-shadow); }
.network__tooltip[hidden] { display: none; }
.network__panel { display: grid; gap: 24px; align-content: start; min-block-size: 120px; }
@media (min-width: 960px) { .network__panel { position: sticky; top: calc(var(--g-header-h) + 24px); } .network__map { position: sticky; top: calc(var(--g-header-h) + 24px); } }
.algeria-map__svg .wilaya.has-dealers { fill: var(--g-accent); opacity: 0.55; }
.algeria-map__svg .wilaya.has-dealers:hover { opacity: 0.85; fill: var(--g-accent); }
.algeria-map__svg .wilaya.is-active { opacity: 1; fill: var(--g-ink); }
.network-panel__group { display: grid; gap: 12px; }
.network-panel__title { font-size: 1.4rem; margin: 0; }
.network-panel__count { margin: 0; font-size: 0.9rem; }
.network-panel__cards { display: grid; gap: 16px; }
.network-panel__empty { margin: 0; }
.network-card { box-shadow: none; }
.network-card__name { font-size: 1.1rem; margin-block-end: 8px; }
.network-card__address { margin-block: 0 10px; color: var(--g-muted); }
.network-card__phones { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 4px; }
.network-card__phones a, .network-card__email a, .network-card__map { display: inline-flex; align-items: center; gap: 8px; color: var(--g-ink); font-weight: 600; }
.network-card__phones a:hover, .network-card__email a:hover, .network-card__map:hover { color: var(--g-accent); }
.network-card .icon { fill: none; color: var(--g-accent); inline-size: 16px; block-size: 16px; }
.network-card__email { margin-block: 0 10px; }
.network-card__hours { margin-block: 0 10px; font-size: 0.9rem; white-space: pre-line; }
.network-card__map { margin-block-start: 4px; }
.network__list { display: grid; gap: 12px; }
.network-details { background: #fff; border: 1px solid var(--g-line); border-radius: var(--g-radius); padding-block: 4px; padding-inline: 22px; transition: box-shadow 0.3s; }
.network-details[open] { box-shadow: var(--g-shadow); }
.network-details__summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; padding-block: 16px; font-weight: 600; color: var(--g-ink); list-style: none; }
.network-details__summary::-webkit-details-marker { display: none; }
.network-details__summary:focus-visible { outline: 2px solid var(--g-accent); outline-offset: 2px; }
.network-details__count { min-inline-size: 28px; text-align: center; border-radius: 999px; padding-block: 3px; padding-inline: 10px; font-size: 0.82rem; background: var(--g-surface); color: var(--g-ink); }
.network-details__cards { padding-block-end: 22px; }
