/*
Theme Name: MAGARI
Theme URI: https://github.com/Ftoix10/electro
Author: FtoiDev
Description: A bilingual automotive showroom theme for car dealerships, powered by MAGARI Core.
Version: 0.2.3
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: magari
*/

/*
 * MAGARI 0.1 is the portable theme foundation.
 * Production visual components are migrated from the approved ELECTRO design
 * into theme templates in the next productization phase.
 */

:root {
  --magari-red: #e31e2d;
  --magari-ink: #0d1216;
  --magari-muted: #69747c;
  --magari-line: #d9dddf;
  --magari-warm: #f4f1eb;
  --magari-dark: #0b1115;
}

html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
body { margin: 0; color: var(--magari-ink); background: #fff; }
.magari-shell { min-height: 60vh; }
.magari-content { width: min(1180px, calc(100% - 48px)); margin-inline: auto; padding: 56px 0; }


/* MAGARI base typography — portable replacement for former Blocksy defaults */
html { -webkit-text-size-adjust: 100%; }
body.magari-theme {
  margin: 0;
  background: #fff;
  color: #0d1216;
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.magari-theme[dir="rtl"],
html[dir="rtl"] body.magari-theme {
  font-family: "IBM Plex Sans Arabic", Arial, sans-serif;
}
body.magari-theme button,
body.magari-theme input,
body.magari-theme select,
body.magari-theme textarea {
  font: inherit;
}
body.magari-theme img {
  max-width: 100%;
}
body.magari-theme h1,
body.magari-theme h2,
body.magari-theme h3,
body.magari-theme h4,
body.magari-theme p {
  margin-block-start: 0;
}


/* MAGARI site canvas — matches the approved SHOP proportions.
 * Public website pages share the same outer width as the site footer.
 * Showroom Display is intentionally excluded because it is a fullscreen tool.
 */
:root {
  --magari-site-width: 1180px;
  --magari-site-gutter: 48px;
}

body.magari-theme {
  background: #eef2f3;
}

body.magari-theme .electro-site-header,
body.magari-theme .electro-site-footer,
body.magari-theme main.v3,
body.magari-theme main.legalv3,
body.magari-theme main.magari-inventory-page {
  width: min(var(--magari-site-width), calc(100% - var(--magari-site-gutter))) !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}

body.magari-theme main.v3,
body.magari-theme main.legalv3,
body.magari-theme main.magari-inventory-page {
  overflow: hidden;
  background: #fff;
}

/* Keep all section backgrounds inside the site canvas. */
body.magari-theme main.v3 > section,
body.magari-theme main.legalv3 > section,
body.magari-theme main.magari-inventory-page > section,
body.magari-theme main.magari-inventory-page > div {
  max-width: 100%;
}

/* The inner content keeps the same breathing room used in the approved build. */
body.magari-theme main.v3 .v3w,
body.magari-theme main.legalv3 .lv3w,
body.magari-theme main.magari-inventory-page .ev3-wrap {
  width: min(100% - 48px, 1132px);
  margin-inline: auto;
}

/* Core vehicle renderer lives inside the MAGARI page canvas. */
body.magari-theme main.magari-inventory-page .ev3-inventory-shell,
body.magari-theme main.magari-inventory-page .ev3-featured {
  width: 100%;
  margin-inline: 0;
}

/* Prevent browser/theme defaults from making the centered canvas appear wider. */
body.magari-theme main.v3 img,
body.magari-theme main.legalv3 img,
body.magari-theme main.magari-inventory-page img {
  max-width: 100%;
}

@media (max-width: 640px) {
  :root {
    --magari-site-gutter: 26px;
  }

  body.magari-theme main.v3 .v3w,
  body.magari-theme main.legalv3 .lv3w,
  body.magari-theme main.magari-inventory-page .ev3-wrap {
    width: min(100% - 26px, 1132px);
  }
}