/* ============================================================
   Eclipse brand overlay a Radzen POC-hoz
   Forrás: D:\Git\eclipse-website (Tailwind tokens)
   - Világos téma (sok adatcella, hosszú szerkesztés → sötét fárasztó)
   - corona-arany az accent (gomb hover, badge, kijelölt sor, kiemelt érték)
   - signal-kék a sortable / linked / focus states
   - Inter sans + Instrument Serif display + JetBrains Mono számokra
   ============================================================ */

:root {
    /* === Eclipse paletta === */
    --eclipse-bg:           #fafbfc;
    --eclipse-bg-elevated:  #ffffff;
    --eclipse-bg-surface:   #f5f7fa;
    --eclipse-ink:          #111827;
    --eclipse-ink-muted:    #4b5563;
    --eclipse-ink-subtle:   #6b7280;
    --eclipse-ink-faint:    #9ca3af;
    --eclipse-line:         #e5e7eb;
    --eclipse-line-bright:  #d1d5db;
    --eclipse-corona:       #d4a574;
    --eclipse-corona-bright:#e8c48e;
    --eclipse-corona-deep:  #a67c48;
    --eclipse-signal:       #3b82f6;
    --eclipse-signal-bright:#60a5fa;
    --eclipse-success:      #16a34a;
    --eclipse-warning:      #ea580c;
    --eclipse-danger:       #dc2626;

    /* === Radzen tokens override === */
    --rz-primary:                       var(--eclipse-corona);
    --rz-primary-dark:                  var(--eclipse-corona-deep);
    --rz-primary-light:                 var(--eclipse-corona-bright);
    --rz-on-primary:                    #ffffff;
    --rz-secondary:                     var(--eclipse-signal);
    --rz-secondary-dark:                #1d4ed8;
    --rz-secondary-light:               var(--eclipse-signal-bright);
    --rz-on-secondary:                  #ffffff;

    --rz-success:                       var(--eclipse-success);
    --rz-info:                          var(--eclipse-signal);
    --rz-warning:                       var(--eclipse-warning);
    --rz-danger:                        var(--eclipse-danger);

    --rz-base:                          var(--eclipse-bg);
    --rz-base-background-color:         var(--eclipse-bg);
    --rz-panel-background-color:        var(--eclipse-bg-elevated);
    --rz-input-background-color:        #ffffff;
    --rz-input-border:                  1px solid var(--eclipse-line);
    --rz-input-focus-shadow:            0 0 0 3px rgba(212, 165, 116, 0.18);
    --rz-input-disabled-background-color:#f3f4f6;
    --rz-input-disabled-color:          var(--eclipse-ink-faint);

    --rz-text-color:                    var(--eclipse-ink);
    --rz-text-secondary-color:          var(--eclipse-ink-muted);
    --rz-text-disabled-color:           var(--eclipse-ink-faint);
    --rz-text-tertiary-color:           var(--eclipse-ink-subtle);
    --rz-text-contrast-color:           #ffffff;
    --rz-text-anchor-color:             var(--eclipse-signal);
    --rz-text-anchor-hover-color:       var(--eclipse-corona-deep);

    --rz-text-font-family:              'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --rz-text-font-size:                13px;             /* sűrű form — kompakt méret minden komponensbe */
    --rz-text-h1-font-family:           'Instrument Serif', ui-serif, Georgia, serif;
    --rz-text-h2-font-family:           'Instrument Serif', ui-serif, Georgia, serif;
    --rz-text-h3-font-family:           'Inter', sans-serif;
    --rz-text-h4-font-family:           'Inter', sans-serif;
    --rz-text-mono-font-family:         'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;

    --rz-border:                        1px solid var(--eclipse-line);
    --rz-border-radius:                 8px;
    --rz-card-border-radius:            12px;
    --rz-button-radius:                 9999px;          /* pill — eclipse style */
    --rz-input-border-radius:           6px;
    --rz-link-color:                    var(--eclipse-signal);

    /* Header / app shell — diszkrét */
    --rz-header-background-color:       var(--eclipse-bg-elevated);
    --rz-header-color:                  var(--eclipse-ink);
    --rz-sidebar-background-color:      var(--eclipse-bg-surface);
    --rz-sidebar-color:                 var(--eclipse-ink);
    --rz-sidebar-item-hover-background-color: rgba(212, 165, 116, 0.10);
    --rz-sidebar-item-selected-background-color: rgba(212, 165, 116, 0.18);
    --rz-sidebar-item-selected-color:   var(--eclipse-corona-deep);

    /* DataGrid */
    --rz-datatable-background-color:    var(--eclipse-bg-elevated);
    --rz-datatable-border:              1px solid var(--eclipse-line);
    --rz-datatable-header-background-color: var(--eclipse-bg-surface);
    --rz-datatable-header-color:        var(--eclipse-ink);
    --rz-datatable-row-hover-background-color: rgba(212, 165, 116, 0.06);
    --rz-datatable-row-selected-background-color: rgba(212, 165, 116, 0.14);
    --rz-datatable-row-alternating-background-color: #fafbfc;
    --rz-datatable-cell-border:         1px solid var(--eclipse-line);

    /* Badge / Chip */
    --rz-badge-background-color:        var(--eclipse-corona);
    --rz-badge-color:                   #ffffff;

    /* Tabs */
    --rz-tabs-tab-background-color:     transparent;
    --rz-tabs-tab-color:                var(--eclipse-ink-muted);
    --rz-tabs-tab-selected-background-color: transparent;
    --rz-tabs-tab-selected-color:       var(--eclipse-corona-deep);
    --rz-tabs-tab-hover-color:          var(--eclipse-corona-deep);
    --rz-tabs-content-background-color: transparent;

    /* Tooltip */
    --rz-tooltip-background-color:      var(--eclipse-ink);
    --rz-tooltip-color:                 #ffffff;

    /* DropDown */
    --rz-dropdown-background-color:     #ffffff;
    --rz-dropdown-color:                var(--eclipse-ink);
    --rz-listbox-background-color:      #ffffff;
    --rz-listbox-item-hover-background-color: rgba(212, 165, 116, 0.10);
    --rz-listbox-item-selected-background-color: rgba(212, 165, 116, 0.18);
    --rz-listbox-item-selected-color:   var(--eclipse-corona-deep);
}

/* === Globális tipográfia === */
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
body {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
    background: var(--eclipse-bg);
    color: var(--eclipse-ink);
    font-feature-settings: "ss01", "cv11";
}

/* === Reszelt számok mindenhol (tabular-nums) === */
.rz-numeric input,
.rz-grid-cell.numeric,
.rz-data-grid td:where([class*="text-end"], [class*="text-right"]),
.lbl,
input[type="number"] {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

/* === Hairline elválasztó === */
.eclipse-hairline {
    background-image: linear-gradient(to right, transparent, var(--eclipse-line) 20%, var(--eclipse-line) 80%, transparent);
    height: 1px;
    border: none;
    margin: 16px 0;
}

/* === Eyebrow (kis felirat) === */
.eclipse-eyebrow {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--eclipse-corona-deep);
}

/* === A meglévő .ablak kártya enyhe finomítás === */
.ablak {
    background: var(--eclipse-bg-elevated) !important;
    border: 1px solid var(--eclipse-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(17, 24, 39, 0.05), 0 1px 3px rgba(17, 24, 39, 0.04) !important;
}

/* === Breadcrumb === */
.breadcrumb-bar a { color: var(--eclipse-signal); }
.breadcrumb-bar a:hover { color: var(--eclipse-corona-deep); }
.breadcrumb-bar .current { color: var(--eclipse-ink); font-weight: 600; }
.breadcrumb-bar .sep { color: var(--eclipse-ink-faint); }
.breadcrumb-bar .shortcut-hint { color: var(--eclipse-ink-faint); font-family: 'JetBrains Mono', monospace; font-size: 0.7rem; }

/* === Statusz-badge a fejlécben === */
.statusz {
    color: var(--eclipse-corona-deep) !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em;
}
.statusz-szoveg {
    color: var(--eclipse-ink-muted) !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.keszult-szoveg {
    color: var(--eclipse-ink-subtle) !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 0.78rem !important;
}

/* === Bal/jobb panel az eszköz-wrapperben === */
.bal-panel, .jobb-panel {
    background: var(--eclipse-bg-elevated) !important;
    border: 1px solid var(--eclipse-line) !important;
    border-radius: 8px !important;
}
.jobb-panel > div:first-child {
    background: var(--eclipse-ink) !important;
    color: #fff !important;
    border-radius: 7px 7px 0 0 !important;
    padding: 6px 10px !important;
    font-family: 'Inter', sans-serif !important;
    letter-spacing: 0.02em;
}

/* === Label finomítás === */
.lbl {
    color: var(--eclipse-ink-muted) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}

/* === Radzen kontrollok font-size konzisztens (a --rz-text-font-size token nem öröklődik mindenhova) === */
.rz-dropdown,
.rz-dropdown-label,
.rz-dropdown-item,
.rz-listbox-item,
.rz-numeric,
.rz-textbox,
.rz-textbox-content,
.rz-datepicker,
.rz-datepicker-trigger,
.rz-button,
.rz-button-text,
.rz-checkbox-label,
.rz-tabview-title,
.rz-inputtext {
    font-size: 13px !important;
}

/* Univerzális Radzen-input szöveg-méret (datepicker, numeric, textbox, dropdown is 16px-et hardkódol) */
.rz-datepicker input,
.rz-numeric input,
.rz-textbox input,
.rz-textbox,
.rz-dropdown .rz-dropdown-label,
.rz-calendar input {
    font-size: 13px !important;
    line-height: 1.4 !important;
}

/* === Material uppercase + letter-spacing OFF mindegyik gombra (Eclipse-style, olvashatóbb magyar) === */
.rz-button,
.rz-button .rz-button-text,
.rz-button.rz-button-sm,
.rz-button.rz-button-sm .rz-button-text {
    text-transform: none !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

/* === Sm-gombok és inputok egységesen 30px magasságon (Designer.cs sor-magasság) === */
.rz-button.rz-button-sm {
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 10px !important;
    line-height: 1.3 !important;
}
.rz-button.rz-button-sm .rz-button-icon-left {
    font-size: 16px !important;
}

.rz-dropdown,
.rz-numeric,
.rz-textbox,
.rz-datepicker {
    height: 30px !important;
    min-height: 30px !important;
    display: inline-flex !important;
    flex-direction: row !important;       /* default a Radzennél column, ezért nem tölt ki a label */
    align-items: center !important;
    justify-content: flex-start !important;
}

/* DropDown — label kitölti a teljes szélességet flex: 1-gyel, balra-igazított */
.rz-dropdown {
    padding: 0 !important;
    position: relative !important;
}
/* aria-only segéd — kivenni a layoutból, hogy ne foglalja a 215px helyet a flex-row-ban */
.rz-dropdown .rz-helper-hidden-accessible {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}
.rz-dropdown .rz-dropdown-label {
    flex: 1 1 auto !important;        /* kitölti a maradék helyet */
    padding: 0 0 0 10px !important;
    line-height: 30px !important;
    height: 30px !important;
    display: block !important;
    text-align: left !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Numeric / TextBox / DatePicker — input is balra-igazított */
.rz-numeric input,
.rz-textbox input,
.rz-datepicker input {
    text-align: left !important;
}
.rz-dropdown .rz-dropdown-trigger {
    height: 30px !important;
    width: 28px !important;
}

/* Numeric / TextBox / DatePicker — input pontosan 30px magas, line-height kitölti */
.rz-numeric input,
.rz-textbox input,
.rz-datepicker input {
    height: 30px !important;
    line-height: 30px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Numeric/Datepicker trigger gombok */
.rz-numeric-up,
.rz-numeric-down,
.rz-datepicker-trigger {
    height: 14px !important;
}

.rz-checkbox {
    width: 18px !important;
    height: 18px !important;
}

/* === Toolbar gombok === */
.toolbar { border-top: 1px solid var(--eclipse-line) !important; }