/* ESSIKNETWORK — Couche dynamique 100% administrable.
 * Les couleurs viennent de : ESSIKNETWORK > Réglages (+ :root injecté via wp_head).
 * Elementor contrôle le reste (typography, spacing, borders...). Ce fichier
 * ne fait que le "moteur" : dark mode, RTL, CTA global, responsive helpers.
 * AUCUN contenu hardcodé ici.
 */

:root{
  --essik-radius:16px;
  --essik-shadow:0 12px 40px rgba(2,6,23,.08);
  --essik-font:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Cairo",Arial,sans-serif;
}

html{scroll-behavior:smooth}
body{font-family:var(--essik-font);-webkit-font-smoothing:antialiased}

/* CTA global — texte/URL/couleurs administrables */
.essik-global-cta{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--essik-primary,#FF5500);color:#fff;
  padding:.8rem 1.4rem;border-radius:12px;font-weight:800;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.06em;text-decoration:none;
  box-shadow:0 10px 25px rgba(255,85,0,.25);transition:.2s;
}
.essik-global-cta:hover{background:var(--essik-primary-hover,#E04B00);color:#fff;transform:translateY(-1px)}

/* ---------- DARK MODE GLOBAL (localStorage + data-theme) ---------- */
html[data-theme="dark"] body,
html[data-theme="dark"] .essik-services-section,
html[data-theme="dark"] .essik-hero-section{
  background-color:var(--essik-dark-bg,#090B0E);
  color:#e2e8f0;
}
html[data-theme="dark"] .essik-service-card,
html[data-theme="dark"] .essik-hero-container .essik-metric,
html[data-theme="dark"] .ed-form-shell{
  background-color:var(--essik-dark-surface,#12161F) !important;
  border-color:var(--essik-dark-border,#1F2633) !important;
  color:#e2e8f0;
}
html[data-theme="dark"] .essik-service-title,
html[data-theme="dark"] .essik-hero-title{color:#fff !important}

/* Toggle bouton (widget + shortcode) */
.essik-theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:10px;border:1px solid #e2e8f0;
  background:#fff;cursor:pointer;transition:.2s;
}
html[data-theme="dark"] .essik-theme-toggle{background:var(--essik-dark-surface);border-color:var(--essik-dark-border);color:#fbbf24}

/* ---------- RTL (arabe) ---------- */
html[dir="rtl"] body{direction:rtl;text-align:right}
html[dir="rtl"] .essik-services-grid{direction:rtl}
html[dir="rtl"] .essik-hero-buttons{flex-direction:row-reverse}

/* ---------- Responsive helpers (Elementor gère le reste) ---------- */
.essik-services-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr)}
@media(max-width:1024px){.essik-services-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.essik-services-grid{grid-template-columns:1fr}}
.essik-service-card{border-radius:var(--essik-radius);box-shadow:var(--essik-shadow);overflow:hidden}
.essik-service-thumb img{width:100%;height:auto;display:block}

/* Accessibilité */
.essik-service-link:focus-visible,.essik-global-cta:focus-visible,.essik-theme-toggle:focus-visible{
  outline:2px solid var(--essik-primary,#FF5500);outline-offset:2px;
}
