/* Alternative UI color/font profiles — "Light" and "Gov" — switchable globally by a Super
   administrátor (users-admin.dc.html -> backend/api/theme-profile.php ->
   AppSettings::activeThemeProfile()). Both live in this one file (despite the filename) since both
   load via the same <link> tag already wired into every page — adding "Gov" this way needed zero
   changes to any of the 35 pages themselves, only here plus the small set of backend/toggle files
   that validate/apply the profile value. Loaded on every page alongside profile-toggle.js, which
   sets [data-klv-profile="light"|"gov"] on <html> when one of these is active (removed entirely
   for "Gold", the original/default).

   Deliberately pure-override, not a replacement stylesheet: every page's own embedded <style>
   block (its :root { --klv-*: ... } definitions, the "Gold" profile) is untouched — this file only
   redefines the SAME custom-property names, scoped under a higher-specificity selector
   (html[data-klv-profile="light"] beats a bare :root), so switching back to "Gold" needs no
   backup/restore step at all; it's simply what renders when this attribute is absent.

   The one deliberate exception is the left navy sidebar (background:#12233D and its related
   hardcoded hex colors in each page's markup) and the top brand bar on dashboard.dc.html — per
   explicit request, those keep their original color untouched; only their font changes here (via
   the universal font-family rule below, which applies everywhere including the sidebar). Nothing
   in this file touches those hardcoded hex values, so this is naturally guaranteed, not something
   that needs separate care per page. */

html[data-klv-profile="light"] {
  --klv-bg-page: #F3F4F6;
  --klv-bg-surface: #FFFFFF;
  --klv-bg-subtle: #F8F9FB;
  --klv-border: #E5E7EB;
  --klv-border-soft: #EDEEF1;
  --klv-text-heading: #111827;
  --klv-text-body: #374151;
  --klv-text-body-alt: #4B5563;
  --klv-text-label: #374151;
  --klv-text-muted: #6B7280;
  /* Reuses the existing --klv-accent-gold variable NAME (referenced throughout every page for
     buttons, active states, focus rings, badges) with a new blue VALUE — this is what recolors
     every accent/primary-action element app-wide without needing to touch a single page's markup. */
  --klv-accent-gold: #2563EB;
  --klv-danger: #DC2626;
  --klv-success: #16A34A;
  --klv-danger-bg: #FEE2E2;
  --klv-danger-border: #FECACA;
  --klv-warning-bg: #FEF3C7;
  --klv-warning-border: #FDE68A;
  --klv-text-warning: #B45309;
  --klv-success-bg: #DCFCE7;
  --klv-success-border: #BBF7D0;
  --klv-info-bg: #DBEAFE;
}

/* Dark sub-mode of the Light profile — combines with each page's existing [data-theme="dark"]
   toggle (theme-toggle.js, a separate per-device preference). Screenshots supplied only covered
   light mode; these dark values are a matching, consistent counterpart designed to the same
   palette (same blue accent, same neutral-gray family, not just an automatic inversion). */
html[data-klv-profile="light"][data-theme="dark"] {
  --klv-bg-page: #0F1115;
  --klv-bg-surface: #1A1D23;
  --klv-bg-subtle: #22262E;
  --klv-border: #2D323C;
  --klv-border-soft: #383E4A;
  --klv-text-heading: #F3F4F6;
  --klv-text-body: #D1D5DB;
  --klv-text-body-alt: #C7CBD3;
  --klv-text-label: #C7CBD3;
  --klv-text-muted: #9CA3AF;
  --klv-accent-gold: #3B82F6;
  --klv-danger: #F87171;
  --klv-success: #4ADE80;
  --klv-danger-bg: #3F1D1D;
  --klv-danger-border: #5C2626;
  --klv-warning-bg: #3F2E10;
  --klv-warning-border: #5C4419;
  --klv-text-warning: #FBBF24;
  --klv-success-bg: #14291C;
  --klv-success-border: #1F4D2C;
  --klv-info-bg: #1E2A3F;
}

/* Font — every page currently hardcodes 'Public Sans' as a literal string dozens of times
   (inline style="font-family:..." attributes, which have higher specificity than any selector-
   based CSS short of !important) rather than through a variable. Overriding via the universal `*`
   selector + !important here avoids needing to find/replace that literal string across 40 files
   individually — safe specifically because this rule is scoped to [data-klv-profile="light"] and
   touches nothing when "Gold" is active. Applies everywhere, including the sidebar, per explicit
   request (colors stay, font changes). */
html[data-klv-profile="light"] * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Notification-dropdown unread/item cards — a light-blue card background per explicit reference
   (screenshots), rather than the plain row-with-bottom-border every page uses today. Targets a
   `klv-notif-item` class added to each page's notification-row <a> elements; harmless no-op on
   any page that doesn't have the class yet (nothing selects, nothing breaks). */
html[data-klv-profile="light"] .klv-notif-item {
  background: var(--klv-info-bg) !important;
  border-radius: 8px;
  margin: 0 8px 6px;
  border-bottom: none !important;
}
html[data-klv-profile="light"] .klv-notif-item:last-child {
  margin-bottom: 0;
}

/* Cards/surfaces get a touch more roundedness and a soft shadow to match the reference screenshots
   — applied broadly via a class already used across pages for card-like containers where present,
   plus the page background switch above already does most of the visual work on its own. */
html[data-klv-profile="light"] .klv-card {
  border-radius: 10px !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 3px rgba(16, 24, 40, 0.06) !important;
}

/* ==========================================================================================
   "Gov" profile — matches the clean, official look of Czech government web portals (ARES,
   Veřejný rejstřík/justice.cz, ROS) per reference screenshots: white content, a solid official
   blue accent (not gradient — CSS custom properties can't carry a gradient value, and the
   reference header's dark-to-mid-blue sweep isn't something every element that reads this
   variable could sensibly inherit anyway), light blue-tinted section bands, squared-off rather
   than heavily rounded cards. Same "pure override, nothing else touched" approach as Light —
   see that profile's own comment above for why this needs no backup/restore step and leaves the
   sidebar/brand-blue panel and its logo alone (no variable in this block touches those hardcoded
   hex values). Added 2026-08-20.
   ========================================================================================== */
html[data-klv-profile="gov"] {
  --klv-bg-page: #FFFFFF;
  --klv-bg-surface: #FFFFFF;
  --klv-bg-subtle: #F3F4F6;
  --klv-border: #D7DEE8;
  --klv-border-soft: #E1E6ED;
  --klv-text-heading: #0F2A4A;
  --klv-text-body: #33404F;
  --klv-text-body-alt: #3D4C5E;
  --klv-text-label: #33404F;
  --klv-text-muted: #5B6B7F;
  --klv-accent-gold: #0B5FBA;
  --klv-danger: #C0392B;
  --klv-success: #1F8A4C;
  --klv-danger-bg: #FBEAE8;
  --klv-danger-border: #F0C4BE;
  --klv-warning-bg: #FCF3DA;
  --klv-warning-border: #EEDBA0;
  --klv-text-warning: #8A6416;
  --klv-success-bg: #E4F3EA;
  --klv-success-border: #BFE1CC;
  --klv-info-bg: #EAF1FB;
}
html[data-klv-profile="gov"][data-theme="dark"] {
  --klv-bg-page: #0E1621;
  --klv-bg-surface: #16202D;
  --klv-bg-subtle: #1C2733;
  --klv-border: #2B3948;
  --klv-border-soft: #354557;
  --klv-text-heading: #EAF0F7;
  --klv-text-body: #C7D0DB;
  --klv-text-body-alt: #BCC6D2;
  --klv-text-label: #C7D0DB;
  --klv-text-muted: #8FA0B3;
  --klv-accent-gold: #3E86D6;
  --klv-danger: #E17A6C;
  --klv-success: #4FB577;
  --klv-danger-bg: #3A211E;
  --klv-danger-border: #5C332C;
  --klv-warning-bg: #3A2F14;
  --klv-warning-border: #59481F;
  --klv-text-warning: #E0B84E;
  --klv-success-bg: #17301F;
  --klv-success-border: #2A5138;
  --klv-info-bg: #1C2F45;
}
html[data-klv-profile="gov"] * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}
/* Squared-off cards (vs. Light's rounded ones) and a light-blue section band, matching ROS's
   "Základní údaje" strip — same klv-notif-item hook as Light, reusing --klv-info-bg. */
html[data-klv-profile="gov"] .klv-notif-item {
  background: var(--klv-info-bg) !important;
  border-radius: 2px;
  margin: 0 8px 6px;
  border-bottom: none !important;
}
html[data-klv-profile="gov"] .klv-notif-item:last-child {
  margin-bottom: 0;
}
html[data-klv-profile="gov"] .klv-card {
  border-radius: 2px !important;
  box-shadow: none !important;
  border: 1px solid var(--klv-border) !important;
}

/* File-type pictogram (2026-09-16) - "tahle ikona je ok, aplikuj na vsechny ikony / piktogramy v
   celem systemu CRM a backendu". Replaces every 📎 glyph / generic outline file SVG shown next to an
   attachment. Profile-independent (not scoped to data-klv-profile) and lives here only because this
   is the one stylesheet every page already loads. Type comes purely from the filename suffix via
   data-name="{{ filename }}" + case-insensitive attribute selectors, so no page needs its own JS
   mapping - just <span class="klv-fbadge" data-name="{{ x.filename }}"></span>. */
.klv-fbadge {
  display: inline-flex; flex-shrink: 0; align-items: flex-end; justify-content: center; box-sizing: border-box;
  width: 26px; height: 32px; padding-bottom: 5px; vertical-align: middle;
  background: #8A96A8; color: #FFFFFF; font-family: 'Public Sans', sans-serif; font-size: 7.5px; font-weight: 800; line-height: 1; letter-spacing: 0.02em; text-decoration: none;
  clip-path: polygon(0 0, 70% 0, 100% 24%, 100% 100%, 0 100%);
}
/* inline-block so an underlined parent link's text-decoration doesn't propagate into the label */
.klv-fbadge::after { display: inline-block; text-decoration: none; }
.klv-fbadge--sm { width: 20px; height: 25px; padding-bottom: 4px; font-size: 6px; letter-spacing: 0; }
.klv-fbadge[data-name$=".pdf" i] { background: #D93025; }
.klv-fbadge[data-name$=".pdf" i]::after { content: "PDF"; }
.klv-fbadge[data-name$=".doc" i], .klv-fbadge[data-name$=".docx" i], .klv-fbadge[data-name$=".odt" i], .klv-fbadge[data-name$=".rtf" i] { background: #2B579A; }
.klv-fbadge[data-name$=".doc" i]::after { content: "DOC"; }
.klv-fbadge[data-name$=".docx" i]::after { content: "DOCX"; }
.klv-fbadge[data-name$=".odt" i]::after { content: "ODT"; }
.klv-fbadge[data-name$=".rtf" i]::after { content: "RTF"; }
.klv-fbadge[data-name$=".xls" i], .klv-fbadge[data-name$=".xlsx" i], .klv-fbadge[data-name$=".csv" i], .klv-fbadge[data-name$=".ods" i] { background: #217346; }
.klv-fbadge[data-name$=".xls" i]::after { content: "XLS"; }
.klv-fbadge[data-name$=".xlsx" i]::after { content: "XLSX"; }
.klv-fbadge[data-name$=".csv" i]::after { content: "CSV"; }
.klv-fbadge[data-name$=".ods" i]::after { content: "ODS"; }
.klv-fbadge[data-name$=".ppt" i], .klv-fbadge[data-name$=".pptx" i] { background: #C43E1C; }
.klv-fbadge[data-name$=".ppt" i]::after { content: "PPT"; }
.klv-fbadge[data-name$=".pptx" i]::after { content: "PPTX"; }
.klv-fbadge[data-name$=".jpg" i], .klv-fbadge[data-name$=".jpeg" i], .klv-fbadge[data-name$=".png" i], .klv-fbadge[data-name$=".gif" i], .klv-fbadge[data-name$=".webp" i], .klv-fbadge[data-name$=".heic" i] { background: #7B4FC9; }
.klv-fbadge[data-name$=".jpg" i]::after, .klv-fbadge[data-name$=".jpeg" i]::after { content: "JPG"; }
.klv-fbadge[data-name$=".png" i]::after { content: "PNG"; }
.klv-fbadge[data-name$=".gif" i]::after { content: "GIF"; }
.klv-fbadge[data-name$=".webp" i]::after { content: "WEBP"; }
.klv-fbadge[data-name$=".heic" i]::after { content: "HEIC"; }
.klv-fbadge[data-name$=".zip" i]::after { content: "ZIP"; }
.klv-fbadge[data-name$=".txt" i]::after { content: "TXT"; }
.klv-fbadge[data-name$=".xml" i]::after, .klv-fbadge[data-name$=".isdoc" i]::after { content: "XML"; }
.klv-fbadge[data-name$=".zfo" i]::after { content: "ZFO"; }
.klv-fbadge[data-name$=".eml" i]::after, .klv-fbadge[data-name$=".msg" i]::after { content: "MAIL"; }

/* Export / import buttons (2026-09-16) - "v celem portalu pro export a import pouzij ikony, navrhni a
   sjednot". Icon-only square-ish button: tray + arrow down (export) or up (import) followed by the
   same .klv-fbadge file-type pictogram used for attachments (XLSX / CSV / PDF / ZIP / PPTX). The
   label moves to title/aria-label. --dark is for the navy bulk-selection bars. */
.klv-io-btn { display: inline-flex; align-items: center; gap: 5px; height: 38px; padding: 0 9px; box-sizing: border-box; background: var(--klv-bg-surface); border: 1px solid var(--klv-border-soft); color: var(--klv-text-heading); cursor: pointer; vertical-align: middle; flex-shrink: 0; }
.klv-io-btn:hover { background: var(--klv-bg-subtle); }
.klv-io-btn:disabled { opacity: 0.55; cursor: default; }
.klv-io-btn > svg { width: 16px; height: 16px; flex-shrink: 0; }
.klv-io-btn--dark { background: transparent; border-color: #3A527A; color: #FFFFFF; height: 32px; }
.klv-io-btn--dark:hover { background: rgba(255, 255, 255, 0.08); }

/* Main-page "Export" (opens the preview where the format is picked) + primary upload variant (2026-09-16). */
.klv-io-btn__label { font-size: 13px; font-weight: 700; }
.klv-io-btn--primary { background: #12233D; border-color: #12233D; color: #FFFFFF; }
.klv-io-btn--primary:hover { background: #1c3355; }

/* Lehké zaoblení rohů (2026-10-19) - "veskere ostre rohy... naprosto vsude u oken, tlacitek atd.
   lehce zaoblit... opravdu jen lehce". Profile-independent (not scoped to data-klv-profile, same
   as .klv-fbadge/.klv-io-btn above) so it reaches the default "Gold" profile too, which has no
   shared base stylesheet of its own - every page's buttons/inputs/modals are styled inline there,
   with no border-radius set at all today. 4px matches this app's own already-established "subtle"
   radius cluster (crm.dc.html alone already has 23 inline 3px + 5 inline 4px + 9 inline 5px uses on
   specific badges/chips) - well short of the 8px+/50%/100px values used for intentional pills and
   avatars elsewhere, which are untouched: an inline border-radius on a given element always wins
   over this rule for that element, so nothing already (deliberately) rounded changes shape.
   Buttons and form fields are real element types, so this reaches every page uniformly with no
   per-file edits. Radio inputs stay circular - never meant to take a corner radius at all. */
button, input, select, textarea, .klv-io-btn {
  border-radius: 4px;
}
input[type="radio"] {
  border-radius: 50%;
}
/* "Okna" (modals/dialogs) aren't a distinct HTML element, but every modal content box across the
   app already follows one of a small set of consistent "width:Npx; max-width:NNvw;" inline
   patterns - matching that substring reaches all of them without a per-file edit. Verified: these
   five values alone cover 100+ modal instances app-wide, with no existing inline border-radius on
   any of them to conflict with. */
[style*="max-width:92vw"], [style*="max-width:96vw"], [style*="max-width:94vw"],
[style*="max-width:86vw"], [style*="max-width:72vw"] {
  border-radius: 4px;
}
