﻿:root {
  /* Core color tokens */
  --c-terre-cuite:#C4623B; /* Primary */
  --c-olive:#5B6B2A;       /* Secondary */
  --c-bleu-zellige:#1F3F60; /* Accent */
  --c-sable:#F3E7D6;       /* Light neutral background */
  --c-indigo-nuit:#0B0F14; /* Strong text */
  --c-harissa:#D93A2B;     /* Danger / alert */
  --c-menthe:#6EE7B7;      /* Success */
  --c-card:#FFFFFF;        /* Card surface */
  --c-muted:#6B7280;       /* Muted text */

  /* Typography */
  --ff-body:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --ff-head:"Fraunces",Georgia,serif;
  --ff-ar:"Cairo","Noto Kufi Arabic",system-ui,sans-serif;

  /* Spacing scale */
  --sp-1:8px; --sp-2:12px; --sp-3:16px; --sp-4:24px; --sp-5:32px; --sp-6:48px;

  /* Radius & elevation */
  --radius:16px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --shadow-md:0 8px 24px rgba(0,0,0,.12);

  /* Semantic aliases */
  --bg:var(--c-sable);
  --fg:var(--c-indigo-nuit);
  --primary:var(--c-terre-cuite);
  --secondary:var(--c-olive);
  --accent:var(--c-bleu-zellige);
  --success:var(--c-menthe);
  --danger:var(--c-harissa);

  /* Legacy variable bridges (so old styles keep working) */
  --color-bg:var(--bg);
  --color-fg:var(--fg);
  --color-primary:var(--primary);
  --color-accent:var(--accent);
  --color-muted:var(--c-muted);
  --color-card:var(--c-card);
  --bs-body-bg:var(--bg);
  --bs-body-color:var(--fg);
  --bs-link-color:var(--primary);
  --bs-link-hover-color:color-mix(in oklab,var(--primary),#000 18%);
  --bs-border-radius-lg:var(--radius);
  --transition-fast:.18s cubic-bezier(.4,0,.2,1);
  --font-sans-heading:var(--ff-head);
  --font-sans:var(--ff-body);
}
[data-theme="dark"] {
  --c-card:#0F141A;
  --c-sable:#12161B;
  --c-muted:#9CA3AF;
  --c-indigo-nuit:#E5E7EB;
  --c-terre-cuite:#D77751;
  --c-olive:#7A8B44;
  --c-bleu-zellige:#2C5682;
  --bg:var(--c-sable);
  --fg:var(--c-indigo-nuit);
}

html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--fg); font-family:var(--ff-body); -webkit-font-smoothing:antialiased; }
body[dir="rtl"] { font-family:var(--ff-ar); }
h1,h2,h3,h4,h5,h6,.navbar-brand { font-family:var(--ff-head); letter-spacing:-.01em; }

/* Links & focus */
a { text-decoration:none; }
a:hover { text-decoration:underline; }
.form-control:focus, .form-select:focus, .btn:focus, a:focus, button:focus { outline:2px solid var(--accent); outline-offset:2px; box-shadow:none; }

/* Buttons */
.btn-primary { --bs-btn-bg:var(--primary); --bs-btn-border-color:var(--primary); --bs-btn-hover-bg:color-mix(in oklab,var(--primary),#000 12%); --bs-btn-hover-border-color:color-mix(in oklab,var(--primary),#000 12%); --bs-btn-active-bg:color-mix(in oklab,var(--primary),#000 20%); --bs-btn-active-border-color:color-mix(in oklab,var(--primary),#000 20%); }
.btn-outline-primary { --bs-btn-color:var(--primary); --bs-btn-border-color:var(--primary); --bs-btn-hover-bg:var(--primary); --bs-btn-hover-border-color:var(--primary); --bs-btn-active-bg:color-mix(in oklab,var(--primary),#000 15%); }
.btn-light { --bs-btn-color:#111; }

/* Badges / chips */
.badge-olive { background:color-mix(in oklab,var(--secondary),#fff 22%); color:#13210f; font-weight:500; }
[data-theme="dark"] .badge-olive { background:color-mix(in oklab,var(--secondary),#000 25%); color:var(--c-menthe); }

/* Cards */
.card { border:0; border-radius:var(--radius); box-shadow:var(--shadow-sm); background:var(--c-card); }
.card-elevated { box-shadow:var(--shadow-md); transition:transform var(--transition-fast), box-shadow var(--transition-fast); }
.card-elevated:hover { transform:translateY(-3px); box-shadow:0 12px 32px -4px rgba(0,0,0,.18); }
[data-theme="dark"] .card-elevated:hover { box-shadow:0 12px 32px -4px rgba(0,0,0,.55); }

/* Imagery */
img.cover { object-fit:cover; width:100%; height:100%; }
.ratio-1x1 { aspect-ratio:1/1; }
.ratio-16x9 { aspect-ratio:16/9; }
.ratio-4x3 { aspect-ratio:4/3; }

/* Navigation */
.navbar { backdrop-filter:saturate(140%) blur(10px); }
.navbar-brand .logo-symbol { width:44px; height:44px; background:var(--primary); color:#fff; font-weight:700; font-size:1.05rem; letter-spacing:.5px; }
.navbar-nav .nav-link { font-weight:500; position:relative; padding:.5rem .75rem; }
.navbar-nav .nav-link.active:after { content:""; position:absolute; left:8px; right:8px; bottom:4px; height:3px; border-radius:3px; background:var(--primary); }

/* Hero */
.hero { padding-block:var(--sp-6) var(--sp-5); }
.hero-surface { background:linear-gradient(145deg, color-mix(in oklab,var(--primary),#fff 75%), transparent 65%), var(--bg); border-radius:calc(var(--radius) * 1.5); padding:clamp(1.5rem,3vw,3rem); position:relative; overflow:hidden; }
.hero-surface:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 85% 15%, color-mix(in oklab,var(--accent),#fff 80%), transparent 60%); mix-blend-mode:multiply; opacity:.75; pointer-events:none; }

/* Section spacing */
.section { padding-block:var(--sp-5); }
@media (min-width:768px){ .section { padding-block:var(--sp-6); } }

/* Brand & product grids */
.brand-grid, .product-grid { --gap:1.5rem; display:grid; gap:var(--gap); grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); }

/* Brand card horizontal */
.brand-card-horizontal { 
  display:block; 
  color:inherit; 
  transition:transform var(--transition-fast), box-shadow var(--transition-fast); 
  overflow:hidden;
  border:1px solid rgba(0,0,0,.06);
}
.brand-card-horizontal:hover { 
  transform:translateY(-2px); 
  box-shadow:var(--shadow-md); 
  text-decoration:none;
  border-color:color-mix(in oklab,var(--primary),transparent 70%);
}
[data-theme="dark"] .brand-card-horizontal { border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .brand-card-horizontal:hover { 
  box-shadow:0 12px 32px -4px rgba(0,0,0,.55); 
  border-color:color-mix(in oklab,var(--primary),transparent 50%);
}

.brand-logo-round { 
  width:80px; 
  height:80px; 
  border-radius:50%; 
  overflow:hidden; 
  background:var(--c-sable);
  border:3px solid color-mix(in oklab,var(--primary),#fff 85%);
  flex-shrink:0;
}
[data-theme="dark"] .brand-logo-round { 
  background:var(--c-card); 
  border-color:color-mix(in oklab,var(--primary),#000 50%);
}
.brand-logo-round img { 
  width:100%; 
  height:100%; 
  object-fit:cover;
}

.brand-card-footer { 
  border-top:1px solid rgba(0,0,0,.06);
}
[data-theme="dark"] .brand-card-footer { 
  background:color-mix(in oklab,var(--bg),#000 30%); 
  border-top-color:rgba(255,255,255,.08);
}

.line-clamp-2 {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  line-clamp:2;
  overflow:hidden;
}

.min-w-0 { min-width:0; }

/* Excerpts */
.text-muted { color:var(--c-muted) !important; }

/* Stats */
.stats-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); }
.stat-tile { background:var(--c-card); border-radius:var(--radius); padding:1.25rem 1rem; box-shadow:var(--shadow-sm); text-align:center; position:relative; }
.stat-tile .icon { font-size:1.75rem; display:block; margin-bottom:.25rem; color:var(--accent); }
.stat-tile strong { display:block; font-size:2rem; font-weight:600; letter-spacing:-.02em; }

/* Breadcrumb */
.breadcrumb { --bs-breadcrumb-divider: ''; font-size:.85rem; }
.breadcrumb-item + .breadcrumb-item::before { content: none; }

/* Footer */
footer { font-size:.875rem; background:color-mix(in oklab,var(--bg),#000 4%); }
footer h6, footer .h6 { letter-spacing:.06em; text-transform:uppercase; font-size:.75rem; font-weight:600; }
footer a { color:var(--primary); }
footer a:hover { color:color-mix(in oklab,var(--primary),#000 15%); }

/* Theme toggle icons */
.theme-icon-dark, [data-theme="dark"] .theme-icon-light { display:none !important; }
[data-theme="dark"] .theme-icon-dark { display:inline-block !important; }

/* Admin */
.admin-sidebar { width:220px; }
@media (max-width: 991.98px){ .admin-sidebar { width:100%; margin-bottom:1rem; } }
.admin-form-wrapper { max-width:720px; }
.sticky-actions { position:sticky; bottom:0; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); padding:1rem 0; margin-top:1rem; border-top:1px solid rgba(0,0,0,.08); }
[data-theme="dark"] .sticky-actions { background:rgba(15,20,26,.87); border-color:rgba(255,255,255,.1); }
.image-upload-frame { width:180px; height:180px; border:2px dashed var(--c-muted); border-radius:var(--radius); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; background:var(--c-card); }
.image-upload-frame img { width:100%; height:100%; object-fit:cover; }

/* Utilities */
.gap-xs { gap:.25rem; } .gap-sm { gap:.5rem; } .gap-md { gap:1rem; }
.shadow-focus { box-shadow:0 0 0 4px rgba(241,112,19,.35); }
.opacity-80 { opacity:.8; }
.rounded-lg { border-radius:var(--radius) !important; }
.text-small { font-size:.85rem; }
.max-w-600 { max-width:600px; }

/* Legacy overrides kept (trimmed) */
.card-elevated .card-img-top, .card-elevated .ratio img { border-top-left-radius:var(--radius); border-top-right-radius:var(--radius); }

/* Reduce motion */
@media (prefers-reduced-motion:reduce){ * { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } }