/*!
 * Hurda Yönetim Sistemi — ana stil dosyası
 * Bootstrap 5 üzerine modern kurum teması, açık/koyu mod desteği.
 */

/* =====================================================================
   1. Tema değişkenleri
   ===================================================================== */

:root {
    /* Kurumsal palet */
    --hys-navy:        #15304d;   /* marka / navbar / sidebar başlığı */
    --hys-primary:     #1f5aa8;   /* etkileşimli mavi — buton, bağlantı, aktif */
    --hys-primary-rgb: 31, 90, 168;
    --hys-primary-600: #1b4f95;
    --hys-primary-700: #17416f;
    --hys-accent:      #0e8a7d;   /* teal — yedek parça vurgusu (imza rengi) */
    --hys-accent-rgb:  14, 138, 125;

    --hys-sidebar-w: 264px;
    --hys-radius:    .75rem;
    --hys-radius-sm: .5rem;
    --hys-radius-lg: 1rem;

    /* Katmanlı yumuşak gölgeler */
    --hys-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
    --hys-shadow:    0 1px 3px rgba(16, 24, 40, .06), 0 4px 12px rgba(16, 24, 40, .05);
    --hys-shadow-lg: 0 8px 28px rgba(16, 24, 40, .12);

    /* Bootstrap çekirdek değişkenlerini yeniden tema ile eşle */
    --bs-primary:              var(--hys-primary);
    --bs-primary-rgb:          var(--hys-primary-rgb);
    --bs-link-color:           var(--hys-primary);
    --bs-link-color-rgb:       var(--hys-primary-rgb);
    --bs-link-hover-color:     var(--hys-primary-700);
    --bs-link-hover-color-rgb: 23, 65, 111;

    --bs-body-bg:        #f3f5f9;
    --bs-body-color:     #1f2733;
    --bs-secondary-bg:   #eef1f6;
    --bs-tertiary-bg:    #f3f5f9;
    --bs-border-color:   #e4e8ef;
    --bs-secondary-color: #5b6674;

    --bs-body-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
        Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    --bs-body-font-size: .9375rem;

    --bs-border-radius:    var(--hys-radius);
    --bs-border-radius-sm: var(--hys-radius-sm);
    --bs-border-radius-lg: var(--hys-radius-lg);
    --bs-border-radius-xl: 1.25rem;
}

[data-bs-theme="dark"] {
    --hys-navy:        #0e1f33;
    --hys-primary:     #4d90d8;
    --hys-primary-rgb: 77, 144, 216;
    --hys-primary-600: #3f7fc4;
    --hys-primary-700: #356fae;
    --hys-accent:      #2fb3a4;
    --hys-accent-rgb:  47, 179, 164;

    --bs-body-bg:        #0d1520;
    --bs-body-color:     #dce3ec;
    --bs-secondary-bg:   #16202e;
    --bs-tertiary-bg:    #111a26;
    --bs-border-color:   #243244;
    --bs-secondary-color: #9aa7b6;

    --bs-primary:          var(--hys-primary);
    --bs-primary-rgb:      var(--hys-primary-rgb);
    --bs-link-color:       var(--hys-primary);
    --bs-link-hover-color: #7fb3e6;

    --hys-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
    --hys-shadow:    0 2px 8px rgba(0, 0, 0, .35);
    --hys-shadow-lg: 0 10px 30px rgba(0, 0, 0, .5);
}

/* =====================================================================
   2. Temel tipografi
   ===================================================================== */

body {
    min-height: 100vh;
    font-size: var(--bs-body-font-size);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: -.003em;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 600;
    letter-spacing: -.014em;
    color: var(--hys-navy);
}

[data-bs-theme="dark"] h1,
[data-bs-theme="dark"] h2,
[data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4,
[data-bs-theme="dark"] h5,
[data-bs-theme="dark"] h6 {
    color: #eef3f9;
}

a {
    text-decoration: none;
    transition: color .15s ease;
}

.text-muted,
.text-secondary {
    color: var(--bs-secondary-color) !important;
}

/* =====================================================================
   3. Bileşen yeniden temalama (Bootstrap override)
   ===================================================================== */

/* Butonlar — modern his, yumuşak geçişler */
.btn {
    --bs-btn-font-weight: 500;
    --bs-btn-border-radius: var(--hys-radius-sm);
    letter-spacing: -.01em;
    transition: background-color .15s ease, border-color .15s ease,
        color .15s ease, box-shadow .15s ease, transform .05s ease;
}

.btn:active {
    transform: translateY(1px);
}

.btn-primary {
    --bs-btn-bg: var(--hys-primary);
    --bs-btn-border-color: var(--hys-primary);
    --bs-btn-hover-bg: var(--hys-primary-600);
    --bs-btn-hover-border-color: var(--hys-primary-600);
    --bs-btn-active-bg: var(--hys-primary-700);
    --bs-btn-active-border-color: var(--hys-primary-700);
    --bs-btn-disabled-bg: var(--hys-primary);
    --bs-btn-disabled-border-color: var(--hys-primary);
    box-shadow: 0 1px 2px rgba(var(--hys-primary-rgb), .25);
}

.btn-outline-primary {
    --bs-btn-color: var(--hys-primary);
    --bs-btn-border-color: rgba(var(--hys-primary-rgb), .45);
    --bs-btn-hover-bg: var(--hys-primary);
    --bs-btn-hover-border-color: var(--hys-primary);
    --bs-btn-active-bg: var(--hys-primary-600);
}

.btn-success {
    --bs-btn-bg: #1a936f;
    --bs-btn-border-color: #1a936f;
    --bs-btn-hover-bg: #157a5c;
    --bs-btn-hover-border-color: #157a5c;
    --bs-btn-active-bg: #126650;
}

.btn-link {
    --bs-btn-color: var(--hys-primary);
    --bs-btn-hover-color: var(--hys-primary-700);
}

/* Bağlantı & arka plan yardımcıları */
.text-primary { color: var(--hys-primary) !important; }

.bg-primary,
.text-bg-primary {
    background-color: var(--hys-primary) !important;
    color: #fff !important;
}

.badge.text-bg-primary { background-color: var(--hys-primary) !important; }
.badge.text-bg-dark { background-color: var(--hys-navy) !important; }

/* Form kontrolleri — odak halkası tema rengiyle */
.form-control,
.form-select {
    border-color: var(--bs-border-color);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.form-control:focus,
.form-select:focus,
.btn-check:focus + .btn,
.form-check-input:focus {
    border-color: rgba(var(--hys-primary-rgb), .55);
    box-shadow: 0 0 0 .2rem rgba(var(--hys-primary-rgb), .18);
}

.form-check-input:checked {
    background-color: var(--hys-primary);
    border-color: var(--hys-primary);
}

.form-label {
    font-weight: 500;
    margin-bottom: .35rem;
    color: var(--bs-body-color);
}

/* Tablolar — sakin, modern yönetim görünümü */
.table {
    --bs-table-hover-bg: rgba(var(--hys-primary-rgb), .045);
    margin-bottom: 0;
}

.table > thead th {
    font-size: .78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--bs-secondary-color);
    background-color: transparent;
    border-bottom: 1.5px solid var(--bs-border-color);
    padding-top: .8rem;
    padding-bottom: .8rem;
    white-space: nowrap;
}

.table > tbody > tr { transition: background-color .12s ease; }
.table > tbody > tr > td { padding-top: .7rem; padding-bottom: .7rem; }

/* Rozetler — biraz daha yumuşak köşe */
.badge { font-weight: 600; letter-spacing: -.01em; }

/* Açılır menü */
.dropdown-menu {
    --bs-dropdown-border-color: var(--bs-border-color);
    --bs-dropdown-border-radius: var(--hys-radius);
    box-shadow: var(--hys-shadow);
    padding: .375rem;
}

.dropdown-item {
    border-radius: var(--hys-radius-sm);
    padding: .5rem .75rem;
    font-weight: 500;
}

/* Uyarı kutuları */
.alert { border: 1px solid transparent; border-radius: var(--hys-radius); }

.alert-info {
    --bs-alert-bg: rgba(var(--hys-primary-rgb), .07);
    --bs-alert-border-color: rgba(var(--hys-primary-rgb), .2);
    --bs-alert-color: var(--hys-primary-700);
}

[data-bs-theme="dark"] .alert-info { --bs-alert-color: #9cc3ec; }

/* Modal */
.modal-content {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--hys-radius-lg);
    box-shadow: var(--hys-shadow-lg);
}

/* =====================================================================
   4. Navbar
   ===================================================================== */

.app-navbar {
    background-color: var(--hys-navy);
    color: #fff;
    z-index: 1030;
    min-height: 60px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .04), var(--hys-shadow-sm);
}

.app-navbar .navbar-brand,
.app-navbar .navbar-brand:hover {
    color: #fff;
    font-weight: 600;
    letter-spacing: -.02em;
}

.app-navbar .btn,
.app-navbar .nav-link { color: rgba(255, 255, 255, .88); }

.app-navbar .btn:hover,
.app-navbar .nav-link:hover { color: #fff; }

.app-navbar .dropdown-header { white-space: nowrap; }

/* =====================================================================
   5. Yerleşim
   ===================================================================== */

.app-shell {
    display: flex;
    align-items: stretch;
    min-height: calc(100vh - 60px);
}

.app-sidebar {
    flex: 0 0 var(--hys-sidebar-w);
    width: var(--hys-sidebar-w);
    border-right: 1px solid var(--bs-border-color);
    background-color: var(--bs-body-bg);
    position: sticky;
    top: 60px;
    height: calc(100vh - 60px);
    overflow-y: auto;
    padding: .875rem .75rem;
}

[data-bs-theme="dark"] .app-sidebar { background-color: #0f1926; }

.app-content {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background-color: var(--bs-tertiary-bg);
}

.app-content > .container-fluid {
    flex: 1 0 auto;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.app-footer {
    border-top: 1px solid var(--bs-border-color);
    color: var(--bs-secondary-color);
    font-size: .8125rem;
}

/* =====================================================================
   6. Kenar menü (pill tarzı aktif durum)
   ===================================================================== */

.app-nav { --bs-nav-link-padding-y: 0; }

.app-nav .nav-link {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .6rem .8rem;
    margin-bottom: .15rem;
    color: var(--bs-body-color);
    border-radius: var(--hys-radius-sm);
    font-weight: 500;
    position: relative;
    transition: background-color .14s ease, color .14s ease;
}

.app-nav .nav-link i {
    font-size: 1.08rem;
    width: 1.35rem;
    text-align: center;
    opacity: .7;
    transition: opacity .14s ease;
}

.app-nav .nav-link:hover {
    background-color: rgba(var(--hys-primary-rgb), .08);
    color: var(--hys-primary);
}

.app-nav .nav-link:hover i { opacity: 1; }

.app-nav .nav-link.active {
    background-color: var(--hys-primary);
    color: #fff;
    box-shadow: 0 1px 2px rgba(var(--hys-primary-rgb), .3);
}

.app-nav .nav-link.active i { opacity: 1; }

.app-nav .nav-heading {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--bs-secondary-color);
    padding: .9rem .8rem .35rem;
    margin: 0;
}

/* =====================================================================
   7. Kartlar
   ===================================================================== */

.card {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--hys-radius);
    background-color: #fff;
    box-shadow: var(--hys-shadow-sm);
}

[data-bs-theme="dark"] .card { background-color: #131e2c; }

.card.shadow-sm { box-shadow: var(--hys-shadow-sm) !important; }
.card.shadow { box-shadow: var(--hys-shadow) !important; }

.card-header {
    background-color: transparent;
    border-bottom: 1px solid var(--bs-border-color);
    padding: .9rem 1.1rem;
    font-weight: 600;
    letter-spacing: -.01em;
}

.card-header.bg-transparent { background-color: transparent !important; }
.card-body { padding: 1.1rem; }

/* Etkileşimli kartlar hafifçe yükselir */
.card.is-hoverable,
a.card {
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.card.is-hoverable:hover,
a.card:hover {
    transform: translateY(-2px);
    box-shadow: var(--hys-shadow);
    border-color: rgba(var(--hys-primary-rgb), .35);
}

/* İstatistik kartları */
.stat-card .stat-icon,
.stat-icon {
    width: 46px;
    height: 46px;
    border-radius: var(--hys-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex: 0 0 46px;
}

.stat-value {
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--hys-navy);
}

[data-bs-theme="dark"] .stat-value { color: #eef3f9; }

.stat-label {
    font-size: .75rem;
    color: var(--bs-secondary-color);
    line-height: 1.2;
    font-weight: 500;
}

/* Sayfa başlığı */
.page-header { margin-bottom: 1.25rem; }
.page-header h1,
.page-header .h1 { font-size: 1.5rem; margin-bottom: .15rem; }
.page-header .page-subtitle {
    color: var(--bs-secondary-color);
    font-size: .9rem;
    margin: 0;
}

/* =====================================================================
   8. Yardımcı sınıflar
   ===================================================================== */

.min-w-0 { min-width: 0; }
.cursor-pointer { cursor: pointer; }
.white-space-pre-line { white-space: pre-line; }

/* =====================================================================
   9. Yedek parça seçim çipleri (bu özelliğin imza öğesi)
   ===================================================================== */

.part-chip {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    margin: 0;
    padding: .6rem .8rem;
    border: 1.5px solid var(--bs-border-color);
    border-radius: var(--hys-radius-sm);
    background-color: var(--bs-body-bg);
    cursor: pointer;
    font-weight: 500;
    font-size: .875rem;
    user-select: none;
    transition: border-color .15s ease, background-color .15s ease,
        color .15s ease, box-shadow .15s ease;
}

.part-chip input { position: absolute; opacity: 0; pointer-events: none; }

.part-chip .part-chip-icon {
    font-size: 1.05rem;
    color: var(--bs-border-color);
    transition: color .15s ease, transform .15s ease;
    flex: 0 0 auto;
}

.part-chip:hover {
    border-color: rgba(var(--hys-accent-rgb), .5);
    background-color: rgba(var(--hys-accent-rgb), .05);
}

.part-chip.is-checked {
    border-color: var(--hys-accent);
    background-color: rgba(var(--hys-accent-rgb), .1);
    color: var(--hys-accent);
    box-shadow: 0 1px 2px rgba(var(--hys-accent-rgb), .2);
}

.part-chip.is-checked .part-chip-icon {
    color: var(--hys-accent);
    transform: scale(1.1);
}

/* Geri kazanılan parça rozeti */
.part-badge {
    background-color: rgba(var(--hys-accent-rgb), .12);
    color: var(--hys-accent);
    border: 1px solid rgba(var(--hys-accent-rgb), .25);
    font-weight: 600;
    padding: .35em .7em;
}

[data-bs-theme="dark"] .part-badge { color: #5fd0c2; }

/* =====================================================================
   10. Giriş sayfası
   ===================================================================== */

.login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(1200px 600px at 20% -10%, rgba(var(--hys-primary-rgb), .25), transparent 60%),
        linear-gradient(150deg, var(--hys-navy) 0%, #1d456e 55%, #226f8a 100%);
    padding: 1rem;
}

.login-wrap { width: 100%; max-width: 420px; }

.login-card {
    background-color: #fff;
    border-radius: var(--hys-radius-lg);
    overflow: hidden;
    box-shadow: var(--hys-shadow-lg);
}

[data-bs-theme="dark"] .login-card { background-color: #131e2c; }

.login-head {
    background-color: var(--hys-navy);
    color: #fff;
    padding: 2.25rem 1.5rem 1.5rem;
    text-align: center;
}

.login-head i { font-size: 2.5rem; display: block; margin-bottom: .5rem; opacity: .95; }
.login-head h1 { font-size: 1.25rem; font-weight: 600; margin: 0; color: #fff; }
.login-head p { margin: .3rem 0 0; opacity: .8; font-size: .875rem; }
.login-body { padding: 1.75rem 1.5rem; }

.login-foot {
    padding: .875rem 1.5rem;
    border-top: 1px solid var(--bs-border-color);
    text-align: center;
    background-color: var(--bs-tertiary-bg);
    font-size: .8125rem;
}

/* =====================================================================
   11. Hata sayfaları
   ===================================================================== */

.error-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--bs-tertiary-bg);
    padding: 1rem;
}

.error-wrap { text-align: center; max-width: 480px; }
.error-icon { font-size: 3.5rem; color: var(--hys-primary); }
.error-code {
    font-size: 4rem;
    font-weight: 800;
    line-height: 1;
    margin: .5rem 0;
    letter-spacing: -.03em;
    color: var(--hys-navy);
}

[data-bs-theme="dark"] .error-code { color: #eef3f9; }

/* =====================================================================
   12. Dropzone (fotoğraf yükleme)
   ===================================================================== */

.dropzone {
    border: 2px dashed var(--bs-border-color);
    border-radius: var(--hys-radius);
    padding: 1.9rem 1rem;
    text-align: center;
    transition: border-color .15s ease, background-color .15s ease;
    background-color: var(--bs-body-bg);
}

.dropzone > i {
    font-size: 2.35rem;
    color: var(--hys-primary);
    opacity: .7;
    display: block;
    margin-bottom: .5rem;
}

.dropzone.dragover {
    border-color: var(--hys-primary);
    background-color: rgba(var(--hys-primary-rgb), .06);
}

/* =====================================================================
   13. Fotoğraflar
   ===================================================================== */

.photo-preview {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    gap: .5rem;
}

.photo-preview .thumb {
    position: relative;
    aspect-ratio: 1;
    border-radius: var(--hys-radius-sm);
    overflow: hidden;
    border: 1px solid var(--bs-border-color);
}

.photo-preview .thumb img { width: 100%; height: 100%; object-fit: cover; }

.photo-preview .thumb button {
    position: absolute;
    top: 2px;
    right: 2px;
    padding: 0 .3rem;
    line-height: 1.3;
    font-size: .75rem;
}

.photo-tile {
    position: relative;
    border-radius: var(--hys-radius-sm);
    overflow: hidden;
    border: 1px solid var(--bs-border-color);
    aspect-ratio: 4 / 3;
}

.photo-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
.photo-tile:hover img { transform: scale(1.04); }

.photo-tile .photo-del {
    position: absolute;
    top: 4px;
    right: 4px;
    padding: .1rem .35rem;
    opacity: 0;
    transition: opacity .15s ease;
}

.photo-tile:hover .photo-del,
.photo-tile:focus-within .photo-del { opacity: 1; }

@media (hover: none) {
    .photo-tile .photo-del { opacity: 1; }
}

/* =====================================================================
   14. Zaman çizelgesi
   ===================================================================== */

.timeline {
    list-style: none;
    margin: 0;
    padding: 1rem 1rem 1rem 1.75rem;
    position: relative;
    max-height: 340px;
    overflow-y: auto;
}

.timeline::before {
    content: "";
    position: absolute;
    left: .75rem;
    top: 1rem;
    bottom: 1rem;
    width: 2px;
    background-color: var(--bs-border-color);
}

.timeline li { position: relative; padding-bottom: .875rem; }

.timeline li::before {
    content: "";
    position: absolute;
    left: -1.15rem;
    top: .35rem;
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background-color: var(--hys-primary);
    box-shadow: 0 0 0 3px var(--bs-body-bg);
}

/* =====================================================================
   15. Etiket önizleme
   ===================================================================== */

.label-preview {
    width: 50mm;
    height: 20mm;
    border: 1px solid var(--bs-border-color);
    background: #fff;
    overflow: hidden;
    box-shadow: var(--hys-shadow);
    border-radius: .25rem;
}

.label-preview iframe { width: 50mm; height: 20mm; border: 0; display: block; }

/* =====================================================================
   16. Loglar
   ===================================================================== */

.log-json {
    background-color: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--hys-radius-sm);
    padding: .7rem;
    font-size: .75rem;
    max-height: 260px;
    overflow: auto;
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
}

/* =====================================================================
   17. Yapışkan işlem çubuğu
   ===================================================================== */

.sticky-actions {
    position: sticky;
    bottom: 0;
    z-index: 1020;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    padding: .8rem;
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--hys-radius);
    box-shadow: var(--hys-shadow);
}

.asset-info dt { font-weight: 400; color: var(--bs-secondary-color); }
.asset-info dd { font-weight: 600; }

/* =====================================================================
   18. DataTables
   ===================================================================== */

div.dataTables_wrapper { padding: .85rem; }
div.dataTables_wrapper div.dataTables_filter input {
    margin-left: .5rem;
    border-radius: var(--hys-radius-sm);
    border: 1px solid var(--bs-border-color);
}
table.dataTable { border-collapse: collapse !important; }

div.dataTables_wrapper div.dataTables_paginate .paginate_button.current {
    background: var(--hys-primary) !important;
    border-color: var(--hys-primary) !important;
    color: #fff !important;
    border-radius: var(--hys-radius-sm);
}

/* =====================================================================
   19. Mobil & yazdırma
   ===================================================================== */

@media (max-width: 991.98px) {
    .app-shell { display: block; }
    .app-sidebar {
        position: static;
        width: 100%;
        height: auto;
        border-right: 0;
        border-bottom: 1px solid var(--bs-border-color);
    }
    .stat-value { font-size: 1.2rem; }
}

@media print {
    .app-navbar,
    .app-sidebar,
    .app-footer,
    .sticky-actions,
    .btn { display: none !important; }

    .app-content { background: #fff; }
    .card { box-shadow: none; border-color: #ccc; }
}

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}