/*
    AbbTech B2B - v3 Tasarim Katmani
    --------------------------------
    B2B_v3_Tasarim prototipinin canli uygulamadaki karsiligi.
    Velzon'un --vz-* tokenlarini v3 paletine cevirir; kabugu (kenar cubugu,
    ust cubuk, sayfa basligi) ve ortak bilesenleri sadelestirir.

    Ilkeler:
      - Backend ve Razor mantigina dokunmaz; yalnizca gorunum.
      - Ag istegi yok: yazi tipi yerel Inter / Segoe UI Variable (b2b-modern ile ayni),
        ikonlar projedeki Remix / MDI setleri.
      - Degrade, cam efekti, dinlenen kartta golge, buyuk harfli etiket yok.
      - Hareket kisa ve amacli: basinca kuculme, 200ms ease-out acilis.

    Yuklenme sirasi (en sonda):
      app.min.css -> custom.min.css -> b2b-modern -> b2b-theme1 -> b2b-ui -> b2b-mobile -> b2b-v3

    Eski gorunume donmek icin _head_css.cshtml'deki b2b-v3 satirini kaldirmak yeterlidir.
*/

/* ============================================================
   1. TOKENLAR - ACIK TEMA
   ============================================================ */

:root,
:root[data-bs-theme="light"] {
    /* --- Marka: indigo + teal (Stitch "AbbTech B2B v3" tasarim sistemi) --- */
    --vz-primary: #3b4fe0;
    --vz-primary-rgb: 59, 79, 224;
    --vz-primary-text-emphasis: #1b32c8;
    --vz-primary-bg-subtle: #eef0ff;
    --vz-primary-border-subtle: #d4d8ff;

    --vz-secondary: #56657c;
    --vz-secondary-rgb: 86, 101, 124;
    --vz-secondary-text-emphasis: #334155;
    --vz-secondary-bg-subtle: #f1f5f9;
    --vz-secondary-border-subtle: #e2e8f0;

    --vz-success: #0f9f6e;
    --vz-success-rgb: 15, 159, 110;
    --vz-success-text-emphasis: #047857;
    --vz-success-bg-subtle: #ecfdf5;
    --vz-success-border-subtle: #a7f3d0;

    --vz-info: #0d9488;
    --vz-info-rgb: 13, 148, 136;
    --vz-info-text-emphasis: #0f766e;
    --vz-info-bg-subtle: #e6f6f4;
    --vz-info-border-subtle: #b2e5df;

    --vz-warning: #f59e0b;
    --vz-warning-rgb: 245, 158, 11;
    --vz-warning-text-emphasis: #b45309;
    --vz-warning-bg-subtle: #fef3c7;
    --vz-warning-border-subtle: #fde68a;

    --vz-danger: #e11d48;
    --vz-danger-rgb: 225, 29, 72;
    --vz-danger-text-emphasis: #be123c;
    --vz-danger-bg-subtle: #fff1f2;
    --vz-danger-border-subtle: #fecdd3;

    /* --- Notr yuzeyler (serin slate) --- */
    --vz-body-bg: #f6f7fb;
    --vz-body-bg-rgb: 246, 247, 251;
    --vz-body-color: #1e293b;
    --vz-body-color-rgb: 30, 41, 59;
    --vz-emphasis-color: #0f172a;
    --vz-heading-color: #0f172a;
    --vz-secondary-color: #56657c;
    --vz-secondary-color-rgb: 86, 101, 124;
    --vz-tertiary-bg: #f8fafc;
    --vz-border-color: #e5e9f2;
    --vz-link-color: #1b32c8;
    --vz-link-hover-color: #3b4fe0;

    --vz-header-bg: #ffffff;
    --vz-header-border: #e5e9f2;
    --vz-header-item-color: #334155;
    --vz-header-item-sub-color: #56657c;
    --vz-header-item-bg: #f1f5f9;
    --vz-topbar-search-bg: #ffffff;
    --vz-topbar-user-bg: transparent;
    --vz-page-title-border: transparent;
    --vz-footer-bg: transparent;
    --vz-footer-color: #94a3b8;
    --vz-card-bg: #ffffff;
    --vz-input-bg-custom: #ffffff;
    --vz-input-border-custom: #dce2ee;

    /* --- v3'e ozgu --- */
    --v3-surface-2: #f8fafc;
    --v3-border-strong: #dce2ee;
    --v3-faint: #94a3b8;
    --v3-track: #eef1f7;
    --v3-teal: #0d9488;
    --v3-chart-1: #3b4fe0;
    --v3-chart-2: #0f766e;
    --v3-chart-3: #7dd3fc;
    --v3-r-card: 12px;
    --v3-r-ctl: 8px;
    --v3-ease-out: cubic-bezier(.23, 1, .32, 1);
    --v3-ease-drawer: cubic-bezier(.32, .72, 0, 1);
    --v3-overlay: rgba(15, 23, 42, .45);
    --v3-shadow-pop: 0 10px 30px rgba(15, 23, 42, .10);
}

/* ============================================================
   2. TOKENLAR - KOYU TEMA
   ============================================================ */

:root[data-bs-theme="dark"] {
    --vz-primary: #5767ff;
    --vz-primary-rgb: 87, 103, 255;
    --vz-primary-text-emphasis: #aeb7ff;
    --vz-primary-bg-subtle: rgba(87, 103, 255, .16);
    --vz-primary-border-subtle: rgba(87, 103, 255, .38);

    --vz-success: #34d399;
    --vz-success-rgb: 52, 211, 153;
    --vz-success-text-emphasis: #6ee7b7;
    --vz-success-bg-subtle: rgba(16, 185, 129, .14);
    --vz-success-border-subtle: rgba(16, 185, 129, .35);

    --vz-info: #14b8a6;
    --vz-info-rgb: 20, 184, 166;
    --vz-info-text-emphasis: #5eead4;
    --vz-info-bg-subtle: rgba(20, 184, 166, .14);
    --vz-info-border-subtle: rgba(20, 184, 166, .35);

    --vz-warning-text-emphasis: #fcd34d;
    --vz-danger: #fb7185;
    --vz-danger-rgb: 251, 113, 133;
    --vz-danger-text-emphasis: #fda4af;

    --vz-body-bg: #0a0f1e;
    --vz-body-bg-rgb: 10, 15, 30;
    --vz-body-color: #c4ccde;
    --vz-heading-color: #e7ebf5;
    --vz-secondary-color: #93a0ba;
    --vz-tertiary-bg: #172036;
    --vz-border-color: #222d45;
    --vz-link-color: #aeb7ff;
    --vz-link-hover-color: #c7ceff;

    --vz-header-bg: #111829;
    --vz-header-border: #222d45;
    --vz-header-item-color: #c4ccde;
    --vz-header-item-bg: #172036;
    --vz-topbar-search-bg: #111829;
    --vz-card-bg: #111829;
    --vz-dropdown-bg: #172036;
    --vz-input-bg-custom: #111829;
    --vz-input-border-custom: #2d3a57;

    --v3-surface-2: #172036;
    --v3-border-strong: #2d3a57;
    --v3-faint: #66738f;
    --v3-track: #222d45;
    --v3-chart-1: #6373ff;
    --v3-chart-2: #14b8a6;
    --v3-chart-3: #67c9f5;
    --v3-overlay: rgba(2, 6, 23, .65);
    --v3-shadow-pop: 0 16px 40px rgba(0, 0, 0, .55);
}

/* Kenar cubugu: acik yuzey. Her firmanin logosu (Kullanici.Base64Photo) her renkte okunur.
   Velzon eski tercihleri cerezden (defaultAttribute / data-sidebar) geri yukledigi icin
   mevcut kullanicilarda data-sidebar="dark" kalabiliyor; v3 kabugu her degerde ayni gorunur.
   Koyu gorunum isteyen kullanici ust cubuktaki ay dugmesiyle koyu temaya gecer. */
:root[data-sidebar],
[data-sidebar] {
    --vz-vertical-menu-bg: #ffffff;
    --vz-vertical-menu-border: #e5e9f2;
    --vz-vertical-menu-item-color: #334155;
    --vz-vertical-menu-item-hover-color: #0f172a;
    --vz-vertical-menu-item-active-color: #1b32c8;
    --vz-vertical-menu-item-active-bg: #eef0ff;
    --vz-vertical-menu-sub-item-color: #56657c;
    --vz-vertical-menu-sub-item-hover-color: #0f172a;
    --vz-vertical-menu-sub-item-active-color: #1b32c8;
    --vz-vertical-menu-title-color: #94a3b8;
}
:root[data-bs-theme="dark"][data-sidebar] {
    --vz-vertical-menu-bg: #111829;
    --vz-vertical-menu-border: #222d45;
    --vz-vertical-menu-item-color: #c4ccde;
    --vz-vertical-menu-item-hover-color: #ffffff;
    --vz-vertical-menu-item-active-color: #aeb7ff;
    --vz-vertical-menu-item-active-bg: rgba(87, 103, 255, .16);
    --vz-vertical-menu-sub-item-color: #93a0ba;
    --vz-vertical-menu-title-color: #66738f;
}

/* ============================================================
   3. TEMEL TIPOGRAFI VE TARAYICI YUZEYLERI
   ============================================================ */

body {
    font-feature-settings: "tnum" 1, "cv11" 1;
    caret-color: var(--vz-primary);
    accent-color: var(--vz-primary);
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--vz-heading-color);
    letter-spacing: -.01em;
}

/* Buyuk harf + harf araligi etiketler v3'te yok: cumle duzeni */
.text-uppercase.fw-medium,
.text-uppercase.fs-13,
.card .text-uppercase,
.table thead th,
.menu-title {
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.num, .counter-value, .table td.text-end {
    font-variant-numeric: tabular-nums;
}

::selection { background: rgba(var(--vz-primary-rgb), .22); }

:focus-visible {
    outline: 2px solid var(--vz-primary);
    outline-offset: 2px;
}
.form-control:focus-visible, .form-select:focus-visible { outline: 0; }

/* ============================================================
   4. KENAR CUBUGU
   ============================================================ */

.app-menu.navbar-menu {
    background: var(--vz-vertical-menu-bg);
    border-right: 1px solid var(--vz-vertical-menu-border);
}

/* Logo: firmanin logosu, sabit yukseklikte ve tasmadan */
.navbar-brand-box {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
}
.navbar-brand-box .logo img {
    margin-top: 0 !important;
    max-height: 46px;
    object-fit: contain;
}
[data-bs-theme="dark"] .navbar-brand-box .logo-lg img,
[data-bs-theme="dark"] .navbar-brand-box .logo-sm img {
    background-color: #fff !important;
    border-radius: 8px;
    padding: 4px 6px;
}

.navbar-menu .navbar-nav .nav-link {
    margin: 1px .75rem;
    padding: .5rem .75rem;
    border-radius: var(--v3-r-ctl);
    font-size: .875rem;
    font-weight: 500;
    color: var(--vz-vertical-menu-item-color);
    transition: background-color .15s ease, color .15s ease;
}
.navbar-menu .navbar-nav .nav-link > i {
    color: var(--v3-faint);
    font-size: 1.15rem;
}
@media (hover: hover) and (pointer: fine) {
    .navbar-menu .navbar-nav .nav-link:hover {
        background-color: var(--v3-surface-2);
        color: var(--vz-vertical-menu-item-hover-color);
    }
    .navbar-menu .navbar-nav .nav-link:hover > i { transform: none; }
}
.navbar-menu .navbar-nav .nav-link.active,
.navbar-menu .navbar-nav .nav-link[aria-expanded="true"].menu-link {
    background-color: var(--vz-vertical-menu-item-active-bg);
    color: var(--vz-vertical-menu-item-active-color);
    font-weight: 600;
}
.navbar-menu .navbar-nav .nav-link.active > i { color: var(--vz-primary); }
/* sol aksan cizgisi yok: zemin ve renk yeterli */
.navbar-menu .navbar-nav .nav-link.active::before { display: none; }

.navbar-menu .navbar-nav .menu-title {
    padding: 1.1rem 1.5rem .35rem;
    font-size: .75rem;
    font-weight: 500;
    opacity: 1;
    color: var(--vz-vertical-menu-title-color);
}
.navbar-menu .navbar-nav .nav-sm .nav-link {
    font-size: .84rem;
    padding: .4rem .75rem;
    color: var(--vz-vertical-menu-sub-item-color);
}
.navbar-menu .navbar-nav .nav-sm .nav-link::before { display: none; }

.navbar-menu .badge {
    background: var(--vz-primary-bg-subtle) !important;
    color: var(--vz-primary-text-emphasis) !important;
    font-weight: 600;
    border-radius: 999px;
}

/* ============================================================
   5. UST CUBUK
   ============================================================ */

#page-topbar {
    box-shadow: none;
    border-bottom: 1px solid var(--vz-header-border);
    background: var(--vz-header-bg);
}
.header-item { border-radius: var(--v3-r-ctl); }
@media (hover: hover) and (pointer: fine) {
    .header-item:hover { background-color: var(--vz-header-item-bg); }
}
.app-search .form-control {
    border-radius: var(--v3-r-ctl);
    border: 1px solid var(--vz-border-color);
    background: var(--vz-topbar-search-bg);
    height: 40px;
}
.app-search .form-control:focus {
    border-color: var(--vz-primary);
    box-shadow: 0 0 0 3px rgba(var(--vz-primary-rgb), .18);
}
.topbar-user { background: transparent !important; }
.header-profile-user { box-shadow: none; }

/* Ust cubuktaki "Siparis Ver" kisayolu (yalnizca bayi) */
.v3-quick-order {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 38px;
    padding: 0 14px;
    margin: 0 6px;
    border-radius: var(--v3-r-ctl);
    background: var(--vz-primary);
    color: #fff !important;
    font-weight: 600;
    font-size: 13px;
    white-space: nowrap;
    transition: background-color .15s ease, transform .16s var(--v3-ease-out);
}
.v3-quick-order:hover { background: #3041c7; }
.v3-quick-order:active { transform: scale(.97); }
.v3-quick-order i { font-size: 18px; }
@media (max-width: 991.98px) { .v3-quick-order { display: none; } }

/* ============================================================
   6. SAYFA BASLIGI
   ============================================================ */

.page-title-box {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 4px 0 18px !important;
    margin: 0 !important;
}
.page-title-box h4 {
    font-size: 22px;
    line-height: 30px;
    font-weight: 650;
    letter-spacing: -.018em;
    text-transform: none;
}
.page-title-box .breadcrumb { font-size: 12px; }

/* ============================================================
   7. KARTLAR
   ============================================================ */

.card {
    border-radius: var(--v3-r-card);
    border: 1px solid var(--vz-border-color);
    box-shadow: none !important;
}
.card-animate:hover { transform: none !important; box-shadow: none !important; }
.card-header {
    border-bottom: 1px solid var(--vz-border-color);
    padding: 16px 20px;
    background: transparent;
}
.card-header .card-title,
.card-title {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -.005em;
}
.card-body { padding: 18px 20px; }

/* ============================================================
   8. BUTONLAR
   ============================================================ */

.btn {
    border-radius: var(--v3-r-ctl);
    font-weight: 600;
    box-shadow: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .16s var(--v3-ease-out);
}
.btn:active { transform: scale(.97); }
.btn-animation { overflow: visible; }
/* Velzon "btn-animation" metin kaydirma efekti: sik kullanilan dugmede gereksiz */
.btn-animation::after { display: none !important; }
.btn-animation > span { transform: none !important; opacity: 1 !important; }

.btn-primary { background: var(--vz-primary); border-color: var(--vz-primary); }
.btn-primary:hover, .btn-primary:focus { background: #3041c7; border-color: #3041c7; }
.btn-secondary, .btn-light {
    background: var(--vz-card-bg);
    border: 1px solid var(--v3-border-strong);
    color: var(--vz-heading-color);
}
.btn-secondary:hover, .btn-light:hover { background: var(--v3-surface-2); color: var(--vz-heading-color); border-color: var(--v3-border-strong); }
.btn-success { background: var(--vz-primary); border-color: var(--vz-primary); }
.btn-success:hover { background: #3041c7; border-color: #3041c7; }
.btn-info { background: var(--vz-card-bg); border: 1px solid var(--v3-border-strong); color: var(--vz-heading-color); }
.btn-info:hover { background: var(--v3-surface-2); color: var(--vz-heading-color); border-color: var(--v3-border-strong); }
.btn-danger { background: var(--vz-danger-text-emphasis); border-color: var(--vz-danger-text-emphasis); }

/* ============================================================
   9. FORMLAR
   ============================================================ */

.form-control, .form-select {
    border-radius: var(--v3-r-ctl);
    border-color: var(--vz-input-border-custom);
    min-height: 40px;
}
.form-control::placeholder { color: var(--vz-secondary-color); opacity: .9; }
.form-control:focus, .form-select:focus {
    border-color: var(--vz-primary);
    box-shadow: 0 0 0 3px rgba(var(--vz-primary-rgb), .18);
}
.form-label { font-weight: 500; font-size: 13px; }
/* Telefonda odaklaninca sayfa yakinlasmasin (iOS) */
@media (max-width: 991.98px) {
    .form-control, .form-select, input[type="text"], input[type="number"], input[type="search"], textarea { font-size: 16px !important; }
}

/* ============================================================
   10. TABLOLAR
   ============================================================ */

.table > thead th,
.table-light th,
.table thead.table-light th {
    font-size: 12px;
    font-weight: 500;
    color: var(--vz-secondary-color) !important;
    background: transparent !important;
    border-bottom: 1px solid var(--v3-border-strong) !important;
    white-space: nowrap;
}
.table > tbody > tr > td { border-color: var(--vz-border-color); vertical-align: middle; }
@media (hover: hover) and (pointer: fine) {
    .table-hover > tbody > tr:hover > * { background-color: var(--v3-surface-2); --vz-table-accent-bg: transparent; }
}
.table-striped > tbody > tr:nth-of-type(odd) > * { --vz-table-accent-bg: transparent; }

/* ============================================================
   11. ROZETLER (durum)
   ============================================================ */

.badge {
    font-weight: 600;
    border-radius: 6px;
    padding: .35em .6em;
}
.badge.bg-success-subtle, .badge.bg-soft-success { border: 1px solid var(--vz-success-border-subtle); }
.badge.bg-warning-subtle, .badge.bg-soft-warning { border: 1px solid var(--vz-warning-border-subtle); }
.badge.bg-danger-subtle, .badge.bg-soft-danger { border: 1px solid var(--vz-danger-border-subtle); }
.badge.bg-primary-subtle, .badge.bg-soft-primary { border: 1px solid var(--vz-primary-border-subtle); }
.badge.bg-info-subtle, .badge.bg-soft-info { border: 1px solid var(--vz-info-border-subtle); }

/* ============================================================
   12. MODAL, DROPDOWN, SEKME
   ============================================================ */

.modal-content {
    border-radius: 14px;
    border: 1px solid var(--v3-border-strong);
    box-shadow: var(--v3-shadow-pop);
}
.modal-header { border-bottom: 1px solid var(--vz-border-color); padding: 16px 20px; }
.modal-footer { border-top: 1px solid var(--vz-border-color); background: var(--v3-surface-2); border-radius: 0 0 14px 14px; }
.modal-title { font-size: 16px; font-weight: 600; }
/* acilis: 200ms ease-out, .96'dan buyur; Velzon zoomIn yerine */
.modal.fade .modal-dialog { transform: scale(.96); transition: transform .2s var(--v3-ease-out); }
.modal.show .modal-dialog { transform: none; }
.modal.zoomIn .modal-dialog { animation: none !important; }
@media (max-width: 767.98px) {
    /* telefonda alt sayfa gibi acilir */
    .modal-dialog { margin: auto 0 0; max-width: 100%; min-height: 100%; display: flex; align-items: flex-end; }
    .modal-dialog .modal-content { border-radius: 16px 16px 0 0; width: 100%; }
    .modal.fade .modal-dialog { transform: translateY(24px); transition: transform .32s var(--v3-ease-drawer); }
    .modal.show .modal-dialog { transform: none; }
    .modal-footer { border-radius: 0; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
}

.dropdown-menu {
    border-radius: 10px;
    border: 1px solid var(--v3-border-strong);
    box-shadow: var(--v3-shadow-pop);
    padding: 6px;
}
.dropdown-item { border-radius: 6px; padding: 8px 10px; }

.nav-tabs, .nav-tabs-custom { border-bottom: 1px solid var(--vz-border-color); }
.nav-tabs .nav-link { border: 0; border-bottom: 2px solid transparent; color: var(--vz-secondary-color); font-weight: 500; }
.nav-tabs .nav-link.active { color: var(--vz-primary-text-emphasis); border-bottom-color: var(--vz-primary); background: transparent; font-weight: 600; }

.pagination .page-link { border-radius: var(--v3-r-ctl) !important; margin: 0 2px; border-color: var(--vz-border-color); }
.pagination .page-item.active .page-link { background: var(--vz-primary); border-color: var(--vz-primary); }

/* ============================================================
   13. ALT BILGI VE KAYDIRMA
   ============================================================ */

.footer { border-top: 0; font-size: 12px; }
* { scrollbar-width: thin; scrollbar-color: var(--v3-border-strong) transparent; }

/* Icerik tam genislik: sagda bos alan kalmasin */
.b2b-page, #container-fluidMain { max-width: none !important; }

/* ============================================================
   14. v3 BILESENLERI (yeni isaretlemede kullanilir, v3- onekli)
   ============================================================ */

/* Bolum karti basligi */
.v3-card-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-card-h h2, .v3-card-h h3, .v3-card-h h4 { margin: 0; font-size: 15px; font-weight: 600; }
.v3-card-h .v3-hint { font-size: 12px; color: var(--vz-secondary-color); }
.v3-link { font-size: 13px; font-weight: 600; color: var(--vz-primary-text-emphasis); white-space: nowrap; }
.v3-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.v3-lbl { font-size: 13px; font-weight: 500; color: var(--vz-secondary-color); }

/* Segment dugmesi */
.v3-seg { display: inline-flex; border: 1px solid var(--vz-border-color); border-radius: 8px; padding: 3px; background: var(--vz-card-bg); gap: 2px; }
.v3-seg button, .v3-seg a { border: 0; background: transparent; font-size: 12px; font-weight: 500; padding: 5px 12px; border-radius: 6px; color: var(--vz-secondary-color); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: background-color .15s ease, color .15s ease; }
.v3-seg .on, .v3-seg .active { background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); font-weight: 600; }

/* Sayi seridi (tek kap, ince ayraclar) */
.v3-strip { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); }
.v3-strip > * { padding: 16px 20px; border-right: 1px solid var(--vz-border-color); min-width: 0; }
.v3-strip > *:last-child { border-right: 0; }
.v3-strip .v3-v { font-size: 21px; line-height: 30px; font-weight: 650; letter-spacing: -.02em; margin-top: 4px; font-variant-numeric: tabular-nums; color: var(--vz-heading-color); }
.v3-strip .v3-m { font-size: 12px; color: var(--vz-secondary-color); margin-top: 4px; }
a.v3-cell { color: inherit; display: block; transition: background-color .15s ease; }
@media (hover: hover) and (pointer: fine) { a.v3-cell:hover { background: var(--v3-surface-2); } }
@media (max-width: 1199.98px) {
    .v3-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .v3-strip > * { border-bottom: 1px solid var(--vz-border-color); }
    .v3-strip > *:nth-child(2n) { border-right: 0; }
}
@media (max-width: 575.98px) { .v3-strip > * { padding: 12px 14px; } .v3-strip .v3-v { font-size: 18px; line-height: 26px; } }

/* Yatay cubuk listesi */
.v3-hbars { padding: 10px 20px 16px; }
.v3-hb { display: grid; grid-template-columns: minmax(90px, 160px) 1fr 96px; align-items: center; gap: 12px; padding: 7px 0; font-size: 13px; }
.v3-hb .n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v3-hb .tr { height: 8px; border-radius: 99px; background: var(--v3-track); overflow: hidden; }
.v3-hb .tr span { display: block; height: 100%; border-radius: 99px; background: var(--v3-chart-1); }
.v3-hb.g .tr span { background: var(--v3-chart-2); }
.v3-hb .v { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }

/* Uyari satiri */
.v3-note { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--v3-r-ctl); font-size: 13px; line-height: 19px; border: 1px solid; }
.v3-note > i { font-size: 18px; line-height: 19px; flex: none; }
.v3-note.warn { background: var(--vz-warning-bg-subtle); border-color: var(--vz-warning-border-subtle); color: var(--vz-warning-text-emphasis); }
.v3-note.err { background: var(--vz-danger-bg-subtle); border-color: var(--vz-danger-border-subtle); color: var(--vz-danger-text-emphasis); }
.v3-note.info { background: var(--vz-primary-bg-subtle); border-color: var(--vz-primary-border-subtle); color: var(--vz-primary-text-emphasis); }

/* Bos durum */
.v3-empty { text-align: center; padding: 48px 24px; color: var(--vz-secondary-color); }
.v3-empty > i { font-size: 40px; color: var(--v3-faint); }
.v3-empty h5 { margin: 10px 0 4px; font-size: 16px; }
.v3-empty p { margin: 0 0 16px; font-size: 13px; }

/* Bildirim (urun sepete eklendi vb.) */
.v3-toast { position: fixed; top: 84px; left: 50%; z-index: 2000; display: flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 10px; background: var(--vz-success-text-emphasis); color: #fff; font-weight: 600; font-size: 14px; box-shadow: var(--v3-shadow-pop); transform: translate(-50%, -8px); opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .25s var(--v3-ease-out); }
.v3-toast.show { opacity: 1; transform: translate(-50%, 0); }
.v3-toast.err { background: var(--vz-danger-text-emphasis); }
@media (max-width: 991.98px) { .v3-toast { top: auto; bottom: calc(96px + env(safe-area-inset-bottom)); } }

/* ============================================================
   15. HAREKET AZALTMA
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
    .btn:active, .v3-quick-order:active { transform: none; }
    .modal.fade .modal-dialog { transition: none; }
}

/* Ust cubuktaki SalesTech altyapi logosu: firma logosunun onune gecmesin */
.navbar-header img[src*="SalesTechLogo"] { height: 30px !important; width: auto; opacity: .9; }
@media (max-width: 575.98px) { .navbar-header img[src*="SalesTechLogo"] { display: none; } }

/* ============================================================
   16. BAYI ANASAYFASI (Default/Dealer)
   ============================================================ */

.v3-acct .v3-big { font-size: 30px; line-height: 38px; font-weight: 700; letter-spacing: -.025em; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.v3-acct .v3-big .badge { font-size: 12px; letter-spacing: 0; transform: translateY(-4px); }
.v3-unit { font-size: 13px; font-weight: 500; color: var(--vz-secondary-color); }
.v3-acct-foot { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 12px 20px; border-top: 1px solid var(--vz-border-color); font-size: 13px; color: var(--vz-secondary-color); }
.v3-acct-foot span { display: inline-flex; align-items: center; gap: 6px; }
.v3-acct-foot i { font-size: 15px; color: var(--v3-faint); }
.v3-acct-name { color: var(--vz-heading-color); font-weight: 600; }
.v3-dot { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 6px; vertical-align: 1px; }
.v3-sum { border-bottom: 1px solid var(--vz-border-color); }
.v3-sum .v3-v { font-size: 18px; line-height: 26px; }
@media (min-width: 1200px) { .v3-acct .v3-strip { grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); } }

/* kampanya gorselleri: kart yuksekligine oturur, kirpma yok */
.v3-slider { min-height: 240px; background: var(--v3-surface-2); }
.v3-slider .carousel-item img { object-fit: cover; }
.v3-slider .carousel-indicators { margin-bottom: .75rem; }
.v3-slider .carousel-indicators [data-bs-target] { width: 8px; height: 8px; border-radius: 50%; border: 0; opacity: .45; transition: opacity .15s ease, width .2s var(--v3-ease-out); }
.v3-slider .carousel-indicators .active { width: 20px; border-radius: 99px; opacity: 1; }
@media (max-width: 1199.98px) { .v3-slider { min-height: 200px; aspect-ratio: 16 / 7; } }

/* ============================================================
   17. YONETICI ANASAYFASI (Default/admin)
   ============================================================ */

.v3-hello { font-size: 22px; line-height: 30px; font-weight: 650; letter-spacing: -.018em; }
.v3-today { margin-bottom: 24px; }
.v3-today .v3-lbl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 1200px) { .v3-today.v3-strip > *:nth-child(2n) { border-right: 1px solid var(--vz-border-color); } .v3-today.v3-strip > *:last-child { border-right: 0; } .v3-today.v3-strip > * { border-bottom: 0; } }
@media (max-width: 1199.98px) { .v3-today.v3-strip > *:last-child { grid-column: 1 / -1; border-bottom: 0; } }

/* Kart basligindaki Gun / Hafta / Ay / Yil dugmeleri segment gibi */
.card-header .btn-soft-secondary.btn-sm {
    background: transparent;
    border: 1px solid var(--vz-border-color);
    color: var(--vz-secondary-color);
    font-weight: 500;
    padding: 4px 10px;
}
.card-header .btn-soft-secondary.btn-sm:hover,
.card-header .btn-soft-secondary.btn-sm:focus {
    background: var(--vz-primary-bg-subtle);
    border-color: var(--vz-primary-border-subtle);
    color: var(--vz-primary-text-emphasis);
}

/* ============================================================
   18. GIRIS / KAYIT / SIFRE SAYFALARI
   ============================================================ */

/* Velzon'un yesil-mor degradesi yerine duz zemin; firma gorseli (LoginPhoto) one cikar */
.auth-page-wrapper.auth-bg-cover { background: var(--vz-body-bg) !important; }
.auth-page-wrapper .bg-overlay { opacity: 1; }
.auth-page-wrapper .card { border-radius: 14px; overflow: hidden; }
.auth-page-wrapper .footer { color: var(--vz-secondary-color); }
.auth-page-wrapper .shape, .auth-page-wrapper .auth-particles { display: none !important; }

/* ============================================================
   19. SAYFA GIRIS HAREKETI (b2b-anim) - kisaltildi
   ------------------------------------------------------------
   Her sayfa acilisinda tekrar eden yukari kayma + kademeli KPI
   gecikmeleri gunde yuzlerce kez gorulur; kullaniciyi bekletir.
   v3'te yalnizca 200ms hafif gorunme kalir, gecikme yok.
   ============================================================ */
.b2b-anim .b2b-page > .row > [class*="col-"] > .card,
.b2b-anim .b2b-reveal,
.b2b-anim .b2b-kpi,
.b2b-anim .auth-page-wrapper .card {
    animation: b2bFadeIn .2s ease-out backwards !important;
    animation-delay: 0s !important;
}

/* ============================================================
   20. OZET KARTLARI (b2b-kpi) - v3 seridi gibi sade
   ------------------------------------------------------------
   Renkli ikon karosu, sol renk seridi, buyuk harf etiket ve
   uzerine gelince yukselme kaldirildi.
   ============================================================ */
.b2b-kpi-row { gap: 0; border: 1px solid var(--vz-border-color); border-radius: var(--v3-r-card); background: var(--vz-card-bg); overflow: hidden; }
.b2b-kpi { border: 0; border-radius: 0; box-shadow: none; border-right: 1px solid var(--vz-border-color); border-bottom: 1px solid var(--vz-border-color); margin: 0 -1px -1px 0; padding: 14px 18px; }
.b2b-kpi:hover { transform: none; box-shadow: none; }
.b2b-kpi::before { display: none; }
.b2b-kpi__icon { width: auto; height: auto; background: transparent !important; font-size: 18px; border-radius: 0; }
.b2b-kpi__icon > i { color: var(--v3-faint) !important; }
.b2b-kpi__label { font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 500; }
.b2b-kpi__value { font-size: 20px; font-weight: 650; letter-spacing: -.015em; }
.b2b-kpi__sub { font-size: 12px; }

/* ============================================================
   21. v3 KABUK (sifirdan): kenar menu, ust cubuk, sayfa basligi,
       mobil alt sekme cubugu. _Layout / _sidebar / _topbar /
       _page_title bu siniflari kullanir; Velzon kabugu kullanilmaz.
   ============================================================ */

.v3-body { background: var(--vz-body-bg); color: var(--vz-body-color); margin: 0; }
.v3-app { display: grid; grid-template-columns: 260px minmax(0, 1fr); min-height: 100vh; }
.v3-main { min-width: 0; display: flex; flex-direction: column; }

/* --- kenar menu --- */
.v3-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--vz-card-bg); border-right: 1px solid var(--vz-border-color); z-index: 1030; }
.v3-brand { display: flex; align-items: center; justify-content: center; height: 68px; padding: 0 16px; border-bottom: 1px solid var(--vz-border-color); flex: none; }
.v3-brand img { max-height: 46px; max-width: 100%; object-fit: contain; }
[data-bs-theme="dark"] .v3-brand img { background: #fff; border-radius: 8px; padding: 4px 6px; }
.v3-nav { flex: 1; overflow-y: auto; padding: 12px; scrollbar-width: thin; }
.v3-nav a, .v3-nav summary { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: var(--v3-r-ctl); color: var(--vz-body-color); font-size: 13.5px; font-weight: 500; margin-bottom: 2px; text-decoration: none; cursor: pointer; transition: background-color .15s ease, color .15s ease; }
.v3-nav a > i, .v3-nav summary > i { font-size: 18px; color: var(--v3-faint); flex: none; }
@media (hover: hover) and (pointer: fine) { .v3-nav a:not(.active):hover, .v3-nav summary:hover { background: var(--v3-surface-2); color: var(--vz-heading-color); } }
.v3-nav a.active { background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); font-weight: 600; }
.v3-nav a.active > i { color: var(--vz-primary); }
.v3-nav .v3-sec { font-size: 12px; font-weight: 500; color: var(--v3-faint); padding: 16px 10px 6px; }
.v3-nav .v3-count { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center; font-size: 11px; font-weight: 600; background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); }
.v3-nav details > summary { list-style: none; }
.v3-nav details > summary::-webkit-details-marker { display: none; }
.v3-nav details > summary .v3-chev { margin-left: auto; color: var(--v3-faint); font-size: 16px; transition: transform .2s var(--v3-ease-out); }
.v3-nav details[open] > summary .v3-chev { transform: rotate(180deg); }
.v3-nav details .v3-sub { padding: 2px 0 6px 30px; }
.v3-nav details .v3-sub a { font-size: 13px; font-weight: 500; padding: 6px 10px; color: var(--vz-secondary-color); }
.v3-nav details .v3-sub a.active { color: var(--vz-primary-text-emphasis); background: transparent; font-weight: 600; }
.v3-nav details .v3-sub-h { font-size: 11.5px; color: var(--v3-faint); padding: 8px 10px 2px; }
.v3-scrim { display: none; }

/* --- ust cubuk --- */
.v3-topbar { position: sticky; top: 0; z-index: 1020; height: 68px; display: flex; align-items: center; gap: 10px; padding: 0 24px; background: var(--vz-header-bg); border-bottom: 1px solid var(--vz-border-color); }
.v3-search { position: relative; flex: 0 1 420px; }
.v3-search > i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--vz-secondary-color); font-size: 18px; pointer-events: none; }
.v3-search input { width: 100%; height: 40px; border: 1px solid var(--vz-border-color); border-radius: var(--v3-r-ctl); padding: 0 12px 0 38px; background: var(--vz-card-bg); color: var(--vz-body-color); font: inherit; outline: 0; transition: border-color .15s ease, box-shadow .15s ease; }
.v3-search input:focus { border-color: var(--vz-primary); box-shadow: 0 0 0 3px rgba(var(--vz-primary-rgb), .18); }
.v3-search-results { position: absolute; left: 0; right: 0; top: calc(100% + 6px); background: var(--vz-card-bg); border: 1px solid var(--v3-border-strong); border-radius: 10px; box-shadow: var(--v3-shadow-pop); padding: 6px; display: none; max-height: 320px; overflow: auto; z-index: 1040; }
.v3-search-results.open { display: block; }
.v3-search-results a { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 6px; color: var(--vz-body-color); font-size: 13px; }
.v3-search-results a i { color: var(--v3-faint); font-size: 16px; }
.v3-search-results a.on, .v3-search-results a:hover { background: var(--v3-surface-2); }
.v3-search-results .none { padding: 8px 10px; font-size: 12px; color: var(--vz-secondary-color); }
.v3-spacer { flex: 1; }
.v3-icon-btn { position: relative; width: 40px; height: 40px; border-radius: var(--v3-r-ctl); display: grid; place-items: center; border: 0; background: transparent; color: var(--vz-body-color); font-size: 20px; cursor: pointer; flex: none; transition: background-color .15s ease, transform .16s var(--v3-ease-out); }
@media (hover: hover) and (pointer: fine) { .v3-icon-btn:hover { background: var(--v3-surface-2); } }
.v3-icon-btn:active { transform: scale(.96); }
.v3-user { display: flex; align-items: center; gap: 10px; padding: 4px 6px 4px 12px; margin-left: 4px; border: 0; border-left: 1px solid var(--vz-border-color); background: transparent; color: var(--vz-body-color); cursor: pointer; }
.v3-user img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; background: var(--vz-primary-bg-subtle); }
.v3-user b { display: block; font-size: 13px; line-height: 16px; font-weight: 600; max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; }
.v3-user small { display: block; font-size: 11px; color: var(--vz-secondary-color); text-align: left; }
.v3-only-m { display: none !important; }

/* --- icerik ve sayfa basligi --- */
.v3-content { width: 100%; padding: 24px 28px 40px !important; }
.v3-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.v3-head .v3-crumb { font-size: 12px; color: var(--vz-secondary-color); margin-bottom: 4px; }
.v3-head .v3-crumb a { color: inherit; }
.v3-head .v3-crumb a:hover { color: var(--vz-primary); }
.v3-head h1 { margin: 0; font-size: 22px; line-height: 30px; font-weight: 650; letter-spacing: -.018em; color: var(--vz-heading-color); display: flex; align-items: center; gap: 4px; }
.v3-head .v3-star { width: 32px; height: 32px; font-size: 18px; color: var(--v3-faint); }
.v3-head .v3-star .ri-star-fill { color: var(--vz-warning); }
.v3-head-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* --- mobil alt sekme cubugu (bayi) --- */
.v3-tabbar { display: none; }

@media (max-width: 991.98px) {
    .v3-app { grid-template-columns: 1fr; }
    .v3-sidebar { position: fixed; left: 0; top: 0; bottom: 0; width: 284px; max-width: 86vw; transform: translateX(-100%); transition: transform .2s var(--v3-ease-out); }
    .v3-app.nav-open .v3-sidebar { transform: none; transition: transform .4s var(--v3-ease-drawer); box-shadow: var(--v3-shadow-pop); }
    .v3-scrim { display: block; position: fixed; inset: 0; background: var(--v3-overlay); z-index: 1025; opacity: 0; pointer-events: none; transition: opacity .2s ease; }
    .v3-app.nav-open .v3-scrim { opacity: 1; pointer-events: auto; }
    .v3-topbar { height: 60px; padding: 0 10px; gap: 4px; }
    .v3-search { display: none; }
    .v3-search.open { display: block; position: absolute; left: 8px; right: 8px; top: 10px; flex: none; }
    .v3-only-m { display: grid !important; }
    .v3-hide-m { display: none !important; }
    .v3-user { border: 0; padding-left: 4px; }
    .v3-user > div { display: none; }
    .v3-content { padding: 16px 14px 96px !important; }
    .v3-head { margin-bottom: 14px; }
    .v3-head h1 { font-size: 20px; line-height: 28px; }
    .v3-head-actions { width: 100%; }
    .v3-head-actions > .btn { flex: 1; justify-content: center; }
    .v3-has-tabbar .v3-tabbar { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 1015; background: var(--vz-card-bg); border-top: 1px solid var(--vz-border-color); padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); }
    .v3-tabbar a { display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 10.5px; font-weight: 500; color: var(--vz-secondary-color); padding: 4px 0; }
    .v3-tabbar a > i { font-size: 22px; }
    .v3-tabbar a.active { color: var(--vz-primary-text-emphasis); }
    .v3-tabbar a.active > i { color: var(--vz-primary); }
    .v3-tabbar .v3-tab-fab { margin-top: -22px; } /* "fab" Font Awesome marka sinifiyla cakisiyordu */
    .v3-tabbar .v3-tab-fab > i { width: 48px; height: 48px; border-radius: 16px; background: var(--vz-primary); color: #fff !important; display: grid; place-items: center; box-shadow: 0 4px 12px rgba(15, 23, 42, .18); }
}

/* Velzon app.js uyumluluk kopyasi: gorunmez */
.v3-compat { display: none !important; }

/* ============================================================
   22. YAN PANEL (siparis detayi) ve GOMULU SAYFA
   ============================================================ */
.v3-drawer.offcanvas-end { width: min(640px, 100vw); border-left: 1px solid var(--v3-border-strong); box-shadow: var(--v3-shadow-pop); transition: transform .3s var(--v3-ease-drawer); }
.v3-drawer .offcanvas-header { padding: 14px 16px 14px 20px; border-bottom: 1px solid var(--vz-border-color); gap: 12px; }
.v3-drawer .offcanvas-title { font-size: 17px; font-weight: 650; margin: 0; font-variant-numeric: tabular-nums; }
.v3-drawer .offcanvas-body { position: relative; display: flex; }
.v3-drawer iframe { flex: 1; width: 100%; border: 0; background: var(--vz-body-bg); }
.v3-drawer-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--vz-secondary-color); font-size: 13px; background: var(--vz-body-bg); }
.v3-drawer-loading i { font-size: 20px; animation: v3spin .8s linear infinite; }
@keyframes v3spin { to { transform: rotate(360deg); } }
@media (max-width: 767.98px) { .v3-drawer.offcanvas-end { width: 100vw; border-left: 0; } }

/* listede acik siparis satiri */
#ordersTable tbody tr[data-v3-order] { cursor: pointer; }
#ordersTable tbody tr.v3-row-on > * { background: var(--vz-primary-bg-subtle) !important; }
#ordersTable .b2b-action { background: transparent; border: 0; padding: 4px 6px; border-radius: 6px; }
@media (hover: hover) and (pointer: fine) { #ordersTable .b2b-action:hover { background: var(--v3-surface-2); } }

/* panel icindeki sayfa: daha dar dolgu, tek sutun */
.v3-embed .v3-content { padding: 16px !important; }
.v3-embed [class*="col-xl-"], .v3-embed [class*="col-lg-"] { flex: 0 0 100%; max-width: 100%; }

/* ============================================================
   23. SEPETIM (Basket/Index)
   ============================================================ */
.v3-basket { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; }
.v3-basket .card { margin: 0; }
.v3-bline { display: grid; grid-template-columns: 56px minmax(0, 1fr) 250px 150px; gap: 16px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-bline:last-child { border-bottom: 0; }
.v3-bthumb { width: 56px; height: 56px; border-radius: 8px; background: var(--v3-surface-2); display: grid; place-items: center; overflow: hidden; }
.v3-bthumb img { width: 100%; height: 100%; object-fit: contain; }
.v3-bname { font-size: 14px; font-weight: 600; line-height: 19px; color: var(--vz-heading-color); }
.v3-bmeta { font-size: 12px; color: var(--vz-secondary-color); margin-top: 3px; display: flex; flex-wrap: wrap; gap: 4px 10px; }
.v3-bqty { display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; justify-content: flex-end; }
.v3-qstep.input-step { display: inline-flex; align-items: center; width: auto; height: auto; padding: 0; border: 1px solid var(--v3-border-strong); border-radius: var(--v3-r-ctl); overflow: hidden; background: var(--vz-card-bg); }
.v3-qstep.input-step button { width: 34px; height: 38px; border: 0; background: var(--v3-surface-2); color: var(--vz-body-color); font-size: 16px; display: grid; place-items: center; box-shadow: none; }
.v3-qstep.input-step input { width: 56px; height: 38px; border: 0; background: transparent; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--vz-heading-color); }
.v3-qstep.input-step:focus-within { border-color: var(--vz-primary); box-shadow: 0 0 0 3px rgba(var(--vz-primary-rgb), .18); }
.v3-bdel { border: 0; background: transparent; color: var(--vz-secondary-color); font-size: 13px; display: inline-flex; align-items: center; gap: 4px; padding: 6px 8px; border-radius: 6px; }
.v3-bdel:hover { color: var(--vz-danger-text-emphasis); background: var(--vz-danger-bg-subtle); }
.v3-bedit.input-step { display: inline-flex; align-items: center; gap: 6px; width: auto; height: auto; padding: 0; background: transparent; border: 0; font-size: 12px; color: var(--vz-secondary-color); }
.v3-bedit.input-step input { width: 7em; height: 34px; border: 1px solid var(--v3-border-strong); border-radius: 6px; padding: 0 8px; text-align: right; background: var(--vz-card-bg); color: var(--vz-heading-color); font-variant-numeric: tabular-nums; }
.v3-bprice { text-align: right; }
.v3-bprice .v3-lbl { font-size: 11.5px; }
.v3-bval { font-size: 13.5px; font-weight: 500; font-variant-numeric: tabular-nums; }
.v3-btotal { font-size: 15px; font-weight: 650; color: var(--vz-heading-color); }
.v3-basket-sum { position: sticky; top: 92px; }
.v3-tot { display: flex; justify-content: space-between; font-size: 14px; padding: 5px 0; color: var(--vz-secondary-color); }
.v3-tot > span:last-child { color: var(--vz-body-color); }
.v3-tot-big { font-size: 18px; font-weight: 650; padding-top: 12px; margin-top: 6px; border-top: 1px solid var(--vz-border-color); color: var(--vz-heading-color); }
.v3-tot-big > span:last-child { color: var(--vz-heading-color); }
.v3-basket-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.v3-basket-acts .btn { justify-content: center; display: inline-flex; align-items: center; white-space: nowrap; padding-left: 8px; padding-right: 8px; font-size: 13px; }
.v3-basket-clear { display: inline-flex; align-items: center; margin-top: 14px; font-size: 13px; font-weight: 500; color: var(--vz-danger-text-emphasis); }
.v3-basket-clear:hover { text-decoration: underline; text-underline-offset: 3px; }
.v3-mconfirm { display: none; }
@media (max-width: 1399.98px) { .v3-bline { grid-template-columns: 56px minmax(0, 1fr) 150px; } .v3-bqty { grid-column: 2; grid-row: 2; justify-content: flex-start; max-width: none; } .v3-bprice { grid-column: 3; grid-row: 1 / 3; } }
@media (max-width: 1199.98px) { .v3-basket { grid-template-columns: 1fr; } .v3-basket-sum { position: static; } }
@media (max-width: 767.98px) {
    .v3-bline { grid-template-columns: 56px minmax(0, 1fr); gap: 10px 12px; padding: 12px 14px; }
    .v3-bqty { grid-column: 1 / -1; justify-content: space-between; }
    .v3-bprice { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; text-align: left; }
    .v3-bprice .v3-lbl.mt-2 { margin-top: 0 !important; }
    .v3-bprice .v3-bval, .v3-bprice .v3-bedit { justify-self: end; }
    .v3-qstep.input-step button { width: 44px; height: 44px; }
    .v3-qstep.input-step input { height: 44px; }
    .v3-mconfirm { position: fixed; left: 0; right: 0; bottom: calc(var(--v3-tabbar-h) + env(safe-area-inset-bottom)); z-index: 1014; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; background: var(--vz-card-bg); border-top: 1px solid var(--vz-border-color); }
    .v3-mconfirm small { display: block; font-size: 11px; color: var(--vz-secondary-color); }
    .v3-mconfirm b { font-size: 17px; }
    .v3-content:has(.v3-mconfirm) { padding-bottom: 170px !important; }
}

/* ============================================================
   24. VELZON AYARLAR PARCASI ve BEKLEME GOSTERGESI
   ------------------------------------------------------------
   _customizer yalnizca #preloader icin yuklenir: disli dugmesi,
   tema ayarlari paneli ve kirmizi "yukari cik" dugmesi gizli.
   #preloader varsayilan gizli; sepet/siparis betikleri satir ici
   stille gorunur yapar (inline stil bu kurali ezer).
   ============================================================ */
.customizer-setting, #theme-settings-offcanvas, #back-to-top { display: none !important; }
#preloader { position: fixed; inset: 0; z-index: 2050; display: grid; place-items: center; background: transparent; opacity: 0; visibility: hidden; transition: opacity .15s ease; pointer-events: none; }
#preloader[style*="visible"] { pointer-events: auto; background: color-mix(in srgb, var(--vz-body-bg) 60%, transparent) !important; }
#preloader #status { position: static; transform: none; margin: 0; }
#preloader .spinner-border { width: 2.25rem; height: 2.25rem; border-width: .2em; color: var(--vz-primary) !important; }

/* ============================================================
   25. SIPARISI TAMAMLA (Basket/CheckOut) ve ortak secim karti
   ============================================================ */
.v3-checkout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.v3-checkout .card { margin: 0; }
.v3-steps.nav { display: flex; gap: 6px; padding: 14px 20px; border-bottom: 1px solid var(--vz-border-color); margin: 0; flex-wrap: nowrap; }
.v3-steps .nav-link { display: flex; align-items: center; gap: 8px; border: 0; background: transparent !important; color: var(--vz-secondary-color); font-weight: 500; font-size: 13.5px; padding: 6px 10px; border-radius: 8px; white-space: nowrap; }
.v3-steps .nav-link i { font-style: normal; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 600; border: 1px solid var(--v3-border-strong); background: var(--vz-card-bg); }
.v3-steps .nav-link.active { color: var(--vz-heading-color); font-weight: 600; }
.v3-steps .nav-link.active i { border-color: var(--vz-primary); background: var(--vz-primary); color: #fff; }
.v3-steps .nav-link:disabled { opacity: 1; }
.v3-co-sec { padding: 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-co-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.v3-co-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.v3-co-h h2 { margin: 0; font-size: 15px; font-weight: 600; }
.v3-co-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 20px; flex-wrap: wrap; }
.v3-co-sum { position: sticky; top: 92px; }
.v3-sl { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 9px 0; border-bottom: 1px solid var(--vz-border-color); font-size: 13px; }
.v3-sl small { color: var(--vz-secondary-color); font-size: 12px; }
.v3-sl-a { grid-row: 1 / 3; grid-column: 2; align-self: center; font-weight: 600; }

/* secim karti (adres, odeme turu) */
.v3-opts { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.v3-opt { position: relative; display: flex; gap: 10px; align-items: flex-start; padding: 14px; border: 1px solid var(--vz-border-color); border-radius: 10px; background: var(--vz-card-bg); cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.v3-opt .form-check-input { margin: 2px 0 0; flex: none; }
.v3-opt label { flex: 1; cursor: pointer; margin: 0; min-width: 0; }
.v3-opt b { display: block; font-size: 14px; font-weight: 600; color: var(--vz-heading-color); }
.v3-opt small { display: block; font-size: 12px; color: var(--vz-secondary-color); line-height: 17px; }
.v3-opt:has(input:checked) { border-color: var(--vz-primary); background: var(--vz-primary-bg-subtle); }
.v3-opt-edit { width: 32px; height: 32px; font-size: 16px; margin: -6px -6px 0 0; }
@media (hover: hover) and (pointer: fine) { .v3-opt:not(:has(input:checked)):hover { border-color: var(--v3-border-strong); } }

.v3-bank { margin-top: 16px; padding: 16px; border: 1px solid var(--vz-border-color); border-radius: 10px; }
.v3-bank-row { display: grid; grid-template-columns: 120px 1fr; gap: 8px 12px; margin: 0; font-size: 13px; }
.v3-bank-row + .v3-bank-row { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--vz-border-color); }
.v3-bank-row dt { color: var(--vz-secondary-color); font-weight: 500; }
.v3-bank-row dd { margin: 0; font-weight: 600; }
.v3-iban { display: flex; gap: 8px; }
.v3-iban .form-control { letter-spacing: .02em; }

.v3-done { text-align: center; padding: 48px 20px; }
.v3-done > i { font-size: 48px; color: var(--vz-success-text-emphasis); }
.v3-done h2 { font-size: 20px; margin: 10px 0 6px; }
.v3-done p { color: var(--vz-secondary-color); margin: 0 0 4px; }

@media (max-width: 1199.98px) { .v3-checkout { grid-template-columns: 1fr; } .v3-co-sum { position: static; } }
@media (max-width: 767.98px) {
    .v3-steps .nav-link { font-size: 12px; padding: 6px 4px; }
    .v3-steps .nav-link:not(.active) span { display: none; }
    .v3-co-grid { grid-template-columns: 1fr; }
    .v3-co-sec { padding: 16px; }
    .v3-co-foot { padding: 14px 16px; }
    .v3-co-foot .btn { flex: 1; justify-content: center; }
    .v3-bank-row { grid-template-columns: 1fr; gap: 2px; }
    .v3-iban { flex-direction: column; }
}
@media (max-width: 767.98px) {
    /* orta genislik satir yerlesimi telefona tasinmasin */
    .v3-bline .v3-bqty, .v3-bline .v3-bprice { grid-row: auto; }
    .v3-bline .v3-bqty { grid-column: 1 / -1; justify-content: space-between; }
    .v3-bline .v3-bprice { grid-column: 1 / -1; }
}
/* duzenleme modunda bos kalan fiyat kutusu yer tutmasin (etiket/deger ciftleri hizali kalsin) */
.v3-bprice > .product-price:empty { display: none; }
@media (max-width: 767.98px) {
    .v3-steps.nav { gap: 2px; padding: 12px; overflow-x: auto; scrollbar-width: none; }
    .v3-steps .nav-link { gap: 6px; padding: 6px; }
}

/* ============================================================
   26. SIPARIS DETAYI URUN TABLOSU (Orders/Detail)
   ------------------------------------------------------------
   Dar ekranda (telefon ve 640px yan panel) b2b-mobile'in
   tablo->kart donusumu kullanilir; burada yalnizca fotograf ve
   toplam satiri icin duzeltme var.
   ============================================================ */
@media (max-width: 767.98px) {
    .v3-dt > tbody > tr > .v3-dt-photo { position: absolute; top: 8px; right: 10px; width: 40px !important; height: 40px !important; padding: 0 !important; }
    .v3-dt > tbody > tr > .v3-dt-photo img { border-radius: 6px; object-fit: contain; }
    .v3-dt > tbody > tr > .b2b-grow { padding-right: 60px !important; }
    .v3-dt > tbody > tr > .b2b-grow h5 { font-size: 14px; margin: 0; }
    .v3-dt > tbody > tr > td::before { text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; font-weight: 500 !important; }
    .v3-dt > tbody > tr > td .form-control { width: 7rem !important; }
    .v3-dt > tbody > tr.v3-dt-sum { border: 0; background: transparent; box-shadow: none; }
    .v3-dt > tbody > tr.v3-dt-sum > .v3-dt-gap { display: none !important; }
    .v3-dt > tbody > tr.v3-dt-sum > td { display: block !important; padding: 0 !important; }
    .v3-dt > tbody > tr.v3-dt-sum > td::before { display: none; }
    .v3-dt > tbody > tr.v3-dt-sum table { display: table !important; background: var(--vz-card-bg); border: 1px solid var(--vz-border-color); border-radius: var(--v3-r-card); }
    .v3-dt > tbody > tr.v3-dt-sum table td, .v3-dt > tbody > tr.v3-dt-sum table th { display: table-cell !important; padding: 8px 14px !important; }
    .v3-dt > tbody > tr.v3-dt-sum table td::before, .v3-dt > tbody > tr.v3-dt-sum table th::before { display: none !important; }
}
@media (max-width: 767.98px) {
    /* kalem karti: degerler iki sutunda, kart yarisi kadar uzun */
    .v3-dt > tbody > tr:not(.v3-dt-sum) { display: grid !important; grid-template-columns: 1fr 1fr; }
    .v3-dt > tbody > tr:not(.v3-dt-sum) > .b2b-grow { grid-column: 1 / -1; }
    .v3-dt > tbody > tr:not(.v3-dt-sum) > td:not(.b2b-grow):not(.v3-dt-photo) { padding: .35rem .85rem !important; }
    .v3-dt > tbody > tr:not(.v3-dt-sum) > td:nth-child(even):not(.b2b-grow) { border-right: 1px solid var(--vz-border-color) !important; }
}

/* ============================================================
   27. EKSTRE (Report/Extract)
   ============================================================ */
.v3-ext-bar { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-ext-bar .btn { display: inline-flex; align-items: center; }
.v3-ext-cust { flex: 1 1 320px; max-width: 460px; }
.v3-ext tfoot td { font-weight: 650; background: var(--v3-surface-2); border-top: 1px solid var(--v3-border-strong); color: var(--vz-heading-color); }
@media (max-width: 767.98px) {
    .v3-ext-bar { padding: 12px 14px; }
    .v3-ext-bar .btn { flex: 1 1 auto; justify-content: center; }
    .v3-ext-bar .v3-spacer { display: none; }
    .v3-ext tfoot { display: block; }
    .v3-ext tfoot tr { display: grid; grid-template-columns: 1fr 1fr; }
    .v3-ext tfoot td:first-child { display: none; }
}

/* ============================================================
   28. FATURALAR ust kismi + sablon ikonlari
   ============================================================ */
.v3-inv-rep { flex: 0 1 260px; min-width: 200px; }
.v3-inv-date { position: relative; flex: 0 1 280px; }
.v3-inv-date > i { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--vz-secondary-color); pointer-events: none; z-index: 1; }
.v3-inv-date .form-control { padding-left: 34px; }
.v3-inv-search { flex: 1; position: relative; max-width: 520px; }
.v3-inv-search .form-control { padding-left: 36px; }
.v3-inv-search .search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--vz-secondary-color); }
.v3-inv-tabs { padding: 0 12px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
.v3-inv-tabs .nav-link { white-space: nowrap; padding: 12px 10px; }
@media (max-width: 767.98px) { .v3-inv-rep, .v3-inv-date { flex: 1 1 100%; } }

/* Velzon lord-icon hareketli sablon ikonlari (bos durum, silme onayi) v3'te gosterilmez; metinler kalir */
lord-icon { display: none !important; }
.noresult .text-center, .noresult { padding: 32px 16px; color: var(--vz-secondary-color); }
.noresult h5 { color: var(--vz-heading-color); font-size: 16px; }

/* ============================================================
   29. ODEME YAP (Payment/Index)
   ============================================================ */
.v3-pay { display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 380px); gap: 24px; align-items: start; }
.v3-pay .card { margin: 0; }
.v3-pay-amount { font-size: 20px !important; font-weight: 650; height: 48px; }
.v3-pay-row { display: grid; grid-template-columns: 1fr 120px; gap: 12px; }
.v3-pay-exp { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.v3-pay-preview { position: sticky; top: 92px; padding-top: 8px; }
@media (max-width: 1099.98px) { .v3-pay { grid-template-columns: 1fr; } .v3-pay-preview { position: static; order: -1; } }

/* ============================================================
   30. DOKUMANLARIM (Documents/Index, Detail)
   ============================================================ */
.v3-folders { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.v3-folder { flex-direction: row !important; align-items: center; margin: 0; transition: border-color .15s ease; }
.v3-folder-main { flex: 1; display: flex; align-items: center; gap: 12px; padding: 14px 16px; color: inherit; min-width: 0; }
.v3-folder-main > i { font-size: 26px; color: var(--vz-primary); }
.v3-folder-main b { display: block; font-size: 14px; color: var(--vz-heading-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v3-folder-main small { color: var(--vz-secondary-color); font-size: 12px; }
.v3-folder-del { margin-right: 8px; color: var(--v3-faint); font-size: 18px; }
.v3-folder-del:hover { color: var(--vz-danger-text-emphasis); }
@media (hover: hover) and (pointer: fine) { .v3-folder:hover { border-color: var(--v3-border-strong); } }
.v3-upload .form-control[type="text"] { flex: 1 1 260px; max-width: 420px; }
.v3-upload .form-control[type="file"] { flex: 1 1 260px; max-width: 380px; }
.v3-files { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.v3-file { margin: 0; overflow: hidden; }
.v3-file-pv { height: 220px; background: var(--v3-surface-2); border-bottom: 1px solid var(--vz-border-color); }
.v3-file-pv iframe { width: 100%; height: 100%; border: 0; display: block; }
.v3-file-b { padding: 12px 14px; }
.v3-file-b b { display: block; font-size: 14px; font-weight: 600; color: var(--vz-heading-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 10px; }
.v3-file-acts { display: flex; gap: 8px; }
.v3-file-del { border: 1px solid var(--vz-border-color); color: var(--vz-danger-text-emphasis); background: transparent; }
.v3-file-del:hover { background: var(--vz-danger-bg-subtle); }

/* 31. Iade sepeti: fiyat kolonu yok, adet satirin sagina oturur */
.v3-bline-ret { grid-template-columns: 56px minmax(0, 1fr) auto; }
@media (max-width: 1399.98px) { .v3-bline-ret .v3-bqty { grid-column: 3; grid-row: 1; justify-content: flex-end; } }
@media (max-width: 767.98px) { .v3-bline.v3-bline-ret .v3-bqty { grid-column: 1 / -1; grid-row: auto; justify-content: space-between; } }

/* 32. Iade urun listesi (Return/CreateOrders): filtre secimleri, foto ve adet hucresi */
.v3-ret-bar .v3-inv-search { min-width: 220px; }
.v3-ret-f { width: 190px; }
.v3-ret-f .bootstrap-select > .dropdown-toggle { height: 38px; background: var(--vz-input-bg, var(--vz-card-bg)); color: var(--vz-body-color); }
.v3-ret-table .v3-dt-photo { width: 56px; }
.v3-ret-table .v3-dt-photo img { width: 40px; height: 40px; object-fit: contain; border-radius: 6px; }
.v3-ret-table td.actions { width: 1%; }
@media (max-width: 767.98px) {
    .v3-ret-f { width: calc(50% - 4px); }
    .v3-ret-bar .v3-inv-search { flex-basis: 100%; max-width: none; }
    .v3-ret-bar .v3-ret-add { display: none; }
    .v3-ret-table > tbody > tr > td.actions { grid-column: 1 / -1; width: auto; display: flex !important; align-items: center; justify-content: space-between; border-right: 0 !important; }
}

/* 33. Yonetici anasayfasi (sifirdan): baslik, bolum cubugu, ozet seridi, izgaralar, Top 5 listeleri */
.v3-home-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.v3-home-head .v3-hello { margin: 0 0 2px; }
.v3-jump { position: sticky; top: 68px; z-index: 15; display: flex; gap: 4px; overflow-x: auto; margin: 0 0 20px; padding: 8px 0; background: var(--vz-body-bg); border-bottom: 1px solid var(--vz-border-color); scrollbar-width: none; }
.v3-jump::-webkit-scrollbar { display: none; }
.v3-jump a { font-size: 13px; font-weight: 500; color: var(--vz-secondary-color); padding: 6px 10px; border-radius: 6px; white-space: nowrap; text-decoration: none; transition: background-color .15s ease, color .15s ease; }
@media (hover: hover) and (pointer: fine) { .v3-jump a:hover { background: var(--vz-card-bg); color: var(--vz-heading-color); } }
#gunluk, #aylik, #plasiyer, #encok, #gruplar, #evrak, #top5 { scroll-margin-top: 130px; }
#aylik.card, #evrak.card, .v3-grid2, .v3-grid-side, .v3-grid4 { margin-bottom: 24px; }
.v3-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.v3-grid-side { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: 24px; align-items: start; }
.v3-grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.v3-grid2 > .card, .v3-grid-side > .card, .v3-grid4 > .card { margin: 0; }
.v3-card-acts { display: flex; align-items: center; gap: 12px; }
.v3-btn-link { border: 0; background: transparent; padding: 0; cursor: pointer; }
.v3-card-h .v3-tot { font-size: 13px; font-weight: 600; color: var(--vz-body-color); margin-left: 4px; }
.v3-card-h .dropdown-toggle { min-height: 30px; }
.v3-sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--vz-border-color); }
.v3-sum > div { padding: 14px 20px; border-right: 1px solid var(--vz-border-color); }
.v3-sum > div:last-child { border-right: 0; }
.v3-sum small { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--vz-secondary-color); }
.v3-sum small i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.v3-sum b { display: block; margin-top: 2px; font-size: 18px; line-height: 26px; font-weight: 600; letter-spacing: -.01em; color: var(--vz-heading-color); }
.v3-chart-box { padding: 8px 12px 4px; }
/* en cok satanlar: JS ile gelen "etiket ustte, deger altta" hucreleri */
.v3-top td { padding: 10px 20px !important; vertical-align: middle; }
.v3-top td h5 { font-size: 13.5px !important; font-weight: 600 !important; color: var(--vz-heading-color); margin: 0 !important; }
.v3-top td:first-child { min-width: 200px; }
.v3-top td:first-child h5 { white-space: normal; }
.v3-top td .text-muted { display: block; font-size: 11.5px; color: var(--vz-secondary-color) !important; }
.v3-top td p { margin: 0; font-weight: 600; }
.v3-top td:not(:first-child) { text-align: right; }
.v3-compact td { padding: 10px 16px !important; white-space: nowrap; }
.v3-compact td.v3-wrap { white-space: normal; min-width: 160px; }
.v3-rank { list-style: none; margin: 0; padding: 6px 20px 14px; counter-reset: r; }
.v3-rank li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--vz-border-color); font-size: 13px; counter-increment: r; }
.v3-rank li:last-child { border-bottom: 0; }
.v3-rank li::before { content: counter(r); color: var(--v3-faint); font-size: 12px; font-variant-numeric: tabular-nums; }
.v3-rank span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--vz-body-color); }
.v3-rank b { font-weight: 600; color: var(--vz-heading-color); }
@media (max-width: 1399.98px) { .v3-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1199.98px) { .v3-grid-side, .v3-grid2 { grid-template-columns: 1fr; } }
@media (max-width: 767.98px) {
    .v3-jump { top: 60px; margin-left: -12px; margin-right: -12px; padding-left: 12px; padding-right: 12px; }
    .v3-grid2, .v3-grid-side, .v3-grid4 { gap: 16px; margin-bottom: 16px; }
    .v3-grid4 { grid-template-columns: 1fr; }
    .v3-sum { grid-template-columns: 1fr 1fr; }
    .v3-sum > div:nth-child(2) { border-right: 0; }
    .v3-sum > div:nth-child(-n+2) { border-bottom: 1px solid var(--vz-border-color); }
    .v3-card-h { flex-wrap: wrap; }
}

/* 34. Kenar menu Raporlar grubu: alt basliklar okunur, ogeler govde renginde, grup cizgisi ile ayrilir */
.v3-nav details .v3-sub { margin: 2px 0 8px 19px; padding: 0 0 0 10px; border-left: 1px solid var(--vz-border-color); }
.v3-nav details .v3-sub-h { font-size: 12px; font-weight: 600; color: var(--vz-heading-color); padding: 12px 10px 4px; letter-spacing: 0; }
.v3-nav details .v3-sub-h:first-child { padding-top: 6px; }
.v3-nav details .v3-sub a { color: var(--vz-body-color); }

/* 35. Siparis Ver liste gorunumu (Basket/CreateOrders): Iade listesiyle ayni arac cubugu ve tablo (bolum 32) */
.v3-ret-bar .v3-spacer { flex: 1; }
.v3-ord-picked { font-size: 13px; font-weight: 600; color: var(--vz-primary-text-emphasis); white-space: nowrap; }
.v3-ord-picked:empty { display: none; }
.v3-pre { display: inline-block; margin-right: 6px; padding: 1px 6px; border-radius: 4px; font-size: 11px; font-weight: 600; color: var(--vz-warning-text-emphasis); background: var(--vz-warning-bg-subtle); vertical-align: 1px; }
.v3-prebasket { max-height: 60vh; overflow: auto; border: 1px solid var(--vz-border-color); border-radius: var(--v3-r-ctl); }
.v3-prebasket thead th { position: sticky; top: 0; z-index: 1; background: var(--v3-surface-2, var(--vz-card-bg)); }
.v3-head .v3-seg a { text-decoration: none; }
/* Urun adinin sonu (ders / renk / beden) urunleri ayirir: kesme, satira kaydir */
.v3-ret-table > tbody > tr > td.ProductName { white-space: normal !important; max-width: none !important; min-width: 280px; text-overflow: clip !important; overflow: visible !important; line-height: 1.35; }

/* 36. Duzeltmeler: yapiskan tablo basligi ve yan panel odak cercevesi
   - b2b-ui uzun listelerde basligi yapiskan yapar; bolum 10'daki saydam zemin
     yuzunden kaydirinca satirlar basligin ustune biniyordu -> kart zemini ver.
   - Offcanvas acilinca odak panele gecer; genel :focus-visible cercevesi panelin
     sol kenarina kalin mor cizgi ciziyordu. */
.table.b2b-sticky-head > thead > tr > th { background: var(--vz-card-bg) !important; z-index: 3; box-shadow: inset 0 -1px 0 var(--vz-border-color); }
.offcanvas:focus, .offcanvas:focus-visible, .modal:focus-visible { outline: 0; }

/* 37. Siparis detayi (Orders/Detail): ust satir, ozet seridi, kalemler + bilgi kartlari.
       Yan panelde (v3-od--embed, 640px) tek sutun. */
.v3-od { display: flex; flex-direction: column; gap: 20px; }
.v3-od .card { margin: 0; }
.v3-od-top { display: flex; align-items: center; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; }
.v3-od-id { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.v3-od-id h2 { margin: 0; font-size: 20px; font-weight: 650; letter-spacing: -.01em; }
.v3-od-id .v3-m b { color: var(--vz-heading-color); font-weight: 600; }
.v3-od-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.v3-od-acts .btn, .v3-od .v3-card-h .btn { display: inline-flex; align-items: center; }
.v3-od-cancel { border: 1px solid var(--vz-border-color); color: var(--vz-danger-text-emphasis); background: var(--vz-card-bg); }
.v3-od-cancel:hover { background: var(--vz-danger-bg-subtle); color: var(--vz-danger-text-emphasis); }
.v3-od-grand { color: var(--vz-primary-text-emphasis); }
.v3-od-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.v3-od-main, .v3-od-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.v3-od-table .v3-dt-photo { width: 56px; }
.v3-od-table .v3-dt-photo img { width: 40px; height: 40px; object-fit: contain; border-radius: 6px; }
.v3-od-table td.v3-od-name { white-space: normal !important; max-width: none !important; min-width: 220px; font-weight: 600; color: var(--vz-heading-color); line-height: 1.35; overflow: visible !important; text-overflow: clip !important; }
.v3-od-status { min-width: 260px; }
.v3-od-info { padding: 16px 18px; }
.v3-od-info h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 14px; font-weight: 600; }
.v3-od-info h3 i { font-size: 16px; color: var(--v3-faint); }
.v3-od-info dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 14px; margin: 0; font-size: 13px; }
.v3-od-info dt { font-weight: 400; color: var(--vz-secondary-color); }
.v3-od-info dd { margin: 0; text-align: right; color: var(--vz-heading-color); font-weight: 500; overflow-wrap: anywhere; }
.v3-od-addr { display: flex; flex-direction: column; gap: 3px; margin: 0; font-size: 13px; line-height: 1.45; color: var(--vz-body-color); }
.v3-od-addr b { color: var(--vz-heading-color); font-weight: 600; }
@media (max-width: 1199.98px) { .v3-od-grid { grid-template-columns: 1fr; } .v3-od-side { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); } }
/* yan panel: tek sutun, bilgi kartlari ikili */
.v3-od--embed .v3-od-grid { grid-template-columns: 1fr; }
.v3-od--embed .v3-od-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.v3-od--embed .v3-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.v3-od--embed .v3-strip > div:nth-child(2) { border-right: 0; }
.v3-od--embed .v3-strip > div:nth-child(-n+2) { border-bottom: 1px solid var(--vz-border-color); }
@media (max-width: 575.98px) { .v3-od--embed .v3-od-side, .v3-od-side { grid-template-columns: 1fr; } }

/* 38. Alt sekme cubugu: sabit yukseklik. Sepet / iade onay cubuklari ve galerinin sepet
       cubugu bu yukseklige gore oturur (once 62px varsayilip 73px cikiyor, 11px cakisiyordu).
       Ortadaki Siparis Ver dugmesi cubuk hizasinda; yukari tasan hali ustteki cubuklarla carpisiyordu. */
:root { --v3-tabbar-h: 64px; }
@media (max-width: 767.98px) {
    .v3-has-tabbar .v3-tabbar { height: calc(var(--v3-tabbar-h) + env(safe-area-inset-bottom)); padding-top: 0; padding-bottom: env(safe-area-inset-bottom); align-items: center; box-sizing: border-box; }
    .v3-tabbar a { padding: 0; justify-content: center; height: var(--v3-tabbar-h); }
    .v3-tabbar .v3-tab-fab { margin-top: 0; color: var(--vz-primary-text-emphasis); font-weight: 600; }
    .v3-tabbar .v3-tab-fab > i { width: 40px; height: 30px; border-radius: 10px; font-size: 20px; box-shadow: none; }
}

/* 39. Kenar menu hiyerarsisi (34'un yerine): bolum etiketi < grup basligi < rapor.
       Grup basliklari ve raporlar ayni koyulukta oldugu icin ayirt edilmiyordu:
       - bolum etiketi (Finans, Diger): okunur gri, ustunde ayirici cizgi
       - grup basligi (Siparis raporlari): marka renginde, altinda ince cizgi
       - rapor: normal kalinlik, madde isaretli; secili olan zeminle vurgulu */
.v3-nav .v3-sec { font-size: 12px; font-weight: 600; color: var(--vz-secondary-color); padding: 14px 10px 6px; margin-top: 8px; border-top: 1px solid var(--vz-border-color); }
.v3-nav details .v3-sub { margin: 2px 0 8px; padding: 0; border-left: 0; }
.v3-nav details .v3-sub-h { margin: 12px 10px 4px; padding: 0 0 5px; font-size: 12px; font-weight: 600; letter-spacing: 0; color: var(--vz-primary-text-emphasis); border-bottom: 1px solid var(--vz-border-color); }
.v3-nav details .v3-sub-h:first-child { margin-top: 6px; padding-top: 0; }
.v3-nav details .v3-sub a { position: relative; padding: 6px 10px 6px 28px; font-size: 13px; font-weight: 400; color: var(--vz-body-color); }
.v3-nav details .v3-sub a::before { content: ""; position: absolute; left: 14px; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: var(--v3-border-strong); transform: translateY(-50%); }
.v3-nav details .v3-sub a.active { background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); font-weight: 600; }
.v3-nav details .v3-sub a.active::before { background: var(--vz-primary); }

/* ============================================================
   40. VELZON'DAN DEVRALINAN TEMEL KURALLAR
   ------------------------------------------------------------
   Velzon app.min.css / custom.min.css kaldirildi. Gorunumlerin
   hala kullandigi birkac yardimci sinif ve bilesen ayari burada,
   v3 tokenlariyla yeniden yazildi (sabit mor / yesil renkler yok).
   Secim kutusu ve tarih secici icin kendi css'leri _head_css'te.
   ============================================================ */
.card { margin-bottom: 24px; }
.table-nowrap td, .table-nowrap th { white-space: nowrap; }
.w-xs { min-width: 80px; } .w-sm { min-width: 95px; } .w-lg { min-width: 140px; }
.avatar-xs { width: 2rem; height: 2rem; } .avatar-sm { width: 3rem; height: 3rem; } .avatar-md { width: 4.5rem; height: 4.5rem; } .avatar-xl { width: 7.5rem; height: 7.5rem; }
.avatar-title { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-weight: 600; background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); }
.border-bottom-dashed { border-bottom-style: dashed !important; } .border-top-dashed { border-top-style: dashed !important; }
.apex-charts { min-height: 10px !important; } .apex-charts text { font-family: inherit !important; } .apex-charts .apexcharts-canvas { margin: 0 auto; }
.chartjs-chart { max-height: 320px; }
.ff-secondary { font-family: inherit; }
.search-box { position: relative; }
.search-box .form-control { padding-left: 38px; }
.search-box .search-icon { position: absolute; left: 12px; top: 0; height: 100%; display: flex; align-items: center; font-size: 15px; color: var(--vz-secondary-color); pointer-events: none; transform: none; }
/* "soft" dugmeler: acik zemin, rengine gore yazi */
.btn-soft-primary, .btn-soft-secondary, .btn-soft-success, .btn-soft-info, .btn-soft-warning, .btn-soft-danger { border: 1px solid transparent; }
.btn-soft-primary { background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); }
.btn-soft-secondary { background: var(--v3-surface-2); color: var(--vz-body-color); }
.btn-soft-success { background: var(--vz-success-bg-subtle); color: var(--vz-success-text-emphasis); }
.btn-soft-info { background: var(--vz-info-bg-subtle); color: var(--vz-info-text-emphasis); }
.btn-soft-warning { background: var(--vz-warning-bg-subtle); color: var(--vz-warning-text-emphasis); }
.btn-soft-danger { background: var(--vz-danger-bg-subtle); color: var(--vz-danger-text-emphasis); }
.btn-soft-primary:hover, .btn-soft-secondary:hover, .btn-soft-success:hover, .btn-soft-info:hover, .btn-soft-warning:hover, .btn-soft-danger:hover { filter: brightness(.97); border-color: var(--vz-border-color); }
/* durum anahtari (siparis detayi vb.) */
.form-switch-md { padding-left: 2.5rem; min-height: 22px; line-height: 22px; }
.form-switch-md .form-check-input { width: 40px; height: 20px; left: -.5rem; position: relative; }
.form-switch-right { display: inline-block; padding-right: .8em; margin-bottom: 0; padding-left: 0 !important; }
.form-switch-right .form-check-input { float: right; margin-left: 0; margin-right: -1.6em; margin-top: .1em !important; }
.form-switch-right label { margin-bottom: 0; margin-right: 1rem; }
/* sekmeler: renkli Velzon varyantlari tek v3 gorunumune iner */
.nav-success .nav-link.active, .nav-primary .nav-link.active { color: var(--vz-primary-text-emphasis); background: var(--vz-primary-bg-subtle); }
.nav-custom-outline.nav .nav-link { border: 1px solid transparent; }
.nav-custom-outline.nav .nav-link.active { border-color: var(--vz-primary); background: transparent; color: var(--vz-primary-text-emphasis); }
/* hizli erisim listesi */
.dropdown-icon-item { display: block; border-radius: var(--v3-r-ctl); text-align: center; padding: 12px 4px 8px; border: 1px solid transparent; color: var(--vz-body-color); }
.dropdown-icon-item span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.dropdown-icon-item:hover { background: var(--v3-surface-2); }
/* Velzon'un dalga efekti kaldirildi; siniflar zararsiz kalsin */
.waves-effect, .waves-light { position: relative; }
/* Choices / flatpickr v3 gorunumu (kutuphanelerin kendi css'i uzerine) */
.choices { margin-bottom: 0; font-size: 14px; }
.choices__inner { min-height: 38px; padding: 4px 8px !important; border: 1px solid var(--v3-border-strong); border-radius: var(--v3-r-ctl) !important; background: var(--vz-card-bg); font-size: 14px; }
.is-focused .choices__inner, .is-open .choices__inner { border-color: var(--vz-primary); box-shadow: 0 0 0 3px rgba(var(--vz-primary-rgb), .15); }
.choices__list--dropdown, .choices__list[aria-expanded] { border: 1px solid var(--vz-border-color) !important; border-radius: var(--v3-r-ctl) !important; background: var(--vz-card-bg) !important; box-shadow: var(--v3-shadow-pop); z-index: 1060 !important; }
.choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted { background: var(--v3-surface-2) !important; }
.choices__list--multiple .choices__item { background: var(--vz-primary-bg-subtle) !important; border: 0 !important; color: var(--vz-primary-text-emphasis) !important; border-radius: 6px !important; font-weight: 500; }
.choices[data-type*=select-multiple] .choices__button, .choices[data-type*=text] .choices__button { border-left-color: rgba(var(--vz-primary-rgb), .3) !important; filter: invert(30%); }
.choices__input { background: transparent !important; color: var(--vz-body-color); }
.choices[data-type*=select-one] .choices__inner { padding-bottom: 4px !important; }
.choices[data-type*=select-one]::after { border-color: var(--vz-secondary-color) transparent transparent !important; }
.flatpickr-calendar { border: 1px solid var(--vz-border-color); border-radius: var(--v3-r-card); box-shadow: var(--v3-shadow-pop) !important; background: var(--vz-card-bg); font-family: inherit; }
.flatpickr-calendar.arrowTop::before, .flatpickr-calendar.arrowTop::after { display: none; }
.flatpickr-months .flatpickr-month, .flatpickr-current-month .flatpickr-monthDropdown-months, .flatpickr-weekdays, span.flatpickr-weekday { background: transparent !important; color: var(--vz-heading-color) !important; fill: var(--vz-heading-color); }
.flatpickr-day { color: var(--vz-body-color); border-radius: 8px; }
.flatpickr-day.today { border-color: var(--vz-primary); }
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover { background: var(--vz-primary) !important; border-color: var(--vz-primary) !important; color: #fff !important; }
.flatpickr-day.inRange { background: var(--vz-primary-bg-subtle) !important; border-color: transparent !important; box-shadow: -5px 0 0 var(--vz-primary-bg-subtle), 5px 0 0 var(--vz-primary-bg-subtle) !important; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { color: var(--v3-faint) !important; }
/* list.js sayfalama (Onceki 1 2 3 ... Sonraki) - Velzon app.css ile birlikte gitmisti */
.pagination-wrap { display: flex; align-items: center; gap: 6px; user-select: none; }
.pagination-wrap a { text-decoration: none; display: inline-block; }
.listjs-pagination { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; justify-content: flex-end; }
.listjs-pagination li .page,
.pagination-wrap .pagination-prev, .pagination-wrap .pagination-next { display: block; min-width: 34px; padding: 6px 10px; text-align: center; font-size: 13px; font-weight: 500; line-height: 1.4; color: var(--vz-body-color); background: var(--vz-card-bg); border: 1px solid var(--v3-border-strong); border-radius: var(--v3-r-ctl); }
.listjs-pagination li .page:hover,
.pagination-wrap .pagination-prev:hover, .pagination-wrap .pagination-next:hover { background: var(--v3-surface-2); color: var(--vz-primary); }
.listjs-pagination li.active .page { background: var(--vz-primary); border-color: var(--vz-primary); color: #fff; }
.listjs-pagination li.disabled .page { border-color: transparent; background: transparent; color: var(--v3-faint); pointer-events: none; min-width: 0; padding-inline: 2px; }
.pagination-wrap .pagination-prev.disabled, .pagination-wrap .pagination-next.disabled { color: var(--v3-faint); opacity: .6; pointer-events: none; }

/* ============================================================
   41. GIRIS / KAYIT / SIFRE SAYFALARI (v3-auth, sifirdan)
   ------------------------------------------------------------
   Solda marka gorseli (LoginPhoto), sagda form. Telefonda gorsel
   gizlenir, logo formun ustune gelir. Bolum 18'deki eski Velzon
   auth siniflari artik kullanilmiyor.
   ============================================================ */
.v3-auth-body { margin: 0; background: var(--vz-body-bg); color: var(--vz-body-color); }
.v3-auth { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(420px, .9fr); min-height: 100vh; min-height: 100dvh; }
.v3-auth-visual { position: relative; background-color: var(--v3-surface-2); background-size: cover; background-position: center; }
.v3-auth-brand { position: absolute; left: 32px; top: 32px; display: inline-flex; padding: 10px 14px; border-radius: 12px; background: rgba(255, 255, 255, .92); box-shadow: var(--v3-shadow-pop); }
.v3-auth-brand img { height: 56px; width: auto; display: block; }
.v3-auth-panel { display: flex; flex-direction: column; justify-content: center; padding: 48px 56px 24px; background: var(--vz-card-bg); border-left: 1px solid var(--vz-border-color); }
.v3-auth-form { width: 100%; max-width: 400px; margin: auto auto; }
.v3-auth-form h1 { margin: 0 0 4px; font-size: 24px; line-height: 32px; font-weight: 650; letter-spacing: -.02em; color: var(--vz-heading-color); }
.v3-auth-form > .v3-m { margin: 0 0 16px; font-size: 14px; }
.v3-auth-logo { display: none; height: 48px; width: auto; margin-bottom: 20px; }
.v3-auth-hint { margin: 0 0 24px; padding: 10px 12px; border-radius: var(--v3-r-ctl); background: var(--v3-surface-2); font-size: 13px; color: var(--vz-body-color); }
.v3-auth-hint b { color: var(--vz-heading-color); font-variant-numeric: tabular-nums; }
.v3-auth .form-label { font-weight: 500; margin-bottom: 6px; }
.v3-auth .form-control-lg { height: 46px; font-size: 15px; border-radius: var(--v3-r-ctl); }
.v3-auth .btn-lg { height: 46px; font-size: 15px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.v3-auth-pass { position: relative; }
.v3-auth-pass .form-control { padding-right: 48px; }
.v3-auth-pass .v3-icon-btn { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); }
.v3-auth-foot { margin-top: 32px; text-align: center; font-size: 12px; color: var(--vz-secondary-color); }
.v3-auth-modal .modal-body { padding: 28px 24px 24px; text-align: center; }
.v3-auth-modal h2 { margin: 8px 0 6px; font-size: 17px; font-weight: 600; color: var(--vz-heading-color); }
.v3-auth-modal .v3-m { margin: 0 0 18px; }
.v3-auth-modal-i { font-size: 40px; line-height: 1; }
.v3-auth-modal-i.is-danger { color: var(--vz-danger); }
.v3-auth-modal-i.is-success { color: var(--vz-success); }
@media (max-width: 991.98px) {
    .v3-auth { grid-template-columns: 1fr; }
    .v3-auth-visual { display: none; }
    .v3-auth-panel { border-left: 0; padding: 32px 20px 20px; }
    .v3-auth-logo { display: block; }
}
/* basvuru formu: genis panel, iki sutunlu alanlar */
.v3-auth--wide { grid-template-columns: minmax(0, .8fr) minmax(520px, 1.2fr); }
.v3-auth--wide .v3-auth-form { max-width: 600px; }
.v3-auth-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.v3-auth-grid .v3-auth-full { grid-column: 1 / -1; }
.v3-auth-grid .form-control { height: 42px; }
.v3-auth-grid textarea.form-control { height: auto; }
@media (max-width: 991.98px) { .v3-auth--wide { grid-template-columns: 1fr; } }
@media (max-width: 575.98px) { .v3-auth-grid { grid-template-columns: 1fr; } }

/* 42. Durum sayfalari: hata ve bakim (v3-status) */
.v3-status { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
.v3-status-box { width: 100%; max-width: 520px; padding: 36px 32px; text-align: center; background: var(--vz-card-bg); border: 1px solid var(--vz-border-color); border-radius: var(--v3-r-card); }
.v3-status-code { font-size: 56px; line-height: 1; font-weight: 700; letter-spacing: -.03em; color: var(--vz-primary-text-emphasis); margin-bottom: 12px; }
.v3-status-icon { display: block; font-size: 44px; line-height: 1; color: var(--vz-primary); margin-bottom: 14px; }
.v3-status-box h1 { margin: 0 0 6px; font-size: 20px; font-weight: 650; letter-spacing: -.01em; color: var(--vz-heading-color); }
.v3-status-box .v3-m { margin: 0 0 22px; }
.v3-status-acts { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.v3-status-acts .btn { display: inline-flex; align-items: center; }
.v3-status-detail { text-align: left; max-height: 240px; overflow: auto; margin: 0 0 20px; padding: 12px; font-size: 12px; background: var(--v3-surface-2); border-radius: var(--v3-r-ctl); white-space: pre-wrap; }

/* 43. Profil (User/ProfileSettings) ve genel form izgarasi (v3-form-grid) */
.v3-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.v3-form-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.v3-form-full { grid-column: 1 / -1; }
.v3-form-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
@media (max-width: 767.98px) { .v3-form-grid, .v3-form-grid--3 { grid-template-columns: 1fr; } .v3-form-acts .btn { flex: 1; } }
.v3-prof { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 24px; align-items: start; }
.v3-prof .card { margin: 0; }
.v3-prof-main { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.v3-prof-card { padding: 28px 24px 20px; text-align: center; }
.v3-prof-photo { position: relative; width: 112px; height: 112px; margin: 0 auto 14px; }
.v3-prof-photo img { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; border: 1px solid var(--vz-border-color); background: var(--v3-surface-2); }
.v3-prof-cam { position: absolute; right: 2px; bottom: 2px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--vz-card-bg); border: 1px solid var(--v3-border-strong); color: var(--vz-body-color); cursor: pointer; font-size: 16px; }
.v3-prof-cam:hover { background: var(--v3-surface-2); }
.v3-prof-card h2 { margin: 0 0 2px; font-size: 17px; font-weight: 600; color: var(--vz-heading-color); overflow-wrap: anywhere; }
.v3-prof-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 12px; margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--vz-border-color); font-size: 13px; text-align: left; }
.v3-prof-dl dt { font-weight: 400; color: var(--vz-secondary-color); }
.v3-prof-dl dd { margin: 0; text-align: right; color: var(--vz-heading-color); overflow-wrap: anywhere; }
.v3-prof-tabs { padding-top: 0; padding-bottom: 0; }
.v3-prof-tabs .nav-link { padding: 14px 4px; margin-right: 20px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--vz-secondary-color); font-weight: 500; background: transparent; }
.v3-prof-tabs .nav-link.active { color: var(--vz-primary-text-emphasis); border-bottom-color: var(--vz-primary); background: transparent; }
.v3-devices { list-style: none; margin: 0; padding: 4px 20px 10px; }
.v3-devices li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--vz-border-color); font-size: 13px; }
.v3-devices li:last-child { border-bottom: 0; }
.v3-devices i { font-size: 18px; color: var(--v3-faint); }
.v3-devices-n { color: var(--vz-heading-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 991.98px) { .v3-prof { grid-template-columns: 1fr; } }

/* 44. Duyurular (Announcement/Index): klasor izgarasiyla ayni kart */
.v3-ann { display: flex; flex-direction: column; gap: 12px; padding: 16px; }
.v3-ann.is-passive { opacity: .72; }
.v3-ann-main { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; min-width: 0; }
.v3-ann-main i { font-size: 24px; color: var(--vz-primary); flex: none; }
.v3-ann-main b { display: block; font-weight: 600; color: var(--vz-heading-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v3-ann-main small { display: block; font-size: 12px; color: var(--vz-secondary-color); }
.v3-ann-acts { display: flex; gap: 8px; }
.v3-ann-acts .btn { flex: 1; }
.v3-ann-where { margin: 18px 0 0; padding: 0; border: 0; }
.v3-ann-where legend { font-size: 14px; float: none; width: auto; }
.v3-ann-switches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px 16px; }
.v3-ann-img { display: block; background: var(--v3-surface-2); }
.v3-ann-img img { width: 100%; height: 100%; object-fit: contain; display: block; }

/* 45. Rapor / liste sayfalari (v3ify ile cevrilen Velzon sablonlari) */
.v3-ext-bar > input.form-control[data-provider], .v3-ext-bar > .flatpickr-input { width: 240px; flex: none; }
.v3-ext-bar > select.form-control, .v3-ext-bar > .choices { width: 220px; flex: none; }
.v3-ext-bar > .btn { flex: none; }
.card > .v3-card-h + .card-body { padding-top: 16px; }
.v3-card-h > .flex-shrink-0, .v3-card-h > div:last-child:not(:first-child) { display: flex; align-items: center; gap: 8px; }
h2.v3-sub { font-size: 13px; font-weight: 600; color: var(--vz-heading-color); margin: 0 0 10px; }
@media (max-width: 767.98px) { .v3-ext-bar > input.form-control[data-provider], .v3-ext-bar > .flatpickr-input, .v3-ext-bar > select.form-control, .v3-ext-bar > .choices { width: 100%; } }

/* 46. Bos durumlar: veri gelmeyen tablolar (ana sayfa "en cok satanlar" vb.) */
.table-responsive:has(> .v3-top > tbody:empty)::after { content: "Bu dönemde kayıt yok."; display: block; padding: 14px 20px 18px; font-size: 13px; color: var(--vz-secondary-color); }

/* 47. Gruplara gore satis / siparis raporu: grup basina tek kart (liste + pasta + sutun) */
.v3-grp-body { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(240px, 0.9fr) minmax(320px, 1.4fr); }
.v3-grp-body > div { min-width: 0; padding: 14px 20px; }
.v3-grp-body > div + div { border-left: 1px solid var(--vz-border-color); }
.v3-grp-list { max-height: 330px; overflow: auto; }
.v3-grp-list tfoot th { border-bottom: 0; border-top: 1px solid var(--vz-border-color); font-weight: 600; color: var(--vz-heading-color); }
.v3-grp-list .v3-m { padding: 6px 0; }
.v3-grp-chart { min-height: 300px; position: relative; }
@media (max-width: 1199.98px) {
    .v3-grp-body { grid-template-columns: 1fr 1fr; }
    .v3-grp-body > .v3-grp-list { grid-column: 1 / -1; max-height: none; }
    .v3-grp-body > div + div { border-left: 0; border-top: 1px solid var(--vz-border-color); }
    .v3-grp-body > div + div + div { border-left: 1px solid var(--vz-border-color); }
}
@media (max-width: 767.98px) {
    .v3-grp-body { grid-template-columns: 1fr; }
    .v3-grp-body > div + div + div { border-left: 0; }
    .v3-grp-chart { min-height: 260px; padding: 12px; }
}

/* 48. Filtre cubugunda bootstrap-select (bekleyen kalem / urun bazli satis raporlari) */
.v3-ext-bar > .bootstrap-select { flex: 1 1 280px; max-width: 460px; width: auto !important; }
.v3-ext-bar > .bootstrap-select > .dropdown-toggle { min-height: 38px; border-radius: var(--v3-r-sm, 8px); background: var(--vz-input-bg, var(--vz-secondary-bg)); }
@media (max-width: 767.98px) { .v3-ext-bar > .bootstrap-select { max-width: none; flex-basis: 100%; } }

/* 49. Logo fatura karsilastirma: ozet seridi hucreleri filtre dugmesi, sekme + arama satiri */
.v3-cmp > button.v3-cell { display: block; text-align: left; background: none; border: 0; border-right: 1px solid var(--vz-border-color); font: inherit; color: inherit; cursor: pointer; position: relative; }
.v3-cmp > button.v3-cell:last-child { border-right: 0; }
.v3-cmp > button.v3-cell > span { display: block; }
.v3-cmp > button.v3-cell:hover { background: var(--v3-surface-2, var(--vz-light)); }
.v3-cmp > button.v3-cell.active { box-shadow: inset 0 -2px 0 var(--vz-primary); }
.v3-cmp .v3-lbl em { font-style: normal; font-size: 11.5px; color: var(--vz-primary); margin-left: 6px; }
.v3-cmp-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 0 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-cmp-bar .v3-inv-tabs { border-bottom: 0; flex: 1 1 auto; }
.v3-cmp-bar .v3-inv-search { flex: 0 1 300px; margin: 10px 0; }
@media (max-width: 767.98px) { .v3-cmp-bar { padding: 0 12px; } .v3-cmp-bar .v3-inv-search { flex-basis: 100%; } }
.v3-inv-tabs .v3-n { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 10px; font-size: 11px; line-height: 18px; text-align: center; background: var(--v3-surface-2, var(--vz-light)); color: var(--vz-secondary-color); }

/* 50. Choices: kutuphanenin genis ekranda "Press to select" icin biraktigi 100px sag bosluk.
   Velzon app.css bunu eziyordu; o kalkinca dar kutularda (siparis durumu) secenekler harf harf alt alta diziliyordu. */
.choices__list--dropdown .choices__item--selectable, .choices__list[aria-expanded] .choices__item--selectable { padding-right: 10px !important; }
.choices__list--dropdown .choices__item--selectable::after, .choices__list[aria-expanded] .choices__item--selectable::after { display: none !important; }
.choices__list--dropdown, .choices__list[aria-expanded] { min-width: 100%; word-break: normal !important; }
.v3-od-status .choices { width: 100%; }

/* 51. Siparis detayi yan paneli: sade urun ozeti (foto, ad, adet x birim fiyat, isk.1, toplam) */
.v3-od-lines { list-style: none; margin: 0; padding: 0; }
.v3-od-lines > li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-od-lines > li:last-child { border-bottom: 0; }
.v3-od-ph { display: block; width: 44px; height: 56px; border-radius: 6px; border: 1px solid var(--vz-border-color); background: var(--v3-surface-2, var(--vz-light)); overflow: hidden; }
.v3-od-ph img { display: block; width: 100%; height: 100%; object-fit: contain; }
.v3-od-ln { min-width: 0; }
.v3-od-ln b { display: block; font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--vz-heading-color); }
.v3-od-ln span { display: block; margin-top: 2px; font-size: 12.5px; color: var(--vz-secondary-color); }
.v3-od-lt { font-size: 14px; font-weight: 650; color: var(--vz-heading-color); white-space: nowrap; }
.v3-od-note { padding: 14px 20px; }
.v3-od-note h3 { font-size: 13px; font-weight: 600; margin: 0 0 4px; }
.v3-od-note p { margin: 0; font-size: 13px; color: var(--vz-body-color); white-space: pre-line; }
@media (max-width: 575.98px) { .v3-od-lines > li { padding: 10px 14px; gap: 10px; } }
/* tam sayfa tablosunda dik kapak gorselleri kare kutuda kayik duruyordu: kapak oraninda cerceve */
.v3-od-table .v3-dt-photo a { display: block; width: 40px; height: 52px; border-radius: 6px; border: 1px solid var(--vz-border-color); background: var(--v3-surface-2, var(--vz-light)); overflow: hidden; }
.v3-od-table .v3-dt-photo img { display: block; width: 100% !important; height: 100% !important; object-fit: contain; margin: 0 !important; }
.v3-od-table.v3-dt > tbody > tr > .v3-dt-photo { height: auto !important; }

/* 52. Urun fotograflari (Manage/ProductImage): kapak cercevesi, islem dugmeleri, yukleme / silme pencereleri */
.v3-pimg { display: block; width: 44px; height: 56px; border-radius: 6px; border: 1px solid var(--vz-border-color); background: var(--v3-surface-2, var(--vz-light)); overflow: hidden; }
.v3-pimg img { display: block; width: 100%; height: 100%; object-fit: contain; }
.v3-pimg-acts { display: flex; gap: 6px; }
.v3-pimg-acts .btn { display: inline-flex; align-items: center; white-space: nowrap; }
.v3-pimg-cur:empty { display: none; }
.v3-pimg-cur > div, .v3-pimg-del > div { display: block !important; }
.v3-pimg-cur a, .v3-pimg-del label { display: block; height: 140px; border: 1px solid var(--vz-border-color); border-radius: 8px; background: var(--v3-surface-2, var(--vz-light)); overflow: hidden; }
.v3-pimg-cur img, .v3-pimg-del img { display: block; width: 100% !important; height: 100% !important; object-fit: contain; }
.v3-pimg-del .form-check { position: relative; padding: 0; margin: 0; }
.v3-pimg-del .form-check-input { position: absolute; top: 8px; left: 8px; margin: 0; z-index: 2; width: 18px; height: 18px; }
.v3-pimg-del .form-check-label { cursor: pointer; }
.v3-pimg-del .form-check-input:checked + label { border-color: var(--vz-danger); box-shadow: 0 0 0 2px rgba(var(--vz-danger-rgb), .2); }
.v3-drop { border: 1.5px dashed var(--vz-border-color) !important; border-radius: 10px; background: var(--v3-surface-2, var(--vz-light)) !important; min-height: 0 !important; padding: 22px 16px !important; }
.v3-drop .dz-message { margin: 0 !important; display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
.v3-drop .dz-message i { font-size: 28px; color: var(--vz-secondary-color); }
.v3-drop .dz-message b { font-size: 14px; font-weight: 600; color: var(--vz-heading-color); }
.v3-drop .dz-message span { font-size: 12px; color: var(--vz-secondary-color); }
.modal-header .modal-title + .v3-m, .modal-header .v3-m { font-size: 12.5px; }

/* 53. Liste ustundeki toplam satiri (Stoklar, Borc alacak): mavi blok yerine sade ozet satiri */
.table > thead > tr.v3-sum-row > *, .table > tbody > tr.v3-sum-row > *, tr.v3-sum-row > td, tr.v3-sum-row > th { background: var(--v3-surface-2, var(--vz-light)) !important; color: var(--vz-heading-color) !important; font-weight: 600; }

/* 54. Kullanicilar (User/AllUser) ve bos durum dugmesi */
.v3-uname { display: flex; align-items: center; gap: 10px; min-width: 180px; }
.v3-uname img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: none; background: var(--v3-surface-2, var(--vz-light)); }
.v3-uname b { font-weight: 600; color: var(--vz-heading-color); }
.v3-role { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; background: var(--v3-surface-2, var(--vz-light)); color: var(--vz-body-color); white-space: nowrap; }
.v3-user-acts { display: inline-flex; gap: 6px; flex-wrap: nowrap; }
.v3-user-acts .btn { display: inline-flex; align-items: center; white-space: nowrap; }
.v3-empty > .btn, .v3-empty > a.btn { align-self: center; margin-top: 10px; }
.v3-rcv-table tbody tr.plasiyer-row { cursor: pointer; }
@media (hover: hover) { .v3-rcv-table tbody tr.plasiyer-row:hover > td { background: var(--v3-surface-2, var(--vz-light)); } }

/* 55. Siparisler listesi: durum sekmeleri (b2b-chip -> alt cizgili sekme), canli ozet, arac satiri */
.v3-ord-bar { display: flex; align-items: center; gap: 12px; padding: 0 20px; border-bottom: 1px solid var(--vz-border-color); }
.v3-chips { display: flex; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; gap: 4px; }
.v3-chips::-webkit-scrollbar { display: none; }
.v3-chips .b2b-chip { border: 0; border-radius: 0; background: none; box-shadow: none !important; transform: none !important; padding: 13px 10px 11px; font-size: 13.5px; font-weight: 500; color: var(--vz-secondary-color); border-bottom: 2px solid transparent; }
.v3-chips .b2b-chip:hover { color: var(--vz-heading-color); }
.v3-chips .b2b-chip.is-active { background: none; color: var(--vz-heading-color); border-bottom-color: var(--vz-primary); font-weight: 600; }
.v3-chips .b2b-chip__count, .v3-chips .b2b-chip.is-active .b2b-chip__count { background: var(--v3-surface-2, var(--vz-light)); color: var(--vz-secondary-color); font-weight: 600; }
.v3-ord-sum { display: flex; align-items: baseline; gap: 10px; flex: none; font-size: 13px; color: var(--vz-secondary-color); white-space: nowrap; }
.v3-ord-sum b { color: var(--vz-heading-color); font-weight: 600; }
.v3-ord-sum small { font-size: 11.5px; }
.v3-ord-tools { padding: 12px 20px; margin: 0 !important; border-bottom: 1px solid var(--vz-border-color); }
.v3-ord-tools .v3-inv-search { flex: 0 1 340px; }
@media (max-width: 767.98px) {
    .v3-ord-bar { flex-direction: column; align-items: stretch; gap: 0; padding: 0 12px; }
    .v3-ord-sum { padding: 8px 0; border-top: 1px solid var(--vz-border-color); }
    .v3-ord-tools { padding: 10px 12px; }
    .v3-ord-tools .v3-inv-search { flex-basis: 100%; }
}

/* 56. Rapor dip toplami ve hizli erisim bos durumu */
.table > tfoot.v3-sum-foot > tr > * { background: var(--v3-surface-2, var(--vz-light)); color: var(--vz-heading-color); font-weight: 600; border-bottom: 0; }
.v3-qa-empty { padding: 18px 16px; text-align: center; font-size: 13px; color: var(--vz-secondary-color); }
.v3-qa-empty > i:first-child { display: block; font-size: 22px; margin-bottom: 6px; }

/* 57. ECharts (b2b-chart.js): bos durum ve kapsayici */
.b2b-chart { width: 100%; min-height: 120px; }
.v3-chart-empty { margin: 0; padding: 56px 16px; text-align: center; font-size: 13px; color: var(--vz-secondary-color); }
@media (min-width: 768px) { .v3-ext td.num, .v3-ext th { white-space: nowrap; } }

/* 58. Siparis Ver galerisi: tek filtre satiri (telefonda "Filtreler" ile acilir) */
.v3-gal-filter { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; margin: 0 0 16px; }
.v3-gal-filter > .bootstrap-select { flex: 0 1 200px; width: auto !important; }
.v3-gal-filter > .bootstrap-select > .dropdown-toggle { min-height: 38px; background: var(--vz-card-bg); }
.v3-gal-filter > .btn { flex: none; }
.v3-gal-filter.is-collapsible { display: none; padding: 12px; border: 1px solid var(--vz-border-color); border-radius: 10px; background: var(--vz-card-bg); }
.v3-gal-filter.is-collapsible.open { display: flex; }
@media (max-width: 767.98px) {
    .v3-gal-filter > .bootstrap-select { flex: 1 1 calc(50% - 4px); }
    .v3-gal-filter > .btn { flex: 1 1 100%; }
}
#filterToggleBtn.active { background: var(--vz-primary); border-color: var(--vz-primary); color: #fff; }

/* 59. Bayi anasayfasi: grafik + kampanya gorseli yan yana, marka / grup satis iki sutun */
.v3-dash-top, .v3-dash-one { display: grid; gap: 24px; margin: 24px 0; }
.v3-dash-top { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.v3-dash-row { margin-bottom: 24px; }
@media (max-width: 1199.98px) { .v3-dash-top { grid-template-columns: 1fr; } }
@media (max-width: 767.98px) { .v3-dash-top, .v3-dash-one { gap: 16px; margin: 16px 0; } .v3-dash-row { margin-bottom: 16px; } }
.v3-acct .v3-big .b2b-status { font-size: 12px; letter-spacing: 0; transform: translateY(-4px); }
@media (max-width: 767.98px) { .v3-acct .v3-strip > .v3-acct-bal { grid-column: 1 / -1; border-right: 0; } .v3-acct .v3-strip > .v3-acct-bal ~ * { border-right: 1px solid var(--vz-border-color); } .v3-acct .v3-strip > .v3-acct-bal ~ :nth-child(odd) { border-right: 0; } }
.v3-ann-acts .btn.v3-ann-del { flex: none; width: 34px; padding-left: 0; padding-right: 0; justify-content: center; }

/* 60. Admin anasayfa: plasiyer basliginda tutar ayni satirda; halka + son 6 kayit kartlari esit boy */
#plasiyer .v3-card-h { flex-wrap: wrap; row-gap: 10px; }
#plasiyer .v3-card-h h2 { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; min-width: 0; }
#plasiyer .v3-card-h h2 .v3-tot { margin-left: 0; }
#plasiyer .v3-card-h h2 .v3-hint { display: none; }   /* secili donem zaten sagdaki dugmede gorunuyor */
.v3-grid-side.v3-eq { align-items: stretch; }
.v3-grid-side.v3-eq > .card { display: flex; flex-direction: column; }
.v3-grid-side.v3-eq > .card > .card-body { flex: 1; display: flex; align-items: center; }
.v3-grid-side.v3-eq > .card > .card-body > div { flex: 1; min-width: 0; }
/* Sepet satirlari: her satir kendi izgarasi oldugu icin "auto" sutunlar satirdan satira farkli genislik aliyor, adet ve fiyat sutunlari kayiyordu -> sabit sutun */
@media (min-width: 768px) { .v3-bline-ret { grid-template-columns: 56px minmax(0, 1fr) 250px; } }
@media (max-width: 767.98px) { .v3-bqty .v3-bedit.input-step { flex: 1 1 100%; justify-content: space-between; } .v3-bqty .v3-bedit.input-step > span { font-size: 11.5px; } }

/* 61. Sepet genis ekran: liste yeterince genisse (880px+) satirlar tek sira; Adet | (Isk 1) | Birim fiyat | Net toplam | Sil
   sutunlari basliklariyla hizali. Dar ekranda onceki yigin yerlesim kalir. Kapsayici sorgusu: kenar cubugu / ozet kutusu
   genisligi ne olursa olsun karar liste genisligine gore verilir. */
.v3-blist { container: blist / inline-size; }
.v3-bhead { display: none; }
@container blist (min-width: 880px) {
    .v3-blist .v3-bhead, .v3-blist .v3-bline { display: grid; grid-template-columns: 56px minmax(0, 1fr) 128px 128px 140px 64px; column-gap: 20px; align-items: center; }
    .v3-blist.has-isk .v3-bhead, .v3-blist.has-isk .v3-bline { grid-template-columns: 56px minmax(0, 1fr) 128px 84px 128px 140px 64px; }
    .v3-blist .v3-bhead { padding: 10px 20px; border-bottom: 1px solid var(--vz-border-color); font-size: 11.5px; font-weight: 500; color: var(--vz-secondary-color); }
    .v3-blist .v3-bhead .t-c { text-align: center; }
    .v3-blist .v3-bhead .t-e { text-align: right; }
    .v3-blist .v3-bline > * { grid-row: 1; }
    .v3-blist .v3-bqty, .v3-blist .v3-bprice { display: contents; }
    .v3-blist .v3-bqty > .v3-qstep { grid-column: 3; grid-row: 1; justify-self: center; }
    .v3-blist .v3-bqty > .v3-bedit { grid-column: 4; grid-row: 1; justify-self: end; }
    .v3-blist .v3-bqty > .v3-bedit > span { display: none; }
    .v3-blist .v3-bqty > .v3-bedit input { width: 64px; }
    .v3-blist .v3-bprice > .v3-lbl { display: none; }
    .v3-blist .v3-bprice > .v3-lbl:first-child + * { grid-column: -4 / -3; grid-row: 1; justify-self: end; }
    .v3-blist .v3-bprice > .v3-lbl.mt-2 + * { grid-column: -3 / -2; grid-row: 1; justify-self: end; }
    .v3-blist .v3-bdel { grid-column: -2 / -1; grid-row: 1; justify-self: end; }
    .v3-blist .v3-bprice .v3-bval { text-align: right; }
}

/* 62. Telefonda Siparis Ver yalnizca galeri: Galeri / Liste secimi gosterilmez */
@media (max-width: 767.98px) { .v3-view-switch { display: none !important; } }

/* 63. Galeri / Liste secimi: galeride secili parca <span> oldugu icin stilsiz kaliyordu (dolgu yok, yazi farkli);
   ayrica yanindaki 38px dugmelerle ayni boyda olsun */
.v3-seg > span { border: 0; font-size: 12px; font-weight: 500; padding: 5px 12px; border-radius: 6px; color: var(--vz-secondary-color); display: inline-flex; align-items: center; gap: 6px; }
.v3-seg > a { text-decoration: none; }
.v3-view-switch { height: 38px; align-items: stretch; flex: none; }
.v3-view-switch > span, .v3-view-switch > a { font-size: 13px; padding: 0 12px; white-space: nowrap; }
.v3-view-switch i { font-size: 16px; }
.v3-view-switch > .on { cursor: default; }