/* Itqan identity, September 2026. Colors and keyboard focus; original layout and fonts. */
html:root {
  --brand-navy: #1a365d;
  --brand-navy-deep: #122846;
  --brand-lime: #aad037;
  --brand-lime-ink: #5f7d00;
  --brand-control-tint: #7da6019c;
  --brand-control-hover: #7da601bf;
  --brand-lime-soft: #f0f6de;
  --brand-surface: #f3f6fa;
  --p-primary-50: #f3f6fa;
  --p-primary-100: #e4ecf5;
  --p-primary-200: #cbd9e9;
  --p-primary-300: #a2b9d3;
  --p-primary-400: #718eaf;
  --p-primary-500: #49698e;
  --p-primary-600: #34537a;
  --p-primary-700: #24466c;
  --p-primary-800: #1a365d;
  --p-primary-900: #122846;
  --p-primary-950: #0c1c32;
  --p-primary-color: #1a365d;
  --p-primary-hover-color: #24466c;
  --p-primary-active-color: #122846;
  --p-primary-contrast-color: #fff;
  --p-highlight-background: #f0f6de;
  --p-highlight-focus-background: #e4efbe;
  --p-highlight-color: #1a365d;
  --p-highlight-focus-color: #122846;
  --primary-color: var(--brand-navy);
  --primary-color-100: #e4ecf5;
  --primary-color-200: #cbd9e9;
  --primary-color-300: #49698e;
  --primary-color-500: var(--brand-navy);
  --primary-color-1: var(--brand-navy);
  --primary-color-8: var(--brand-lime-soft);
  --secondary-color: var(--brand-surface);
  --neutral-color-200: #dce4ed;
  --neutral-color-300: #b9c7d7;
  --neutral-color-400: #78899c;
  --neutral-color-500: #66758a;
  --neutral-color-600: #526175;
  --neutral-color-700: #3b4f68;
  --neutral-color-800: #263e5b;
  --neutral-color-900: #182f4c;
  --neutral-color-shade-3: #526175;
  --neutral-color-shade-6: #e9eef5;
  --neutral-color-shade-9: #f7f9fc;
  --tertiary-color-2: #182f4c;
  --tertiary-color-3: #263e5b;
  --tertiary-color-11: #edf2f8;
}

html body { color: var(--neutral-color-900); }
::selection { background-color: var(--brand-lime); color: var(--brand-navy-deep); }
.main-header a[href="/login"] button { background-color: var(--brand-navy); color: #fff; }
html .sidebar .nav-btn.router-link-active,
html .sidebar .nav-btn:not(.p-accordion):hover { background-color: var(--brand-lime-soft); border-color: var(--brand-lime); }
.home-header h1 { color: var(--brand-navy); }
.home-header h1 .text-primary { color: var(--brand-navy) !important; }
.home-header .header-content > p { color: #526175; }
.home-header .header-content a[href="/categories"] button { background-color: var(--brand-lime) !important; color: var(--brand-navy-deep) !important; }
.home-header .header-content a[href="/categories"] button:hover { background-color: #bbdf51 !important; }
.home-header .slide { color: var(--brand-navy) !important; }

.product .text-nowrap.text-primary > svg { color: var(--brand-lime-ink) !important; }
.product .marquee .text-nowrap > svg { color: var(--brand-lime) !important; }
.product button[aria-label="View product details"],
.product button.bg-primary-100 {
  background-color: var(--brand-control-tint) !important;
  border-color: var(--brand-control-tint) !important;
  color: var(--brand-navy) !important;
}
.product button[aria-label="View product details"]:enabled:hover,
.product button.bg-primary-100:enabled:hover {
  background-color: var(--brand-control-hover) !important;
  border-color: var(--brand-control-hover) !important;
}
.product button[aria-label="View product details"]:focus-visible,
.product button.bg-primary-100:focus-visible {
  outline: 2px solid var(--brand-navy);
  outline-offset: 2px;
}
@media (forced-colors: active) {
  .product .text-nowrap > svg,
  .product .text-nowrap.text-primary > svg,
  .product .marquee .text-nowrap > svg { color: CanvasText !important; }
}

.bg-\[\#F9D3D280\], .bg-\[\#F9D3D2\],
.bg-\[\#E3352F1A\] { background-color: var(--brand-lime-soft) !important; }
svg [fill="#F9D3D2"] { fill: var(--primary-color-100); }
svg [fill="#E3352F"] { fill: var(--brand-navy); }
svg [stroke="#E3352F"] { stroke: var(--brand-navy); }
.payment-method-media video { background-color: var(--brand-navy); }
html .address[data-v-cc7aa85d]:hover { background-color: var(--brand-surface); }
html .download-app .wrapper,
html .auth-layout .auth-layout__side:nth-of-type(1) { background-color: var(--brand-navy); color: #fff; }
html .download-app .wrapper { background-image: linear-gradient(285.29deg, var(--brand-navy-deep) .68%, var(--brand-navy) 73.06%); }
html .auth-layout .auth-layout__side:nth-of-type(1) { background-image: linear-gradient(180deg, var(--brand-navy), var(--brand-navy-deep)); }
.download-app a:focus-visible, .auth-layout__side:first-child a:focus-visible { outline-color: var(--brand-lime); }
footer { background-color: var(--brand-surface) !important; border-color: #dce4ed !important; color: var(--brand-navy); }
.seo-fallback { color: var(--neutral-color-900); }
.seo-fallback h1, .seo-fallback h2, .seo-fallback a { color: var(--brand-navy); }

body[data-admin-page], body.login-page {
  --primary: var(--brand-navy);
  --primary-dark: var(--brand-navy-deep);
  --primary-soft: var(--brand-lime-soft);
  --secondary: var(--brand-surface);
  --ink: #182f4c;
  --muted: #526175;
  --line: #dce4ed;
  --line-strong: #b9c7d7;
  --surface-subtle: #f3f6fa;
  --focus: var(--brand-navy);
}
body[data-admin-page] .ops-summary { border-color: #dce4ed; background-color: var(--brand-surface); }
body[data-admin-page] .icon-btn:hover,
body[data-admin-page] .ghost-btn:hover { border-color: var(--brand-navy); }
body.login-page { background-color: var(--brand-surface); }
