/*
 | UnityCRM — prémium fintech-dark téma (Nova 5), v2
 | Egységes cyan a logóból (#00C7D9), a jóváhagyott sötét felület-paletta, finom zebra.
 | CSAK SZÍNEK — az elrendezéshez (padding/margin/display) nem nyúlunk. Kivétel: a logó
 | mérete (a #unitycrm-logo szabályok), mert az új fekvő márkajel aránya más, mint a régié.
 |
 | Betöltés: a publikált resources/views/vendor/nova/layout.blade.php linkeli MINDEN oldalon
 | (a login/guest oldalakon is — a Nova::style csak bejelentkezve szolgálna ki, ezért NEM azt
 | használjuk). A Nova a színeket "r,g,b" CSS-változókban (--colors-*) ÉS beégetett Tailwind
 | dark:-utility-kben adja; mindkettőt lefedjük.
 */

:root,
:host {
  /* ── Cyan primary (a logo 07 gradienséből: 400=#19E3F2, 500=#00C7D9, 600=#00A8C4) ── */
  --colors-primary-50: 234, 251, 253;
  --colors-primary-100: 203, 245, 250;
  --colors-primary-200: 156, 235, 243;
  --colors-primary-300: 96, 220, 236;
  --colors-primary-400: 25, 227, 242;   /* logo cyan light */
  --colors-primary-500: 0, 199, 217;    /* logo primary  */
  --colors-primary-600: 0, 168, 196;    /* logo cyan dark */
  --colors-primary-700: 8, 133, 157;
  --colors-primary-800: 15, 105, 124;
  --colors-primary-900: 17, 80, 95;
  --colors-primary-950: 8, 46, 56;

  /* ── Sötét felület-skála a jóváhagyott hexekből (a gray-* változókat fogyasztó utility-knek:
        divide-*, ring-*, text-* stb.) ── */
  --colors-gray-50: 248, 250, 252;
  --colors-gray-100: 244, 247, 250;   /* elsődleges szöveg #F4F7FA */
  --colors-gray-200: 214, 224, 235;
  --colors-gray-300: 178, 192, 209;
  --colors-gray-400: 148, 163, 184;   /* másodlagos szöveg #94A3B8 */
  /* gray-500 = a Nova halvány segédszövegei (pl. az „Elfelejtett jelszó?" link). A korábbi
     113,129,150 a kártya-háttéren (#161E29) MÉRTEN 4.22:1-et adott, ami a WCAG AA 4.5:1 alatt van.
     124,141,163 → 4.96:1 a kártyán és 6.5:1 a fő háttéren, miközben még egyértelműen halkabb a
     gray-400 másodlagos szövegnél (a hierarchia megmarad). */
  --colors-gray-500: 124, 141, 163;
  --colors-gray-600: 55, 70, 90;
  --colors-gray-700: 38, 50, 65;      /* border/elválasztó #263241 */
  --colors-gray-800: 22, 30, 41;      /* kártya #161E29 */
  --colors-gray-900: 11, 15, 20;      /* fő háttér #0B0F14 */
  --colors-gray-950: 7, 10, 14;
}

/* ══ Felület-hierarchia (a Nova BEÉGETETT dark:bg-gray-* utility-jeinek felülírása) ══
   Spec: alap #0B0F14 · header #111821 · kártya #161E29 · tábla #121923 · tábla-fejléc #1A2430
   · border #263241 · hover/kijelölt #183744 */
.dark [class~="dark:bg-gray-900"] { background-color: #0B0F14 !important; }   /* fő háttér */
.dark [class~="dark:bg-gray-800"] { background-color: #161E29 !important; }   /* kártya / panel */
/* gray-700 felület: LÁTHATÓAN világosabb a kártyánál (aktív lapozó-oldal, disabled input, modal-lábléc
   — #1A2430 a #161E29-en 1.07:1 lenne = láthatatlan kijelölés). */
.dark [class~="dark:bg-gray-700"] { background-color: #223142 !important; }
.dark [class~="dark:border-gray-700"] { border-color: #263241 !important; }
/* border-gray-800 = bg-gray-800 SZÍNAZONOSSÁG: a stock UI szándékosan "láthatatlan" bordert tesz azonos
   színű felületre (pl. a harang-badge glóriája) — más hexre képezve látható gyűrű jelenne meg. */
.dark [class~="dark:border-gray-800"] { border-color: #161E29 !important; }
.dark [class~="dark:border-gray-900"] { border-color: #0B0F14 !important; }
.dark body { background-color: #0B0F14 !important; }

/* ══ A WorkTool által BEÁRNYÉKOLT alap `.text-gray-500` visszaállítása ══
   A WorkTool build a saját tool.css-ébe belefordítja a gyári Tailwind `.text-gray-500`-at
   (#6B7280 beégetve), és a tool.css a Nova app.css UTÁN töltődik — azonos specifikusság mellett a
   forrás-sorrend dönt, így a beégetett érték legyőzi a `var(--colors-gray-500)`-öt fogyasztó
   Nova-szabályt. A sötét felületeken ez MÉRTEN 3.47:1 kontraszt (WCAG AA: 4.5:1) — a munka-táblák
   lapozó-felirata („1–20 / 57"), a MegaFilter „Szűrők visszaállítása" gombja és az audit-napló
   felirata is ez alá esett.

   A `:not([class*="dark:text-"])` KULCSFONTOSSÁGÚ: a legtöbb helyen a `text-gray-500` mellett ott van
   egy `dark:text-gray-400` pár, amit a tervezés szándékosan választott — azokat nem szabad felülírni,
   csak a párosítatlan eseteket. (A `text-gray-600` párosítatlan előfordulásai világos borostyán
   háttéren vannak, ott a kontraszt rendben, ezért azokhoz nem nyúlunk.) */
.dark [class~="text-gray-500"]:not([class*="dark:text-"]) {
  color: rgb(var(--colors-gray-500)) !important;
}

/* Túl sötétre képzett SZÖVEG-tokenek visszaemelése (a --colors-gray-600/700 a spec-borderekhez sötétebb,
   de a breadcrumb-elválasztók / disabled elemek így eltűnnének): */
.dark [class~="dark:text-gray-700"] { color: #4A5B70 !important; }
.dark [class~="dark:text-gray-600"] { color: #5C7089 !important; }

/* Felső fejléc-sáv: a spec szerint egy árnyalattal az alap fölött (#111821). */
.dark [class~="shadow-b"][class~="h-14"] { background-color: #111821 !important; }

/* ══ Resource-index tábla — CSAK a [dusk="resource-table"] táblára scope-olva, hogy más
   táblákat (detail-mezők, dátumválasztó, riport-táblák) NE érintsen ══ */
.dark table[dusk="resource-table"] thead th { background-color: #1A2430 !important; }   /* fejléc */
.dark table[dusk="resource-table"] > tbody td[class~="dark:bg-gray-800"] { background-color: #121923 !important; } /* cellák */
.dark table[dusk="resource-table"] > tbody > tr:nth-child(even) > td { background-color: #161F2A !important; }     /* finom zebra */
.dark table[dusk="resource-table"] > tbody > tr:hover > td { background-color: #183744 !important; }               /* sor-hover */
.dark .group:hover [class~="dark:group-hover:bg-gray-900"] { background-color: #183744 !important; }

/* ══ Hover/fókusz-kompenzáció: a fenti !important alap-hátterek elnyomnák a Tailwind
   dark:hover/focus utility-ket — itt adjuk vissza őket a paletta szerinti tónussal ══ */
.dark [class~="dark:hover:bg-gray-800"]:hover { background-color: #1A2430 !important; }
.dark [class~="dark:focus:bg-gray-800"]:focus { background-color: #1A2430 !important; }
.dark [class~="dark:hover:bg-gray-700"]:hover { background-color: #223142 !important; }
.dark [class~="dark:focus:bg-gray-700"]:focus { background-color: #223142 !important; }
.dark [class~="dark:hover:bg-gray-900"]:hover { background-color: #10161F !important; }

/* ══ DangerButton-helyreállítás: a WorkTool BasicButton alap 'dark:bg-gray-800'-ja a fordított CSS-ben
   legyőzi a rá adott 'bg-red-500'-at (dark módban a destruktív gomb SZÜRKÉNEK látszana). A piros bázis +
   hover elsőbbségét itt állítjuk vissza — a bg-red-500 elemek egyébként is pirosak, ez csak a
   gray-alap ütközést oldja fel. ══ */
.dark [class~="bg-red-500"] { background-color: rgb(239, 68, 68) !important; }
.dark [class~="bg-red-500"]:hover { background-color: rgb(248, 113, 113) !important; }

/* ══ Primary gombok: sötét tinta a cyanon (a fehér ~2:1 kontraszt lenne; a tinta ~8:1) ══ */
.text-white.bg-primary-500,
.bg-primary-500.text-white { color: #04222a !important; }

/* ══ "info" badge-ek: halk semleges chip a harsány sky-kék helyett (a szemantikus
   warning/danger/success borostyán/piros/zöld badge-ek változatlanok) ══ */
.dark [class~="dark:bg-sky-600"] {
  background-color: #1E2A38 !important;
  color: #9FB3C8 !important;
  box-shadow: inset 0 0 0 1px #2C3B4D;
}

/* ══ Logó-méret (a beszúrt SVG id-je alapján; az új fekvő márkajel a régi 6.8:1 helyett
   ~3.2:1 arányú, ezért a stock h-6/h-8 konténerben túl kicsinek hatna) ══ */
svg#unitycrm-logo { height: 2.25rem; width: auto; }                 /* oldalsáv / mobil fejléc */
div.max-w-sm svg#unitycrm-logo { height: 3.5rem; width: auto; }     /* bejelentkező oldal */

/* ══ Látható billentyűzet-fókusz ══
   A Nova több interaktív elemről (linkek, ikon-gombok, lapozó) leszedi az outline-t anélkül, hogy
   mást tenne a helyére — mérve: a bejelentkező oldal „Elfelejtett jelszó?" linkjén fókuszban
   `outline: none` ÉS `box-shadow: none` volt, azaz billentyűzettel navigálva nem látszik, hol áll a
   kurzor. A `:focus-visible` csak billentyűzetes (nem egér-) fókusznál aktiválódik, így a jóváhagyott
   megjelenést egér-használat közben nem változtatja meg. */
.dark a:focus-visible,
.dark button:focus-visible,
.dark [role="button"]:focus-visible,
.dark [tabindex]:not([tabindex="-1"]):focus-visible,
.dark summary:focus-visible {
  outline: 2px solid #00C7D9 !important;
  outline-offset: 2px !important;
  border-radius: 3px;
}

/* Űrlapmezőknél gyűrű helyett a keret világosodjon (az outline a lekerekített inputokon elcsúszna). */
.dark input:focus-visible,
.dark select:focus-visible,
.dark textarea:focus-visible {
  outline: 2px solid #00C7D9 !important;
  outline-offset: 0 !important;
}