/* KurbanPro P0 foundation: additive tokens and shared UI contracts. */
:root {
    color-scheme: light;

    --kp-color-primary: var(--kp-brand, #2f5d46);
    --kp-color-primary-dark: var(--kp-brand-2, #244837);
    --kp-color-sidebar: var(--kp-sidebar, #111712);
    --kp-color-accent: var(--kp-accent, #b9965b);
    --kp-color-bg: var(--kp-surface, #f5f3ed);
    --kp-color-surface: var(--kp-panel, #fffdf8);
    --kp-color-surface-muted: var(--kp-panel-soft, #f0eadc);
    --kp-color-border: var(--kp-border, #ded7c6);
    --kp-color-text: var(--kp-ink, #1c211b);
    --kp-color-text-strong: var(--kp-ink-2, #30372d);
    --kp-color-muted: var(--kp-muted, #756f62);
    --kp-color-muted-strong: var(--kp-muted-strong, #575041);
    --kp-color-success: var(--kp-success, #2f7d52);
    --kp-color-warning: var(--kp-warning, #b37a2c);
    --kp-color-danger: var(--kp-danger, #b24a3e);
    --kp-color-info: var(--kp-info, #3b7275);

    --kp-font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --kp-font-size-body: 14px;
    --kp-font-size-grid: 13px;
    --kp-font-size-label: 12px;
    --kp-font-size-title: clamp(1.5rem, 1.2rem + 0.6vw, 1.75rem);
    --kp-font-size-section: 1.125rem;
    --kp-font-size-metric: clamp(1.5rem, 1.2rem + 0.6vw, 1.75rem);

    --kp-space-1: 4px;
    --kp-space-2: 8px;
    --kp-space-3: 12px;
    --kp-space-4: 16px;
    --kp-space-5: 24px;
    --kp-space-6: 32px;
    --kp-page-padding: 24px;
    --kp-page-padding-mobile: 16px;
    --kp-section-gap: 24px;
    --kp-control-height: 38px;

    --kp-radius-xs: 4px;
    --kp-radius-sm: 6px;
    --kp-radius-md: 8px;
    --kp-radius-lg: 12px;
    --kp-radius-pill: 999px;

    --kp-shadow-xs: 0 1px 2px rgba(28, 33, 27, 0.05);
    --kp-shadow-sm: var(--kp-shadow-soft, 0 8px 22px rgba(28, 33, 27, 0.06));
    --kp-shadow-md: var(--kp-shadow, 0 14px 34px rgba(28, 33, 27, 0.08));
    --kp-focus-ring: 0 0 0 3px color-mix(in srgb, var(--kp-color-primary) 20%, transparent);

    --kp-card: var(--kp-color-surface);
    --kp-brand-dark: var(--kp-color-primary-dark);

    --bs-body-bg: var(--kp-color-bg);
    --bs-body-color: var(--kp-color-text);
    --bs-heading-color: var(--kp-color-text);
    --bs-card-bg: var(--kp-color-surface);
    --bs-border-color: var(--kp-color-border);
    --bs-primary: var(--kp-color-primary);
    --bs-secondary: var(--kp-color-muted-strong);
    --bs-success: var(--kp-color-success);
    --bs-info: var(--kp-color-info);
    --bs-warning: var(--kp-color-warning);
    --bs-danger: var(--kp-color-danger);
    --bs-link-color: var(--kp-color-primary);
    --bs-link-hover-color: var(--kp-color-primary-dark);
}

body.dark-theme {
    color-scheme: dark;

    --kp-color-primary: #7fa17a;
    --kp-color-primary-dark: #a5bd96;
    --kp-color-sidebar: #0b110c;
    --kp-color-accent: #d1ad68;
    --kp-color-bg: #10150f;
    --kp-color-surface: #151c14;
    --kp-color-surface-muted: #1d271b;
    --kp-color-border: #2f3a2b;
    --kp-color-text: #f5efe3;
    --kp-color-text-strong: #d6cbb6;
    --kp-color-muted: #a9a18f;
    --kp-color-muted-strong: #d2c6ad;
    --kp-color-success: #6aa16f;
    --kp-color-warning: #d1a052;
    --kp-color-danger: #d07866;
    --kp-color-info: #6c9da0;
}

body {
    background: var(--kp-color-bg) !important;
    color: var(--kp-color-text);
    font-family: var(--kp-font-family);
    font-size: var(--kp-font-size-body);
}

.kp-page {
    display: flex;
    flex-direction: column;
    gap: var(--kp-section-gap);
}

.kp-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--kp-space-4);
    margin-bottom: var(--kp-space-5);
}

.kp-page-header-main {
    min-width: 0;
}

.kp-page-title {
    margin: 0;
    color: var(--kp-color-text);
    font-size: var(--kp-font-size-title);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0;
}

.kp-page-description {
    max-width: 720px;
    margin: var(--kp-space-2) 0 0;
    color: var(--kp-color-muted);
    font-size: 0.95rem;
    line-height: 1.5;
}

.kp-page-header-meta,
.kp-page-header-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--kp-space-2);
}

.kp-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--kp-space-3);
    min-height: 48px;
    padding: var(--kp-space-3);
    border: 1px solid var(--kp-color-border);
    border-radius: var(--kp-radius-md);
    background: var(--kp-color-surface);
    box-shadow: var(--kp-shadow-xs);
}

.kp-toolbar-section {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--kp-space-2);
    min-width: 0;
}

.kp-toolbar-actions {
    flex: 0 0 auto;
    justify-content: flex-end;
}

.kp-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--kp-space-3);
}

.kp-metric {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--kp-space-3);
    min-width: 0;
    padding: var(--kp-space-4);
    border: 1px solid var(--kp-color-border);
    border-radius: var(--kp-radius-md);
    background: var(--kp-color-surface);
    box-shadow: var(--kp-shadow-sm);
}

.kp-metric-label {
    margin: 0 0 var(--kp-space-2);
    color: var(--kp-color-muted);
    font-size: var(--kp-font-size-label);
    font-weight: 700;
    line-height: 1.2;
}

.kp-metric-value {
    color: var(--kp-color-text);
    font-size: var(--kp-font-size-metric);
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    line-height: 1.05;
}

.kp-metric-subtext {
    margin-top: var(--kp-space-2);
    color: var(--kp-color-muted);
    font-size: 0.78rem;
    line-height: 1.35;
}

.kp-metric-icon {
    display: inline-grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: var(--kp-radius-md);
    background: color-mix(in srgb, var(--kp-color-primary) 12%, transparent);
    color: var(--kp-color-primary);
}

.kp-state {
    display: grid;
    min-height: 180px;
    place-items: center;
    padding: var(--kp-space-5);
    border: 1px dashed color-mix(in srgb, var(--kp-color-border) 84%, transparent);
    border-radius: var(--kp-radius-md);
    background: color-mix(in srgb, var(--kp-color-surface) 82%, transparent);
    color: var(--kp-color-muted);
    text-align: center;
}

.kp-state-title {
    margin: var(--kp-space-3) 0 var(--kp-space-1);
    color: var(--kp-color-text);
    font-size: var(--kp-font-size-section);
    font-weight: 700;
}

.kp-state-description {
    max-width: 460px;
    margin: 0;
    color: var(--kp-color-muted);
    line-height: 1.5;
}

.kp-state-icon {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: var(--kp-radius-md);
    font-size: 24px !important;
}

.kp-state-icon-danger {
    border: 1px solid color-mix(in srgb, var(--kp-color-danger) 28%, transparent);
    background: color-mix(in srgb, var(--kp-color-danger) 12%, transparent);
    color: var(--kp-color-danger);
}

.kp-spinner {
    width: 34px;
    height: 34px;
    border: 3px solid color-mix(in srgb, var(--kp-color-primary) 14%, transparent);
    border-top-color: var(--kp-color-primary);
    border-radius: 50%;
    animation: kp-spin 0.85s linear infinite;
}

@keyframes kp-spin {
    to { transform: rotate(360deg); }
}

.kp-status-success,
.kp-status-warning,
.kp-status-danger,
.kp-status-info {
    display: inline-flex;
    align-items: center;
    gap: var(--kp-space-1);
    min-height: 24px;
    padding: 4px 9px;
    border: 1px solid transparent;
    border-radius: var(--kp-radius-pill);
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.kp-status-success {
    border-color: color-mix(in srgb, var(--kp-color-success) 28%, transparent);
    background: color-mix(in srgb, var(--kp-color-success) 12%, transparent);
    color: var(--kp-color-success);
}

.kp-status-warning {
    border-color: color-mix(in srgb, var(--kp-color-warning) 30%, transparent);
    background: color-mix(in srgb, var(--kp-color-warning) 14%, transparent);
    color: var(--kp-color-warning);
}

.kp-status-danger {
    border-color: color-mix(in srgb, var(--kp-color-danger) 28%, transparent);
    background: color-mix(in srgb, var(--kp-color-danger) 12%, transparent);
    color: var(--kp-color-danger);
}

.kp-status-info {
    border-color: color-mix(in srgb, var(--kp-color-info) 28%, transparent);
    background: color-mix(in srgb, var(--kp-color-info) 12%, transparent);
    color: var(--kp-color-info);
}

.kp-money {
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    letter-spacing: 0;
    white-space: nowrap;
}

.kp-id-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    min-width: 38px;
    padding: 4px 9px;
    border: 1px solid color-mix(in srgb, var(--kp-color-primary) 20%, transparent);
    border-radius: var(--kp-radius-sm);
    background: color-mix(in srgb, var(--kp-color-primary) 10%, transparent);
    color: var(--kp-color-primary);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    line-height: 1;
}

.kp-button-primary,
.kp-button-secondary,
.kp-button-danger,
.kp-button-ghost,
.e-btn.kp-button-primary,
.e-btn.kp-button-secondary,
.e-btn.kp-button-danger,
.e-btn.kp-button-ghost {
    min-height: var(--kp-control-height);
    border-radius: var(--kp-radius-md) !important;
    font-weight: 700 !important;
    letter-spacing: 0;
}

.kp-button-primary,
.e-btn.kp-button-primary {
    border-color: var(--kp-color-primary) !important;
    background: var(--kp-color-primary) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--kp-color-primary) 22%, transparent) !important;
}

.kp-button-secondary,
.e-btn.kp-button-secondary {
    border-color: var(--kp-color-border) !important;
    background: var(--kp-color-surface) !important;
    color: var(--kp-color-text) !important;
}

.kp-button-danger,
.e-btn.kp-button-danger {
    border-color: var(--kp-color-danger) !important;
    background: var(--kp-color-danger) !important;
    color: #fff !important;
}

.kp-button-ghost,
.e-btn.kp-button-ghost {
    border-color: transparent !important;
    background: transparent !important;
    color: var(--kp-color-muted-strong) !important;
}

.kp-button-primary:hover,
.e-btn.kp-button-primary:hover {
    border-color: var(--kp-color-primary-dark) !important;
    background: var(--kp-color-primary-dark) !important;
}

/* Buton içindeki material ikonu metinle aynı optik ağırlıkta tutar. Tek kural
   olarak burada duruyor çünkü aksi hâlde her sayfa kendi ikon sınıfını yazıyor
   ve aynı buton sayfadan sayfaya farklı boyutta çıkıyordu: material-icons'ın
   24px varsayılanı 38px'lik kontrol yüksekliğini şişirir. */
.kp-button-primary .material-icons,
.kp-button-secondary .material-icons,
.kp-button-danger .material-icons,
.kp-button-ghost .material-icons {
    font-size: 18px;
    line-height: 1;
}

.kp-grid.e-grid,
.kp-grid .e-grid {
    border-color: var(--kp-color-border) !important;
    border-radius: var(--kp-radius-md);
    background: var(--kp-color-surface) !important;
    box-shadow: var(--kp-shadow-sm);
    overflow: hidden;
}

.kp-grid.e-grid .e-gridheader,
.kp-grid .e-grid .e-gridheader,
.kp-grid.e-grid .e-headercell,
.kp-grid .e-grid .e-headercell {
    background: color-mix(in srgb, var(--kp-color-surface-muted) 74%, var(--kp-color-surface)) !important;
    border-color: var(--kp-color-border) !important;
}

.kp-grid.e-grid .e-headertext,
.kp-grid .e-grid .e-headertext {
    color: var(--kp-color-muted-strong) !important;
    font-size: var(--kp-font-size-label);
    font-weight: 800 !important;
    letter-spacing: 0;
}

.kp-grid.e-grid .e-rowcell,
.kp-grid .e-grid .e-rowcell {
    color: var(--kp-color-text) !important;
    font-size: var(--kp-font-size-grid);
    border-color: color-mix(in srgb, var(--kp-color-border) 82%, transparent) !important;
}

.kp-grid.e-grid .e-row:hover .e-rowcell,
.kp-grid .e-grid .e-row:hover .e-rowcell {
    background: color-mix(in srgb, var(--kp-color-primary) 6%, transparent) !important;
}

.kp-grid.e-grid .e-row.e-selectionbackground .e-rowcell,
.kp-grid.e-grid .e-row.e-active .e-rowcell,
.kp-grid .e-grid .e-row.e-selectionbackground .e-rowcell,
.kp-grid .e-grid .e-row.e-active .e-rowcell {
    background: color-mix(in srgb, var(--kp-color-primary) 12%, transparent) !important;
}

.kp-grid.e-grid .e-pager,
.kp-grid .e-grid .e-pager {
    border-color: var(--kp-color-border) !important;
    background: var(--kp-color-surface) !important;
}

.kp-dialog .modal-content,
.kp-dialog.e-dialog,
.kp-dialog .e-dialog {
    border: 1px solid var(--kp-color-border) !important;
    border-radius: var(--kp-radius-lg) !important;
    background: var(--kp-color-surface) !important;
    color: var(--kp-color-text) !important;
    box-shadow: var(--kp-shadow-md) !important;
}

.kp-dialog .modal-header,
.kp-dialog .e-dlg-header-content {
    border-bottom-color: var(--kp-color-border) !important;
    background: color-mix(in srgb, var(--kp-color-surface-muted) 55%, var(--kp-color-surface)) !important;
}

.kp-dialog .modal-footer,
.kp-dialog .e-footer-content {
    border-top-color: var(--kp-color-border) !important;
    background: var(--kp-color-surface) !important;
}

.kp-form .form-label,
.kp-form label,
.kp-form .e-float-text {
    color: var(--kp-color-muted-strong) !important;
    font-size: var(--kp-font-size-label);
    font-weight: 700;
}

.kp-form .form-control,
.kp-form .form-select,
.kp-form .e-input-group,
.kp-form .e-control-wrapper {
    min-height: var(--kp-control-height);
    border-color: var(--kp-color-border) !important;
    border-radius: var(--kp-radius-md) !important;
    background: var(--kp-color-surface) !important;
    color: var(--kp-color-text) !important;
}

.kp-form .form-control:focus,
.kp-form .form-select:focus,
.kp-form .e-input-focus,
.kp-form .e-control-wrapper.e-input-focus {
    border-color: var(--kp-color-primary) !important;
    box-shadow: var(--kp-focus-ring) !important;
}

.kp-context-menu.e-contextmenu-wrapper ul,
.kp-context-menu .e-contextmenu-wrapper ul,
.e-contextmenu-wrapper.kp-context-menu ul {
    border-color: var(--kp-color-border) !important;
    border-radius: var(--kp-radius-md) !important;
    background: var(--kp-color-surface) !important;
    box-shadow: var(--kp-shadow-md) !important;
}

.kp-context-menu .e-menu-item,
.e-contextmenu-wrapper.kp-context-menu .e-menu-item {
    color: var(--kp-color-text) !important;
    font-size: var(--kp-font-size-grid);
}

.kp-context-menu .e-menu-item:hover,
.kp-context-menu .e-menu-item.e-focused,
.e-contextmenu-wrapper.kp-context-menu .e-menu-item:hover,
.e-contextmenu-wrapper.kp-context-menu .e-menu-item.e-focused {
    background: color-mix(in srgb, var(--kp-color-primary) 10%, transparent) !important;
    color: var(--kp-color-primary) !important;
}

@media (max-width: 1024px) {
    .kp-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    :root {
        --kp-page-padding: var(--kp-page-padding-mobile);
    }

    .kp-page-header,
    .kp-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .kp-page-header-meta,
    .kp-page-header-actions,
    .kp-toolbar-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 560px) {
    .kp-metric-grid {
        grid-template-columns: 1fr;
    }
}