@import '_content/Client.Components/Client.Components.arwncvjj5j.bundle.scp.css';

/* _content/Client/Comps/Login2FA.razor.rz.scp.css */
.options-container[b-e71tp2nmzk] {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
    text-align: left;
}

.radio-option[b-e71tp2nmzk] {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .radio-option input[type="radio"][b-e71tp2nmzk] {
        transform: scale(1.2);
    }

    .radio-option label[b-e71tp2nmzk] {
        font-size: 16px;
        cursor: pointer;
    }

/* İleri butonu */
.next-button[b-e71tp2nmzk], .submit-button[b-e71tp2nmzk] {
    margin-top: 25px;
    padding: 12px 25px;
    border-radius: 6px;
    border: none;
    background-color: #007bff;
    color: white;
    font-size: 16px;
    cursor: pointer;
    width: 100%;
    transition: background-color 0.3s;
}

    .next-button:hover[b-e71tp2nmzk], .submit-button:hover[b-e71tp2nmzk] {
        background-color: #0056b3;
    }

    .next-button:disabled[b-e71tp2nmzk] {
        background-color: #ccc;
        cursor: not-allowed;
    }

/* Kod giriş alanları */
.code-input-container[b-e71tp2nmzk] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

    .code-input-container input[b-e71tp2nmzk] {
        width: 40px;
        height: 50px;
        font-size: 24px;
        text-align: center;
        border: 1px solid #ccc;
        border-radius: 4px;
        outline: none;
        transition: border-color 0.2s;
    }

        .code-input-container input:focus[b-e71tp2nmzk] {
            border-color: #007bff;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
        }
/* _content/Client/Pages/Auth/Login.razor.rz.scp.css */
/* ===================== Genel Animasyon ===================== */
@keyframes fadeIn-b-fjt9ldac73 {
    0% {
        opacity: 0;
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideIn-b-fjt9ldac73 {
    0% {
        transform: translateY(-30px);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

/* ===================== Theme Variables ===================== */

/* Sistem dark mode desteği (opsiyonel) */
@media (prefers-color-scheme: dark) {
    body:not([data-theme])[b-fjt9ldac73] {
        --bg-primary: #1a1a1a;
        --bg-secondary: #2d2d2d;
        --text-primary: #e8e8e8;
        --text-secondary: #b0b0b0;
        --border-color: #404040;
        --input-bg: #3a3a3a;
        --input-border: #505050;
        --shadow-color: rgba(0,0,0,0.4);
        --shadow-inset: rgba(0,0,0,0.2);
        --accent-color: #4a9eff;
        --success-bg: #1e3d2a;
        --success-text: #7dd87f;
        --error-bg: #3d1e1e;
        --error-text: #ff7a7a;
        --input-group-bg: #404040;
        --separator-bg: #2d2d2d;
    }
}

/* ===================== Sayfa ve Login Container ===================== */


.login-container[b-fjt9ldac73] {
    border-radius: 16px;
    background-color: var(--bg-secondary);
    box-shadow: 0 12px 40px var(--shadow-color);
    padding: 3rem 2rem;
    max-width: 425px;
    width: 100%;
    animation: fadeIn-b-fjt9ldac73 0.4s ease-out;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

    /* Logo & Title */
    .login-container img[b-fjt9ldac73] {
        height: 100px;
        object-fit: contain;
        filter: brightness(1);
        transition: filter 0.3s ease;
    }

/* Dark tema için logo filtresi */
[data-theme="dark"] .login-container img[b-fjt9ldac73] {
    filter: brightness(0.9) contrast(1.1);
}

@media (prefers-color-scheme: dark) {
    body:not([data-theme]) .login-container img[b-fjt9ldac73] {
        filter: brightness(0.9) contrast(1.1);
    }
}

.login-container .fs-2[b-fjt9ldac73] {
    font-weight: 700;
    color: var(--text-primary);
    transition: color 0.3s ease;
}

.separator[b-fjt9ldac73] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .separator span[b-fjt9ldac73] {
        background-color: var(--separator-bg);
        padding: 0 1rem;
        color: var(--text-secondary);
        transition: all 0.3s ease;
    }

/* ===================== Input Grupları ===================== */
.input-group[b-fjt9ldac73] {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--input-border);
    box-shadow: inset 0 2px 4px var(--shadow-inset);
    transition: all 0.2s;
    margin-bottom: 1.5rem;
    background-color: var(--input-bg);
}

    .input-group input.form-control[b-fjt9ldac73],
    .input-group select.form-select[b-fjt9ldac73] {
        border: none;
        border-radius: 0;
        padding: 0.65rem 0.75rem;
        transition: all 0.2s;
        background-color: var(--input-bg);
        color: var(--text-primary);
    }

        .input-group input.form-control:focus[b-fjt9ldac73],
        .input-group select.form-select:focus[b-fjt9ldac73] {
            outline: none;
            box-shadow: 0 0 0 0.2rem rgba(74, 158, 255, 0.25);
            background-color: var(--input-bg);
            color: var(--text-primary);
        }

        .input-group input.form-control[b-fjt9ldac73]::placeholder {
            color: var(--text-secondary);
            opacity: 0.7;
        }

.input-group-text[b-fjt9ldac73] {
    background-color: var(--input-group-bg);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    transition: all 0.3s ease;
}

/* Select dropdown için özel stil */
.form-select[b-fjt9ldac73] {
    background-color: var(--input-bg);
    color: var(--text-primary);
    border: 1px solid var(--input-border);
    border-radius: 12px;
}

    .form-select option[b-fjt9ldac73] {
        background-color: var(--input-bg);
        color: var(--text-primary);
    }

/* ===================== Checkbox ve Linkler ===================== */
.form-check-input[b-fjt9ldac73] {
    width: 1.25rem;
    height: 1.25rem;
    background-color: var(--input-bg);
    border-color: var(--input-border);
    transition: all 0.2s ease;
}

    .form-check-input:checked[b-fjt9ldac73] {
        background-color: var(--accent-color);
        border-color: var(--accent-color);
    }

    .form-check-input:focus[b-fjt9ldac73] {
        box-shadow: 0 0 0 0.2rem rgba(74, 158, 255, 0.25);
    }

.form-check-label[b-fjt9ldac73] {
    font-weight: 600;
    margin-left: 0.25rem;
    color: var(--text-primary);
    transition: color 0.3s ease;
}

.text-primary[b-fjt9ldac73] {
    color: var(--accent-color) !important;
    transition: color 0.3s ease;
}

    .text-primary:hover[b-fjt9ldac73] {
        text-decoration: underline;
        color: var(--accent-color) !important;
        filter: brightness(1.1);
    }

/* ===================== Buttons ===================== */
.DxButton[b-fjt9ldac73],
.modal .btn-primary[b-fjt9ldac73] {
    width: 100%;
    background: var(--accent-color);
    color: #fff !important;
    border: none;
    border-radius: 12px;
    padding: 0.65rem 0;
    font-weight: 600;
    font-size: 1.1rem;
    transition: all 0.3s;
}

    .DxButton:hover[b-fjt9ldac73],
    .modal .btn-primary:hover[b-fjt9ldac73] {
        filter: brightness(1.15);
        background: var(--accent-color);
        transform: translateY(-1px);
    }

/* ===================== Modallar ===================== */
.modal-dialog[b-fjt9ldac73] {
    max-width: 450px;
    margin: 1.75rem auto;
}

.modal-content[b-fjt9ldac73] {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 40px var(--shadow-color);
    border: 1px solid var(--border-color);
    animation: slideIn-b-fjt9ldac73 0.3s ease-out;
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.modal-header[b-fjt9ldac73] {
    background: var(--accent-color);
    color: #fff;
    border-bottom: none;
    justify-content: center;
    text-align: center;
    padding: 1.2rem 1rem;
}

.modal-title[b-fjt9ldac73] {
    font-weight: 700;
    font-size: 1.4rem;
    color: #fff !important;
}

.btn-close[b-fjt9ldac73] {
    position: absolute;
    top: 12px;
    right: 12px;
    filter: invert(1);
}

/* Modal mesaj kutusu */
.modal-info-box[b-fjt9ldac73] {
    display: flex;
    align-items: center;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    margin-bottom: 1.2rem;
    font-size: 0.95rem;
}

.modal-info-success[b-fjt9ldac73] {
    background-color: var(--success-bg);
    color: var(--success-text);
    border: 1px solid var(--success-text);
}

.modal-info-error[b-fjt9ldac73] {
    background-color: var(--error-bg);
    color: var(--error-text);
    border: 1px solid var(--error-text);
}

.modal-info-box i[b-fjt9ldac73] {
    font-size: 1.6rem;
    margin-right: 0.75rem;
}

/* Modal form inputları */
.modal .form-label[b-fjt9ldac73] {
    font-weight: 600;
    margin-bottom: 0.3rem;
    color: var(--text-primary);
    transition: color 0.3s ease;
}

.modal .form-control[b-fjt9ldac73] {
    border-radius: 12px;
    border: 1px solid var(--input-border);
    padding: 0.55rem 0.75rem;
    transition: all 0.2s;
    background-color: var(--input-bg);
    color: var(--text-primary);
}

    .modal .form-control:focus[b-fjt9ldac73] {
        border-color: var(--accent-color);
        box-shadow: 0 0 0 0.2rem rgba(74, 158, 255, 0.25);
        background-color: var(--input-bg);
        color: var(--text-primary);
    }

    .modal .form-control[b-fjt9ldac73]::placeholder {
        color: var(--text-secondary);
        opacity: 0.7;
    }

/* Modal footer */
.modal-footer[b-fjt9ldac73] {
    border-top: 1px solid var(--border-color);
    padding: 1rem 1.5rem;
    justify-content: center;
    background-color: var(--bg-secondary);
}

/* Input spacing in modal */
.modal .mb-3 input + input[b-fjt9ldac73] {
    margin-top: 0.7rem;
}

/* ===================== Responsive ===================== */
@media (max-width: 576px) {
    .login-container[b-fjt9ldac73] {
        padding: 2rem 1.5rem;
    }
}

/* Mobil ve tablet (1024px ve altı) - SADECE font büyütme */
@media (max-width: 1024px) {
    /* Sadece form elemanlarının font büyüklüğü */
    .login-container .form-control[b-fjt9ldac73],
    .login-container .form-select[b-fjt9ldac73],
    .login-container .input-group-text[b-fjt9ldac73],
    .login-container .form-check-label[b-fjt9ldac73],
    .login-container a[b-fjt9ldac73],
    .login-container .btn[b-fjt9ldac73] {
        font-size: 2em !important;
    }
}

/* ===================== Theme Toggle Button (Opsiyonel) ===================== */
.theme-toggle[b-fjt9ldac73] {
    position: fixed;
    top: 20px;
    right: 20px;
    background: var(--accent-color);
    color: white;
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    font-size: 1.2rem;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px var(--shadow-color);
    z-index: 1000;
}

    .theme-toggle:hover[b-fjt9ldac73] {
        transform: scale(1.1);
        filter: brightness(1.15);
    }

/* Dark theme için scroll bar */
[data-theme="dark"][b-fjt9ldac73] {
    scrollbar-color: var(--border-color) var(--bg-primary);
}

    [data-theme="dark"] [b-fjt9ldac73]::-webkit-scrollbar {
        width: 8px;
    }

    [data-theme="dark"] [b-fjt9ldac73]::-webkit-scrollbar-track {
        background: var(--bg-primary);
    }

    [data-theme="dark"] [b-fjt9ldac73]::-webkit-scrollbar-thumb {
        background-color: var(--border-color);
        border-radius: 4px;
    }

        [data-theme="dark"] [b-fjt9ldac73]::-webkit-scrollbar-thumb:hover {
            background-color: var(--text-secondary);
        }
/* _content/Client/Pages/Comps/Dashboard/FinancialMetrics/FinancalMetrics.razor.rz.scp.css */
:root[b-vumasayla0] {
    /* Chart Color Palette - JavaScript ile uyumlu */
    --chart-primary: #6ba1d8; /* Soft Blue */
    --chart-success: #59b8a5; /* Mint */
    --chart-warning: #edc127; /* Gold Yellow */
    --chart-secondary: #d09fe7; /* Lilac */
    --chart-danger: #d2886f; /* Clay */
    --chart-info: #6ba1d8; /* Primary ile tutarlı */
    /* Brand Colors - Mevcut chart renklerini kullan */
    --primary: #6ba1d8;
    --primary-light: rgba(107, 161, 216, 0.15);
    --secondary: #d09fe7;
    --secondary-light: rgba(208, 159, 231, 0.15);
    --success: #59b8a5;
    --success-light: rgba(89, 184, 165, 0.15);
    --info: #6ba1d8;
    --info-light: rgba(107, 161, 216, 0.15);
    --warning: #edc127;
    --warning-light: rgba(237, 193, 39, 0.15);
    --danger: #d2886f;
    --danger-light: rgba(210, 136, 111, 0.15);
    /* Chart Specific Colors */
    --chart-color-1: #6ba1d8;
    --chart-color-2: #59b8a5;
    --chart-color-3: #edc127;
    --chart-color-4: #d09fe7;
    --chart-color-5: #d2886f;
    --chart-color-6: #4cc9f0;
    --chart-color-7: #ff6b6b;
    --chart-color-8: #4ecdc4;
    --chart-color-9: #45b7d1;
    --chart-color-10: #96ceb4;
    /* Light Theme Variables */
    --bg-color: #f8f9fa;
    --card-bg: #ffffff;
    --text-primary: #212529;
    --text-secondary: #6c757d;
    --text-muted: #9EA7AC;
    --border-color: rgba(0, 0, 0, 0.05);
    --border-light: #e9ecef;
    --shadow-light: 0 0.5rem 1rem rgba(107, 161, 216, 0.08);
    --shadow-hover: 0 0.75rem 1.5rem rgba(107, 161, 216, 0.12);
    --shadow-strong: 0 8px 25px rgba(107, 161, 216, 0.15);
    --gradient-bg: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    --gradient-primary: linear-gradient(135deg, var(--chart-primary) 0%, var(--chart-secondary) 100%);
    --gradient-success: linear-gradient(135deg, var(--chart-success) 0%, #51cf66 100%);
    --gradient-warning: linear-gradient(135deg, var(--chart-warning) 0%, #ffd43b 100%);
    --gradient-danger: linear-gradient(135deg, var(--chart-danger) 0%, #ff8a80 100%);
}

/* Dark Theme */
[data-bs-theme="dark"][b-vumasayla0],
body.dark-theme[b-vumasayla0],
body[data-theme="dark"][b-vumasayla0] {
    --bg-color: #0d1117;
    --card-bg: #161b22;
    --text-primary: #f0f6fc;
    --text-secondary: #8b949e;
    --text-muted: #6c757d;
    --border-color: rgba(240, 246, 252, 0.1);
    --border-light: rgba(240, 246, 252, 0.15);
    --shadow-light: 0 0.5rem 1rem rgba(0, 0, 0, 0.3);
    --shadow-hover: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.4);
    --shadow-strong: 0 8px 25px rgba(0, 0, 0, 0.25);
    --gradient-bg: linear-gradient(135deg, #161b22 0%, #0d1117 100%);
}

/* Base Styles */
body[b-vumasayla0] {
    background-color: var(--bg-color);
    color: var(--text-primary);
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    transition: all 0.3s ease;
    margin-top:10px;
}

.dashboard-container[b-vumasayla0] {
    padding: 2rem 0;
}

/* Metric Cards - Chart renklerine uyumlu */
.metric-card[b-vumasayla0] {
    background: var(--gradient-bg);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    box-shadow: var(--shadow-light);
    margin-bottom: 1.5rem;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

    .metric-card[b-vumasayla0]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: var(--gradient-primary);
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .metric-card:hover[b-vumasayla0] {
        transform: translateY(-4px);
        box-shadow: var(--shadow-strong);
        border-color: var(--primary-light);
    }

        .metric-card:hover[b-vumasayla0]::before {
            opacity: 1;
        }

/* Card Headers and Bodies */
.card-header[b-vumasayla0] {
    background-color: var(--card-bg);
    border-bottom: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 1rem 1.25rem;
    font-weight: 600;
}

.card-body[b-vumasayla0] {
    background-color: var(--card-bg);
    color: var(--text-primary);
    padding: 1.5rem;
}

/* Metric Values and Labels - Direct color */
.metric-value[b-vumasayla0] {
    font-size: 2rem;
    font-weight: 700;
    color: #6ba1d8 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.5rem;
    font-family: 'Inter', sans-serif;
}

.metric-label[b-vumasayla0] {
    font-size: 0.9rem;
    color: #6c757d !important;
    text-align: center;
    font-weight: 500;
}

/* Icon Styles - Chart renk paleti ile uyumlu */
.icon-bg[b-vumasayla0] {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    margin-right: 15px;
    font-weight: 900;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

    .icon-bg[b-vumasayla0]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: inherit;
        opacity: 0.1;
        transition: opacity 0.3s ease;
    }

    .icon-bg:hover[b-vumasayla0]::before {
        opacity: 0.2;
    }

.metric-icon[b-vumasayla0] {
    font-size: 1.5rem;
    z-index: 1;
    position: relative;
}

/* Icon Background Colors - Direct colors for visibility */
.bg-blue-light[b-vumasayla0] {
    background: linear-gradient(135deg, #6ba1d8 0%, #d09fe7 100%) !important;
    color: white !important;
}

.bg-green-light[b-vumasayla0] {
    background: linear-gradient(135deg, #59b8a5 0%, #51cf66 100%) !important;
    color: white !important;
}

.bg-red-light[b-vumasayla0] {
    background: linear-gradient(135deg, #d2886f 0%, #ff8a80 100%) !important;
    color: white !important;
}

.bg-yellow-light[b-vumasayla0] {
    background: linear-gradient(135deg, #edc127 0%, #ffd43b 100%) !important;
    color: white !important;
}

.bg-purple-light[b-vumasayla0] {
    background: linear-gradient(135deg, #d09fe7 0%, #a855f7 100%) !important;
    color: white !important;
}

/* Badge Styles - Direct colors for visibility */
.icon-badge[b-vumasayla0] {
    width: 60px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    margin-right: 15px;
}

.badge[b-vumasayla0] {
    padding: 0.55rem 0.85rem;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    transition: all 0.3s ease;
}

.bg-blue-2[b-vumasayla0] {
    background-color: #6ba1d8 !important;
    color: white !important;
}

.bg-red-1[b-vumasayla0] {
    background-color: #d2886f !important;
    color: white !important;
}

.bg-green-1[b-vumasayla0] {
    background-color: #59b8a5 !important;
    color: white !important;
}

/* Progress Bars - Direct colors for visibility */
.progress[b-vumasayla0] {
    height: 0.75rem;
    border-radius: 0.5rem;
    margin-bottom: 0.5rem;
    background-color: #e9ecef !important;
    overflow: hidden;
}

.progress-bar[b-vumasayla0] {
    border-radius: 0.5rem;
    transition: width 0.6s ease;
}

    .progress-bar.bg-success[b-vumasayla0] {
        background: linear-gradient(90deg, #59b8a5, #51cf66) !important;
    }

    .progress-bar.bg-danger[b-vumasayla0] {
        background: linear-gradient(90deg, #d2886f, #ff8a80) !important;
    }

    .progress-bar.bg-warning[b-vumasayla0] {
        background: linear-gradient(90deg, #edc127, #ffd43b) !important;
    }

.dual-progress[b-vumasayla0] {
    height: 0.75rem;
    width: 100%;
    background-color: #e9ecef !important;
    border-radius: 8px;
    display: flex;
    overflow: hidden;
    position: relative;
}

.credit[b-vumasayla0] {
    background: #28f87c !important; /* Alacak */
    transition: width 0.6s ease;
}

.debt[b-vumasayla0] {
    background: #f8285a !important; /* Borç */
    transition: width 0.6s ease;
}



/* Chart Containers - Geliştirilmiş tasarım */
.trends-chart-container[b-vumasayla0] {
    height: 100%;
    min-height: 650px;
    width: 100%;
    position: relative;
    background: transparent;
    border-radius: 12px;
}

.donut-container[b-vumasayla0] {
    position: relative;
    width: 100%;
    height: 380px;
    background: transparent;
    border-radius: 12px;
}

/* Chart Specific Containers */
#DashboardProfitChart[b-vumasayla0],
#DashboardPieChart[b-vumasayla0],
#KategoriSatisChart[b-vumasayla0],
#CokSatilanMalzemeChart[b-vumasayla0],
#CokSatisYapilanMusteriChart[b-vumasayla0],
#HesapPortfoyGaugeChart[b-vumasayla0] {
    width: 100%;
    height: 100%;
    background: transparent;
    border-radius: 8px;
}

/* Chart Dark Mode Support */
[data-bs-theme="dark"] #DashboardProfitChart[b-vumasayla0],
[data-bs-theme="dark"] #DashboardPieChart[b-vumasayla0],
[data-bs-theme="dark"] #KategoriSatisChart[b-vumasayla0],
[data-bs-theme="dark"] #CokSatilanMalzemeChart[b-vumasayla0],
[data-bs-theme="dark"] #CokSatisYapilanMusteriChart[b-vumasayla0],
[data-bs-theme="dark"] #HesapPortfoyGaugeChart[b-vumasayla0],
body.dark-theme #DashboardProfitChart[b-vumasayla0],
body.dark-theme #DashboardPieChart[b-vumasayla0],
body.dark-theme #KategoriSatisChart[b-vumasayla0],
body.dark-theme #CokSatilanMalzemeChart[b-vumasayla0],
body.dark-theme #CokSatisYapilanMusteriChart[b-vumasayla0],
body.dark-theme #HesapPortfoyGaugeChart[b-vumasayla0],
body[data-theme="dark"] #DashboardProfitChart[b-vumasayla0],
body[data-theme="dark"] #DashboardPieChart[b-vumasayla0],
body[data-theme="dark"] #KategoriSatisChart[b-vumasayla0],
body[data-theme="dark"] #CokSatilanMalzemeChart[b-vumasayla0],
body[data-theme="dark"] #CokSatisYapilanMusteriChart[b-vumasayla0],
body[data-theme="dark"] #HesapPortfoyGaugeChart[b-vumasayla0] {
    background-color: transparent;
}

/* Typography - Chart renklerine uyumlu */
h1[b-vumasayla0], h2[b-vumasayla0], h3[b-vumasayla0], h4[b-vumasayla0], h5[b-vumasayla0], h6[b-vumasayla0] {
    color: var(--text-primary);
    font-weight: 600;
}

.text-muted[b-vumasayla0] {
    color: var(--text-secondary) !important;
}

/* Text Colors - Direct colors for visibility */
.text-success[b-vumasayla0] {
    color: #59b8a5 !important;
}

.text-danger[b-vumasayla0] {
    color: #d2886f !important;
}

.text-warning[b-vumasayla0] {
    color: #edc127 !important;
}

.text-primary[b-vumasayla0] {
    color: #6ba1d8 !important;
}

/* Dark Mode Text Overrides */
[data-bs-theme="dark"] .text-dark[b-vumasayla0],
body.dark-theme .text-dark[b-vumasayla0],
body[data-theme="dark"] .text-dark[b-vumasayla0] {
    color: var(--text-primary) !important;
}

[data-bs-theme="dark"] .border[b-vumasayla0],
body.dark-theme .border[b-vumasayla0],
body[data-theme="dark"] .border[b-vumasayla0] {
    border-color: var(--border-color) !important;
}

/* Portfolio and Account Lists - Direct colors */
.portfolio-list[b-vumasayla0],
.account-list[b-vumasayla0] {
    max-height: 400px;
    overflow-y: auto;
    padding-right: 5px;
}

.portfolio-item[b-vumasayla0],
.portfolio-item[b-vumasayla0],
.account-item[b-vumasayla0] {
    border: 1px solid #e9ecef !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%) !important;
    border-radius: 12px;
    margin-bottom: 0.75rem;
    position: relative;
    overflow: hidden;
}
[data-bs-theme="dark"] .portfolio-item[b-vumasayla0],
[data-bs-theme="dark"] .account-item[b-vumasayla0],
body.dark-theme .portfolio-item[b-vumasayla0],
body.dark-theme .account-item[b-vumasayla0],
body[data-theme="dark"] .portfolio-item[b-vumasayla0],
body[data-theme="dark"] .account-item[b-vumasayla0] {
    background: linear-gradient(135deg, #161b22 0%, #0d1117 100%) !important;
    border-color: rgba(240, 246, 252, 0.15) !important;
}
    [data-bs-theme="dark"] .portfolio-item:hover[b-vumasayla0],
    [data-bs-theme="dark"] .account-item:hover[b-vumasayla0],
    body.dark-theme .portfolio-item:hover[b-vumasayla0],
    body.dark-theme .account-item:hover[b-vumasayla0],
    body[data-theme="dark"] .portfolio-item:hover[b-vumasayla0],
    body[data-theme="dark"] .account-item:hover[b-vumasayla0] {
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
        border-color: rgba(107, 161, 216, 0.3) !important;
    }

    .portfolio-item[b-vumasayla0]::before,
    .account-item[b-vumasayla0]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 3px;
        height: 100%;
        background: #6ba1d8 !important;
        transform: scaleY(0);
        transition: transform 0.3s ease;
    }

    .portfolio-item:hover[b-vumasayla0],
    .account-item:hover[b-vumasayla0] {
        transform: translateY(-2px);
        box-shadow: 0 4px 20px rgba(107, 161, 216, 0.15) !important;
        border-color: rgba(107, 161, 216, 0.3) !important;
    }


        .portfolio-item:hover[b-vumasayla0]::before,
        .account-item:hover[b-vumasayla0]::before {
            transform: scaleY(1);
        }

.portfolio-info h6[b-vumasayla0],
.account-info h6[b-vumasayla0] {
    color: #212529 !important;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 2px;
}

.portfolio-info small[b-vumasayla0] {
    font-size: 11px;
    color: #9EA7AC !important;
}

.portfolio-amount h6[b-vumasayla0],
.account-amount h6[b-vumasayla0] {
    color: #6ba1d8 !important;
    font-size: 14px;
    font-weight: 700;
}

/* Dark Mode Adjustments for Lists */
[data-bs-theme="dark"] .portfolio-item[b-vumasayla0],
[data-bs-theme="dark"] .account-item[b-vumasayla0],
body.dark-theme .portfolio-item[b-vumasayla0],
body.dark-theme .account-item[b-vumasayla0],
body[data-theme="dark"] .portfolio-item[b-vumasayla0],
body[data-theme="dark"] .account-item[b-vumasayla0] {
    background: var(--gradient-bg);
    border-color: var(--border-color);
}

    [data-bs-theme="dark"] .portfolio-item:hover[b-vumasayla0],
    [data-bs-theme="dark"] .account-item:hover[b-vumasayla0],
    body.dark-theme .portfolio-item:hover[b-vumasayla0],
    body.dark-theme .account-item:hover[b-vumasayla0],
    body[data-theme="dark"] .portfolio-item:hover[b-vumasayla0],
    body[data-theme="dark"] .account-item:hover[b-vumasayla0] {
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    }

/* Custom Scrollbars - Direct colors */
.portfolio-list[b-vumasayla0]::-webkit-scrollbar,
.account-list[b-vumasayla0]::-webkit-scrollbar {
    width: 4px;
}

.portfolio-list[b-vumasayla0]::-webkit-scrollbar-track,
.account-list[b-vumasayla0]::-webkit-scrollbar-track {
    background: #e9ecef !important;
    border-radius: 2px;
}

.portfolio-list[b-vumasayla0]::-webkit-scrollbar-thumb,
.account-list[b-vumasayla0]::-webkit-scrollbar-thumb {
    background: #6c757d !important;
    border-radius: 2px;
    transition: background 0.3s ease;
}

    .portfolio-list[b-vumasayla0]::-webkit-scrollbar-thumb:hover,
    .account-list[b-vumasayla0]::-webkit-scrollbar-thumb:hover {
        background: #6ba1d8 !important;
    }

/* Sales Analytics Section */
.sales-analytics-header[b-vumasayla0] {
    margin-bottom: 2rem;
}

    .sales-analytics-header h2[b-vumasayla0] {
        color: var(--text-primary);
        font-weight: 700;
        margin-bottom: 0.5rem;
    }

    .sales-analytics-header .text-muted[b-vumasayla0] {
        color: var(--text-secondary) !important;
        font-size: 1rem;
    }

/* Chart Loading State - Direct colors */
.chart-loading[b-vumasayla0] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 300px;
    color: #6c757d !important;
    font-style: italic;
    font-size: 14px;
}

    .chart-loading i[b-vumasayla0] {
        margin-right: 8px;
        animation: spin-b-vumasayla0 1s linear infinite;
        color: #6ba1d8 !important;
    }

/* Animations */
.fadeInUp[b-vumasayla0] {
    animation: fadeInUp-b-vumasayla0 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes fadeInUp-b-vumasayla0 {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spin-b-vumasayla0 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.animated-counter[b-vumasayla0] {
    transition: all 0.3s ease;
}

/* Chart Card Variants - Farklı chart türleri için */
.chart-card-pie .metric-card[b-vumasayla0] {
    border-left: 4px solid var(--chart-primary);
}

.chart-card-bar .metric-card[b-vumasayla0] {
    border-left: 4px solid var(--chart-success);
}

.chart-card-donut .metric-card[b-vumasayla0] {
    border-left: 4px solid var(--chart-secondary);
}

.chart-card-gauge .metric-card[b-vumasayla0] {
    border-left: 4px solid var(--chart-warning);
}

/* Responsive Design */
@media (max-width: 1200px) {
    .trends-chart-container[b-vumasayla0] {
        min-height: 500px;
    }

    .donut-container[b-vumasayla0] {
        height: 320px;
    }
}

@media (max-width: 768px) {
    .dashboard-container[b-vumasayla0] {
        padding: 1rem 0;
    }

    .metric-card[b-vumasayla0] {
        margin-bottom: 1rem;
    }

    .card-body[b-vumasayla0] {
        padding: 1rem;
    }

    .icon-bg[b-vumasayla0] {
        width: 40px;
        height: 40px;
        margin-right: 10px;
    }

    .metric-icon[b-vumasayla0] {
        font-size: 1.2rem;
    }

    .metric-value[b-vumasayla0] {
        font-size: 1.5rem;
    }

    .portfolio-item[b-vumasayla0],
    .account-item[b-vumasayla0] {
        padding: 0.75rem !important;
        margin-bottom: 0.5rem !important;
    }

    .portfolio-info h6[b-vumasayla0],
    .account-info h6[b-vumasayla0],
    .portfolio-amount h6[b-vumasayla0],
    .account-amount h6[b-vumasayla0] {
        font-size: 12px;
    }

    .portfolio-list[b-vumasayla0],
    .account-list[b-vumasayla0] {
        max-height: 300px;
    }

    .trends-chart-container[b-vumasayla0] {
        min-height: 400px;
    }

    .donut-container[b-vumasayla0] {
        height: 280px;
    }

    /* Chart containers mobile responsive */
    #DashboardProfitChart[b-vumasayla0],
    #DashboardPieChart[b-vumasayla0],
    #KategoriSatisChart[b-vumasayla0],
    #CokSatilanMalzemeChart[b-vumasayla0],
    #CokSatisYapilanMusteriChart[b-vumasayla0],
    #HesapPortfoyGaugeChart[b-vumasayla0] {
        height: auto !important;
        min-height: 280px;
    }
}

@media (max-width: 576px) {
    .metric-value[b-vumasayla0] {
        font-size: 1.25rem;
    }

    .card-body[b-vumasayla0] {
        padding: 0.75rem;
    }

    .trends-chart-container[b-vumasayla0] {
        min-height: 350px;
    }

    .donut-container[b-vumasayla0] {
        height: 250px;
    }

    /* Çok küçük ekranlar için chart boyutları */
    #DashboardProfitChart[b-vumasayla0],
    #DashboardPieChart[b-vumasayla0],
    #KategoriSatisChart[b-vumasayla0],
    #CokSatilanMalzemeChart[b-vumasayla0],
    #CokSatisYapilanMusteriChart[b-vumasayla0],
    #HesapPortfoyGaugeChart[b-vumasayla0] {
        min-height: 250px;
    }
}

/* Chart Tooltip Customization */
.apexcharts-tooltip[b-vumasayla0] {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: var(--shadow-light) !important;
}

.apexcharts-tooltip-title[b-vumasayla0] {
    background: var(--chart-primary) !important;
    color: white !important;
    border-bottom: none !important;
}

/* Chart Legend Customization */
.apexcharts-legend-text[b-vumasayla0] {
    color: var(--text-primary) !important;
}

/* Chart Grid Customization */
.apexcharts-gridline[b-vumasayla0] {
    stroke: var(--border-color) !important;
}

/* Chart Axis Customization */
.apexcharts-xaxis-label[b-vumasayla0],
.apexcharts-yaxis-label[b-vumasayla0] {
    fill: var(--text-secondary) !important;
}
/* Sadece Dark Theme için ekleme - mevcut kodları bozmadan */

/* Portfolio ve Account Item'ları için Dark Theme */
[data-bs-theme="dark"] .portfolio-item[b-vumasayla0],
[data-bs-theme="dark"] .account-item[b-vumasayla0],
body.dark-theme .portfolio-item[b-vumasayla0],
body.dark-theme .account-item[b-vumasayla0],
body[data-theme="dark"] .portfolio-item[b-vumasayla0],
body[data-theme="dark"] .account-item[b-vumasayla0] {
    background: linear-gradient(135deg, #161b22 0%, #0d1117 100%) !important;
    border-color: rgba(240, 246, 252, 0.15) !important;
}

/* Dark theme text renkleri */
[data-bs-theme="dark"] .portfolio-info h6[b-vumasayla0],
[data-bs-theme="dark"] .account-info h6[b-vumasayla0],
body.dark-theme .portfolio-info h6[b-vumasayla0],
body.dark-theme .account-info h6[b-vumasayla0],
body[data-theme="dark"] .portfolio-info h6[b-vumasayla0],
body[data-theme="dark"] .account-info h6[b-vumasayla0] {
    color: #f0f6fc !important;
}

[data-bs-theme="dark"] .portfolio-info small[b-vumasayla0],
body.dark-theme .portfolio-info small[b-vumasayla0],
body[data-theme="dark"] .portfolio-info small[b-vumasayla0] {
    color: #8b949e !important;
}
/* _content/Client/Pages/Comps/Dashboard/FinancialReports/FinancalReports.razor.rz.scp.css */
body[b-pnk7brljnz] {
    font-family: 'Poppins', sans-serif;
    background-color: #f5f7fa;
    color: #495057;
}

/* Cards */
.card[b-pnk7brljnz] {
    border-radius: 12px;
    border: none;
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(0,0,0,.1);
    transition: all 0.3s ease;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

    .card:hover[b-pnk7brljnz] {
        transform: translateY(-5px);
        box-shadow: 0 8px 25px rgba(0,0,0,.18);
    }

.card-header[b-pnk7brljnz] {
    background-color: white;
    border-bottom: 1px solid rgba(0,0,0,.05);
    font-weight: 600;
    padding: 1rem 1.5rem;
}

.card-body[b-pnk7brljnz] {
    padding: 1.5rem;
}

/* Charts */
.chart-container[b-pnk7brljnz] {
    min-height: 250px;
    width: 100%;
}

/* Badges */
.badge[b-pnk7brljnz] {
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-weight: 500;
    font-size: 0.8rem;
}

.bg-blue-2[b-pnk7brljnz] {
    background-color: #4895ef;
}

/* Tabs */
.nav-pills[b-pnk7brljnz] {
    border-radius: 50px;
    background-color: #eaecf0;
    padding: 0.5rem;
    margin-bottom: 2rem;
    display: inline-flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
}
.nav-pills-container-content .nav-pills[b-pnk7brljnz] {
    padding: 0.3rem !important;
}

    .nav-pills .nav-link[b-pnk7brljnz] {
        border-radius: 50px;
        padding: 1rem 2rem;
        font-weight: 500;
        color: #495057;
        margin: 0 0.2rem;
        transition: all 0.3s ease;
    }

        .nav-pills .nav-link:hover[b-pnk7brljnz] {
            color: #4361ee;
        }

        .nav-pills .nav-link.active[b-pnk7brljnz] {
            background: linear-gradient(135deg, #eff6fb 0%, #cfe6f3 100%);
            color: #365672;
            box-shadow: 0 4px 8px rgba(67, 97, 238, 0.3);
        }

/* Tables */
.table-responsive[b-pnk7brljnz] {
    overflow-x: auto;
}

/* Accordion */
.accordion-button:not(.collapsed)[b-pnk7brljnz] {
    background-color: white;
    color: #4361ee;
    box-shadow: none;
}

.accordion-button:focus[b-pnk7brljnz] {
    box-shadow: none;
}

.accordion-button[b-pnk7brljnz]::after {
    background-color: #4895ef;
    border-radius: 50%;
    background-position: center;
    width: 1.5rem;
    height: 1.5rem;
    background-size: 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Chart placeholders */
.chart-placeholder[b-pnk7brljnz] {
    min-height: 200px;
    width: 100%;
    background-color: #f8f9fa;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Custom Section Styles */
.section-header[b-pnk7brljnz] {
    padding: 1.5rem;
    margin-bottom: 2rem;
    text-align: center;
    border-radius: 12px;
    background: linear-gradient(135deg, #eff6fb 0%, #cfe6f3 100%);
    color: #365672;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
}

/* Bullet point styling for tables */
.bullet-point[b-pnk7brljnz] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .nav-pills[b-pnk7brljnz] {
        display: flex;
        justify-content: center;
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
    }
}

.toggle-buttons[b-pnk7brljnz] {
    display: flex;
    gap: 0.5rem;
}

    .toggle-buttons .btn[b-pnk7brljnz] {
        transition: all 0.3s ease;
        border-radius: 50px;
        padding: 0.4rem 1rem;
    }

        .toggle-buttons .btn.active[b-pnk7brljnz] {
            box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        }

.content-section[b-pnk7brljnz] {
    transition: opacity 0.3s ease;
}

    .content-section.d-none[b-pnk7brljnz] {
        display: none !important;
    }

.scrollable-table-wrapper[b-pnk7brljnz] {
    max-height: 250px; 
    overflow-y: auto;
}

.table th[b-pnk7brljnz] {
    font-weight: 600;
    border-top: none;
}

.table td[b-pnk7brljnz] {
    vertical-align: middle;
    padding: 0.75rem 1rem;
}

/* _content/Client/Pages/Comps/Dashboard/SalesCustomersMetrics/SalesCustomersMetrics.razor.rz.scp.css */
body[b-hica9qjses] {
}
/* _content/Client/Pages/Comps/LeftMenu.razor.rz.scp.css */
/* Genel body */
body[b-kxmyguo98h] {
    background-color: #0d1117;
}
#kt_app_sidebar_mobile_toggle.toggleColor[b-kxmyguo98h],
#kt_app_sidebar_mobile_toggle.toggleColor i[b-kxmyguo98h],
#kt_app_sidebar_mobile_toggle.toggleColor i span[b-kxmyguo98h] {
    color: blue !important;
    fill: blue !important;
    font-size:2vh!important;
}



/* Kullanıcı adı ve firma yazısı */
.text-username[b-kxmyguo98h] {
    font-size: 1.15rem !important;
}

.text-firm[b-kxmyguo98h] {
    font-size: 1rem !important;
}

/* Ayar ikonları */
.icon-settings i[b-kxmyguo98h] {
    font-size: 1.5rem;
    color: white;

}


/* Menü arama ikonu */
.menu-search[b-kxmyguo98h] {
    font-size: 3rem;
    color: white;
}


.searchbar-row-delete[b-kxmyguo98h] {
    font-size: 2.5rem;
    color: white;
}
/* Kapatma ikonları (sidebar vs.) */
.menu-icon-close[b-kxmyguo98h] {
    font-size: 2.5rem;
    color: white;
}

/* Responsive ayarlar */

/* Küçük cihazlar (max-width: 768px) */
@media (max-width: 991px) {
    .menu-search[b-kxmyguo98h],
    .searchbar-row-delete[b-kxmyguo98h] {
        font-size: 2.5rem;
    }
    .menu-icon-close[b-kxmyguo98h] {
        font-size: 2.5rem;
    }
    .icon-settings i[b-kxmyguo98h] {
        font-size: 2rem;
    }

    .searchbar-row-delete[b-kxmyguo98h] {
        font-size: 2.5rem;
    }

    .text-username[b-kxmyguo98h] {
        font-size: 2rem !important;
    }

    .text-firm[b-kxmyguo98h] {
        font-size: 1.5rem !important;
    }
    toggleColor[b-kxmyguo98h] {
        color:black !important;
    }
    #kt_app_sidebar_mobile_toggle.toggleColor[b-kxmyguo98h],
    #kt_app_sidebar_mobile_toggle.toggleColor i[b-kxmyguo98h],
    #kt_app_sidebar_mobile_toggle.toggleColor i span[b-kxmyguo98h] {
        color: blue !important;
        fill: blue !important;
        font-size: 2.5vh !important;
    }
}

/* Tablet ve laptop (min-width: 769px) */
@media (min-width: 769px) and (max-width: 991px) {
    .menu-search[b-kxmyguo98h],
    .searchbar-row-delete[b-kxmyguo98h] {
        font-size: 2.25rem;
    }
    .searchbar-row-delete[b-kxmyguo98h] {
        font-size: 2.25rem;
    }
    #kt_app_sidebar_mobile_toggle.toggleColor[b-kxmyguo98h],
    #kt_app_sidebar_mobile_toggle.toggleColor i[b-kxmyguo98h],
    #kt_app_sidebar_mobile_toggle.toggleColor i span[b-kxmyguo98h] {
        color: blue !important;
        fill: blue !important;
        font-size: 3.5vh !important;
    }
}

/* Laptop ve üstü (min-width: 992px) */
@media (min-width: 992px) {
    .menu-search[b-kxmyguo98h] {
        font-size: 2.25rem;
    }

    .menu-icon-close[b-kxmyguo98h] {
        font-size: 2.25rem;
    }
    .searchbar-row-delete[b-kxmyguo98h] {
        font-size: 2.25rem;
    }
}
/* _content/Client/Pages/Dashboard.razor.rz.scp.css */
/* Base Styles */
*[b-l5gg3ooazq] {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Dashboard Header */
.dashboard-header[b-l5gg3ooazq] {
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    position: relative;
}

[data-theme="dark"] .dashboard-header[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.4);
    border: 1px solid rgba(100, 116, 139, 0.4);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

/* Currency Pills */
.currency-pill[b-l5gg3ooazq] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 16px;
    padding: clamp(0.75rem, 2vw, 1.25rem);
    border: 1px solid rgba(255, 255, 255, 0.3);
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    height: 100%;
    margin-right: 1rem !important;
    min-height: clamp(70px, 10vh, 85px);
    display: flex;
    align-items: center;
}



    .currency-pill[b-l5gg3ooazq]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .currency-pill.status-up[b-l5gg3ooazq]::before {
        background: linear-gradient(90deg, #059669, #10b981);
    }

    .currency-pill.status-down[b-l5gg3ooazq]::before {
        background: linear-gradient(90deg, #dc2626, #ef4444);
    }

    .currency-pill.status-neutral[b-l5gg3ooazq]::before {
        background: linear-gradient(90deg, #6b7280, #9ca3af);
    }

    .currency-pill:hover[b-l5gg3ooazq] {
        transform: translateY(-3px);
        background: rgba(255, 255, 255, 0.95);
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
    }

        .currency-pill:hover[b-l5gg3ooazq]::before {
            opacity: 1;
        }
.row > div:last-child .currency-pill[b-l5gg3ooazq] {
    margin-right: 0 !important;
}



[data-theme="dark"] .currency-pill[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.3);
    color: #f3f4f6;
}

    [data-theme="dark"] .currency-pill:hover[b-l5gg3ooazq] {
        background: rgba(30, 41, 59, 0.4);
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6);
    }

.currency-container[b-l5gg3ooazq] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: clamp(0.5rem, 2vw, 1rem);
    width: 100%;
    height: 100%;
    min-height: 0;
}

.currency-info-section[b-l5gg3ooazq] {
    display: flex;
    align-items: center;
    gap: clamp(0.5rem, 2vw, 0.75rem);
    flex-shrink: 0;
    width: fit-content;
    max-width: 180px; /* sıkıştırma limiti */
}



.currency-icon[b-l5gg3ooazq] {
    width: clamp(32px, 8vw, 44px);
    height: clamp(32px, 8vw, 44px);
    border-radius: clamp(8px, 2vw, 12px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: white;
    flex-shrink: 0;
}

.currency-symbol[b-l5gg3ooazq] {
    font-size: clamp(0.9rem, 3vw, 1.4rem);
}

.currency-details[b-l5gg3ooazq] {
    display: flex;
    flex-direction: column;
/*    gap: 0.125rem;
*/    min-width: 0;
    flex-grow: 1;
    margin-top:-1rem;
}

.currency-code[b-l5gg3ooazq] {
    font-size: clamp(1rem, 4vw, 1.4rem);
    font-weight: 700;
    color: #1f2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top:8px;
}

[data-theme="dark"] .currency-code[b-l5gg3ooazq] {
    color: #f3f4f6;
}


/* Container küçültülecek alanla birlikte ölçeklensin */
.values-grid-wrapper[b-l5gg3ooazq] {
    display: flex;
    justify-content: center;
    width: 100%;
    overflow: hidden;
    margin-left:-3rem;
}

.values-grid[b-l5gg3ooazq] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly; /* eşit boşluk */
    gap: 1.5rem; /* öğeler arası belirgin boşluk */
    width: 100%;
    flex-wrap: nowrap;
}

.value-item[b-l5gg3ooazq] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

/* Küçük ekranlarda yazıların üst üste binmesini engellemek için */
@media (max-width: 480px) {
    .value-item .value-label[b-l5gg3ooazq],
    .value-item .value-amount[b-l5gg3ooazq] {
        white-space: normal; /* kelime kaymasını sağlar */
        text-align: center;
    }
}


.value-label[b-l5gg3ooazq] {
    color: #6b7280;
    font-weight: 500;
    font-size: clamp(0.65rem, 2vw, 0.8rem);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

[data-theme="dark"] .value-label[b-l5gg3ooazq] {
    color: #9ca3af;
}

.value-amount[b-l5gg3ooazq] {
    font-size: clamp(0.9rem, 3.5vw, 1.5rem);
    font-weight: 700;
    font-size:medium;
    color: #1f2937;
}

    .value-amount.current[b-l5gg3ooazq] {
        font-weight: 800;
    }

[data-theme="dark"] .value-amount[b-l5gg3ooazq] {
    color: #f3f4f6;
}


[data-theme="dark"] .change-item[b-l5gg3ooazq] {
    background: rgba(51, 65, 85, 0.8);
    border: 1px solid rgba(71, 85, 105, 0.6);
}
.change-item[b-l5gg3ooazq] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.change-percentage[b-l5gg3ooazq] {
    display: flex;
    align-items: center;
    gap: 0.25rem; /* ok ile sayı arası boşluk */
    font-weight: bold;
    min-width: 60px; /* hizalama için sabit genişlik */
    white-space: nowrap; /* tek satırda kal */
}

.change-arrow[b-l5gg3ooazq] {
    display: inline-block;
    font-size: 1.1rem;
    line-height: 1;
    font-family: Arial, sans-serif; /* okların görünmesi için güvenli font */
    flex-shrink: 0; /* daralmayı engelle */
}

.percentage-value[b-l5gg3ooazq],
.percentage-symbol[b-l5gg3ooazq] {
    font-size: 0.9rem;
    font-family: Arial, sans-serif;
    line-height: 1;
}

.percentage-symbol[b-l5gg3ooazq] {
    margin-left: 2px; /* sayı ile % arası boşluk */
}




/* Currency Icons */
.usd-icon[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #59b8a5 0%, #51cf66 100%) !important;
    color: white !important;
}

.eur-icon[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #6ba1d8 0%, #d09fe7 100%) !important;
    color: white !important;
}

.gbp-icon[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #d2886f 0%, #ff8a80 100%) !important;
    color: white !important;
}

.xau-icon[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #edc127 0%, #ffd43b 100%) !important;
    color: white !important;
}

/* Refresh Button */
.refresh-btn[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    color: white;
    border-radius: 50%;
    width: clamp(35px, 8vw, 50px);
    height: clamp(35px, 8vw, 50px);
    font-size: clamp(0.9rem, 2.5vw, 1.25rem);
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .refresh-btn:hover[b-l5gg3ooazq] {
        transform: scale(1.1) rotate(180deg);
    }

    .refresh-btn:active[b-l5gg3ooazq] {
        transform: scale(0.95);
    }

[data-theme="dark"] .refresh-btn[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #818cf8 0%, #6366f1 100%);
}

.loading-spinner[b-l5gg3ooazq] {
    position: absolute;
    display: none;
    width: clamp(16px, 4vw, 24px);
    height: clamp(16px, 4vw, 24px);
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-l5gg3ooazq 1s linear infinite;
}

/* Filter Section */
.filter-section[b-l5gg3ooazq] {
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    padding: clamp(1rem, 3vw, 1.5rem);
    margin-bottom: 1.5rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
/*    backdrop-filter: blur(10px);*/
display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

    .filter-section.dropdown-active[b-l5gg3ooazq] {
        position: relative;
        z-index: 5;
    }

[data-theme="dark"] .filter-section[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.4);
    border: 1px solid rgba(100, 116, 139, 0.4);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.filter-container[b-l5gg3ooazq] {
    display: flex;
    align-items: center;
    gap: clamp(0.75rem, 2vw, 1rem);
    flex-wrap: wrap;
    position: relative;
    flex: 1;
}

/* Filter Pills */
.filter-pill[b-l5gg3ooazq] {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;
    padding: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    min-width: clamp(180px, 25vw, 220px);
    z-index: 5;
    height: 48px;
    cursor: pointer;
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

    .filter-pill:hover[b-l5gg3ooazq] {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
        border-color: #667eea;
    }

    .filter-pill.active[b-l5gg3ooazq] {
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
        z-index: 5;
    }
.currencypills[b-l5gg3ooazq]{
    z-index:100;
}

[data-theme="dark"] .filter-pill[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.3);
}

.modern-date-pill.active[b-l5gg3ooazq] {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.05), rgba(118, 75, 162, 0.05));
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1), 0 8px 32px rgba(0, 0, 0, 0.15);
}

.modern-date-pill .select-trigger[b-l5gg3ooazq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.modern-date-pill .select-value[b-l5gg3ooazq] {
    flex: 1;
}

.pill-wrapper[b-l5gg3ooazq] {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 16px;
    gap: 10px;
}

.pill-icon[b-l5gg3ooazq] {
    color: #667eea;
    font-size: 14px;
    flex-shrink: 0;
    width: 20px;
    display: flex;
    justify-content: center;
}

[data-theme="dark"] .pill-icon[b-l5gg3ooazq] {
    color: #818cf8;
}

.pill-content[b-l5gg3ooazq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.pill-label[b-l5gg3ooazq] {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1;
}

[data-theme="dark"] .pill-label[b-l5gg3ooazq] {
    color: #9ca3af;
}

/* Select Components */
.custom-select[b-l5gg3ooazq] {
    position: relative;
    width: 100%;
}

.select-trigger[b-l5gg3ooazq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    min-height: 20px;
}

.select-value[b-l5gg3ooazq] {
    font-size: 13px;
    font-weight: 700;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
}

[data-theme="dark"] .select-value[b-l5gg3ooazq] {
    color: #f3f4f6;
}

.select-arrow[b-l5gg3ooazq] {
    color: #6b7280;
    font-size: 10px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-left: 8px;
}

[data-theme="dark"] .select-arrow[b-l5gg3ooazq] {
    color: #9ca3af;
}

/* Dropdowns */
.select-dropdown[b-l5gg3ooazq] {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    left: -16px !important;
    right: -16px !important;
    min-width: 30vh!important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25) !important;
    z-index: 10 !important;
    backdrop-filter: blur(20px) !important;
    animation: dropdownSlideIn-b-l5gg3ooazq 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow: hidden !important;
}

[data-theme="dark"] .select-dropdown[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
    border: 2px solid rgba(148, 163, 184, 0.3) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
}

.select-option[b-l5gg3ooazq] {
    padding: 12px 16px !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #1f2937 !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
    background: rgba(248, 250, 252, 0.8) !important;
}

    .select-option:hover[b-l5gg3ooazq] {
        background: rgba(239, 246, 255, 0.9) !important;
        color: #667eea !important;
    }

    .select-option.selected[b-l5gg3ooazq] {
        background: #667eea !important;
        color: white !important;
        font-weight: 600 !important;
    }

        .select-option.selected:hover[b-l5gg3ooazq] {
            background: #5a67d8 !important;
        }

[data-theme="dark"] .select-option[b-l5gg3ooazq] {
    color: #f3f4f6 !important;
    background: rgba(51, 65, 85, 0.8) !important;
}

    [data-theme="dark"] .select-option:hover[b-l5gg3ooazq] {
        background: rgba(71, 85, 105, 0.9) !important;
        color: #818cf8 !important;
    }

    [data-theme="dark"] .select-option.selected[b-l5gg3ooazq] {
        background: #818cf8 !important;
        color: white !important;
    }

        [data-theme="dark"] .select-option.selected:hover[b-l5gg3ooazq] {
            background: #6366f1 !important;
        }

.option-check[b-l5gg3ooazq] {
    font-size: 12px !important;
    opacity: 0.8 !important;
}

/* Date Pickers */
.modern-date-dropdown[b-l5gg3ooazq] {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: -20px !important;
    right: -20px !important;
    min-width: 280px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 2px solid #667eea !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25) !important;
    z-index: 5 !important;
    backdrop-filter: blur(20px) !important;
    animation: modernDateDropdownSlideIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow-y: auto !important;
}

[data-theme="dark"] .modern-date-dropdown[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
    border: 2px solid #818cf8 !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5) !important;
}

.date-quick-options[b-l5gg3ooazq] {
    padding: 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
    background: rgba(248, 250, 252, 0.8) !important;
}

[data-theme="dark"] .date-quick-options[b-l5gg3ooazq] {
    border-bottom: 1px solid rgba(148, 163, 184, 0.3) !important;
    background: rgba(51, 65, 85, 0.8) !important;
}

.quick-options-header[b-l5gg3ooazq] {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    padding-bottom: 6px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
}

    .quick-options-header i[b-l5gg3ooazq] {
        color: #667eea !important;
        font-size: 16px !important;
    }

    .quick-options-header span[b-l5gg3ooazq] {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #1f2937 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

[data-theme="dark"] .quick-options-header[b-l5gg3ooazq] {
    border-bottom: 1px solid rgba(148, 163, 184, 0.3) !important;
}

    [data-theme="dark"] .quick-options-header i[b-l5gg3ooazq] {
        color: #818cf8 !important;
    }

    [data-theme="dark"] .quick-options-header span[b-l5gg3ooazq] {
        color: #f3f4f6 !important;
    }

.quick-options-grid[b-l5gg3ooazq] {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)) !important;
    gap: 8px !important;
}

.quick-option[b-l5gg3ooazq] {
    padding: 8px 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    min-height: 32px !important;
    position: relative !important;
    overflow: hidden !important;
}

    .quick-option[b-l5gg3ooazq]::before {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        opacity: 0 !important;
        transition: opacity 0.2s ease !important;
        z-index: -1 !important;
    }

    .quick-option:hover[b-l5gg3ooazq] {
        transform: translateY(-2px) !important;
        border-color: #667eea !important;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.2) !important;
    }

        .quick-option:hover[b-l5gg3ooazq]::before {
            opacity: 0.05 !important;
        }

    .quick-option.selected[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        color: white !important;
        border-color: transparent !important;
        transform: scale(1.02) !important;
        box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4) !important;
    }

        .quick-option.selected[b-l5gg3ooazq]::before {
            opacity: 1 !important;
        }

[data-theme="dark"] .quick-option[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
    border: 1px solid rgba(148, 163, 184, 0.3) !important;
}

    [data-theme="dark"] .quick-option[b-l5gg3ooazq]::before {
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    }

    [data-theme="dark"] .quick-option:hover[b-l5gg3ooazq] {
        border-color: #818cf8 !important;
    }

    [data-theme="dark"] .quick-option.selected[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    }

.option-text[b-l5gg3ooazq] {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.2px !important;
    flex: 1 !important;
}

.quick-option .option-check[b-l5gg3ooazq] {
    font-size: 14px !important;
    margin-left: 8px !important;
}

.custom-date-section[b-l5gg3ooazq] {
    padding: 12px 16px !important;
    background: rgba(248, 250, 252, 0.8) !important;
    transition: all 0.3s ease !important;
    max-height: 40px !important;
    overflow: hidden !important;
}

    .custom-date-section.active[b-l5gg3ooazq] {
        max-height: 600px !important;
        background: rgba(248, 250, 252, 0.8) !important;
    }

[data-theme="dark"] .custom-date-section[b-l5gg3ooazq] {
    background: rgba(51, 65, 85, 0.8) !important;
}

    [data-theme="dark"] .custom-date-section.active[b-l5gg3ooazq] {
        background: rgba(51, 65, 85, 0.8) !important;
    }

.custom-date-header[b-l5gg3ooazq] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    cursor: pointer !important;
    user-select: none !important;
    padding: 4px 0 !important;
}

    .custom-date-header i[b-l5gg3ooazq] {
        color: #667eea !important;
        font-size: 16px !important;
    }

    .custom-date-header span[b-l5gg3ooazq] {
        font-size: 12px !important;
        font-weight: 700 !important;
        color: #1f2937 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.3px !important;
        flex: 1 !important;
        margin-left: 8px !important;
    }

[data-theme="dark"] .custom-date-header i[b-l5gg3ooazq] {
    color: #818cf8 !important;
}

[data-theme="dark"] .custom-date-header span[b-l5gg3ooazq] {
    color: #f3f4f6 !important;
}

.custom-toggle[b-l5gg3ooazq] {
    width: 40px !important;
    height: 22px !important;
    background: rgba(255, 255, 255, 0.3) !important;
    border-radius: 11px !important;
    position: relative !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

    .custom-toggle.active[b-l5gg3ooazq] {
        background: #667eea !important;
    }

[data-theme="dark"] .custom-toggle.active[b-l5gg3ooazq] {
    background: #818cf8 !important;
}

.toggle-slider[b-l5gg3ooazq] {
    width: 18px !important;
    height: 18px !important;
    background: white !important;
    border-radius: 50% !important;
    position: absolute !important;
    top: 2px !important;
    left: 2px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;
}

    .toggle-slider.active[b-l5gg3ooazq] {
        left: 20px !important;
        box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4) !important;
    }

[data-theme="dark"] .toggle-slider.active[b-l5gg3ooazq] {
    box-shadow: 0 2px 8px rgba(129, 140, 248, 0.4) !important;
}

.modern-calendar-container[b-l5gg3ooazq] {
    margin-top: 12px !important;
    animation: calendarSlideIn-b-l5gg3ooazq 0.3s ease !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 16px !important;
    align-items: start !important;
}

.date-inputs-compact[b-l5gg3ooazq] {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
}

.date-input-compact[b-l5gg3ooazq] {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.date-label[b-l5gg3ooazq] {
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    margin-bottom: 2px !important;
}

[data-theme="dark"] .date-label[b-l5gg3ooazq] {
    color: #9ca3af !important;
}

.date-display[b-l5gg3ooazq] {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 14px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    min-height: 40px !important;
    position: relative !important;
    overflow: hidden !important;
}

    .date-display[b-l5gg3ooazq]::before {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        opacity: 0 !important;
        transition: opacity 0.2s ease !important;
        z-index: 0 !important;
    }

    .date-display:hover[b-l5gg3ooazq] {
        border-color: #667eea !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 12px 32px rgba(102, 126, 234, 0.15) !important;
    }

        .date-display:hover[b-l5gg3ooazq]::before {
            opacity: 0.05 !important;
        }

    .date-display.active[b-l5gg3ooazq] {
        border-color: #667eea !important;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        color: white !important;
        box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.1), 0 12px 32px rgba(102, 126, 234, 0.3) !important;
    }

        .date-display.active[b-l5gg3ooazq]::before {
            opacity: 1 !important;
        }

        .date-display.active .date-icon[b-l5gg3ooazq],
        .date-display.active .date-text[b-l5gg3ooazq] {
            color: white !important;
            z-index: 1 !important;
            position: relative !important;
        }

[data-theme="dark"] .date-display[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
    border: 1px solid rgba(148, 163, 184, 0.3) !important;
}

    [data-theme="dark"] .date-display[b-l5gg3ooazq]::before {
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    }

    [data-theme="dark"] .date-display:hover[b-l5gg3ooazq] {
        border-color: #818cf8 !important;
    }

    [data-theme="dark"] .date-display.active[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
        border-color: #818cf8 !important;
    }

.date-icon[b-l5gg3ooazq] {
    font-size: 14px !important;
    color: #667eea !important;
    transition: color 0.2s ease !important;
    flex-shrink: 0 !important;
}

[data-theme="dark"] .date-icon[b-l5gg3ooazq] {
    color: #818cf8 !important;
}

.date-text[b-l5gg3ooazq] {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    transition: color 0.2s ease !important;
    letter-spacing: 0.2px !important;
}

[data-theme="dark"] .date-text[b-l5gg3ooazq] {
    color: #f3f4f6 !important;
}

.date-arrow[b-l5gg3ooazq] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #6b7280 !important;
    font-size: 20px !important;
    margin: 0 8px !important;
    animation: arrowPulse 2s infinite ease-in-out !important;
}

[data-theme="dark"] .date-arrow[b-l5gg3ooazq] {
    color: #9ca3af !important;
}

/* Calendar */
.modern-calendar[b-l5gg3ooazq] {
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid #667eea !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 12px 40px rgba(102, 126, 234, 0.2) !important;
    animation: calendarSlideLeft-b-l5gg3ooazq 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    width: 280px !important;
    height: fit-content !important;
}

[data-theme="dark"] .modern-calendar[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
    border: 1px solid #818cf8 !important;
}

.calendar-header[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 12px 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    color: white !important;
}

[data-theme="dark"] .calendar-header[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
}

.calendar-nav-btn[b-l5gg3ooazq] {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    font-size: 16px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    padding: 8px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    backdrop-filter: blur(10px) !important;
}

    .calendar-nav-btn:hover[b-l5gg3ooazq] {
        background: rgba(255, 255, 255, 0.2) !important;
        border-color: rgba(255, 255, 255, 0.4) !important;
        transform: scale(1.05) !important;
    }

    .calendar-nav-btn:active[b-l5gg3ooazq] {
        transform: scale(0.95) !important;
    }

.calendar-month-year[b-l5gg3ooazq] {
    font-size: 16px !important;
    font-weight: 800 !important;
    text-align: center !important;
    flex: 1 !important;
    margin: 0 12px !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
}

.calendar-body[b-l5gg3ooazq] {
    padding: 16px !important;
    background: rgba(255, 255, 255, 0.98) !important;
}

[data-theme="dark"] .calendar-body[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
}

.calendar-weekdays[b-l5gg3ooazq] {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 4px !important;
    margin-bottom: 12px !important;
}

.calendar-weekday[b-l5gg3ooazq] {
    text-align: center !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 8px 2px !important;
    background: rgba(248, 250, 252, 0.8) !important;
    border-radius: 6px !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] .calendar-weekday[b-l5gg3ooazq] {
    color: #9ca3af !important;
    background: rgba(51, 65, 85, 0.8) !important;
    border: 1px solid rgba(148, 163, 184, 0.3) !important;
}

.calendar-days[b-l5gg3ooazq] {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 4px !important;
}

.calendar-day[b-l5gg3ooazq] {
    aspect-ratio: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid transparent !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    min-height: 32px !important;
    position: relative !important;
    overflow: hidden !important;
}

    .calendar-day[b-l5gg3ooazq]::before {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        opacity: 0 !important;
        transition: opacity 0.2s ease !important;
        z-index: 0 !important;
    }

    .calendar-day:hover:not(.other-month):not(:disabled)[b-l5gg3ooazq] {
        border-color: #667eea !important;
        transform: scale(1.05) !important;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.2) !important;
    }

    .calendar-day:hover[b-l5gg3ooazq]::before {
        opacity: 0.1 !important;
    }

    .calendar-day.selected[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        color: white !important;
        font-weight: 800 !important;
        border-color: transparent !important;
        transform: scale(1.02) !important;
        box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4) !important;
        z-index: 2 !important;
    }

        .calendar-day.selected[b-l5gg3ooazq]::before {
            opacity: 1 !important;
        }

    .calendar-day.in-range[b-l5gg3ooazq] {
        background: rgba(102, 126, 234, 0.15) !important;
        color: #667eea !important;
        font-weight: 700 !important;
    }

    .calendar-day.other-month[b-l5gg3ooazq] {
        color: #6b7280 !important;
        opacity: 0.3 !important;
        cursor: not-allowed !important;
    }

        .calendar-day.other-month:hover[b-l5gg3ooazq] {
            transform: none !important;
            box-shadow: none !important;
            border-color: transparent !important;
        }

    .calendar-day.today[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #f59e0b, #f59e0b) !important;
        color: white !important;
        font-weight: 800 !important;
        border-color: #f59e0b !important;
        box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2) !important;
    }

        .calendar-day.today.selected[b-l5gg3ooazq] {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
            border-color: #667eea !important;
        }

    .calendar-day:disabled[b-l5gg3ooazq] {
        opacity: 0.2 !important;
        cursor: not-allowed !important;
        transform: none !important;
    }

        .calendar-day:disabled:hover[b-l5gg3ooazq] {
            transform: none !important;
            box-shadow: none !important;
            border-color: transparent !important;
        }

[data-theme="dark"] .calendar-day[b-l5gg3ooazq] {
    background: rgba(30, 41, 59, 0.98) !important;
    color: #f3f4f6 !important;
}

    [data-theme="dark"] .calendar-day[b-l5gg3ooazq]::before {
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    }

    [data-theme="dark"] .calendar-day:hover:not(.other-month):not(:disabled)[b-l5gg3ooazq] {
        border-color: #818cf8 !important;
    }

    [data-theme="dark"] .calendar-day.selected[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    }

    [data-theme="dark"] .calendar-day.in-range[b-l5gg3ooazq] {
        background: rgba(129, 140, 248, 0.2) !important;
        color: #818cf8 !important;
    }

    [data-theme="dark"] .calendar-day.other-month[b-l5gg3ooazq] {
        color: #9ca3af !important;
    }

    [data-theme="dark"] .calendar-day.today[b-l5gg3ooazq] {
        background: linear-gradient(135deg, #fbbf24, #fbbf24) !important;
        border-color: #fbbf24 !important;
    }

        [data-theme="dark"] .calendar-day.today.selected[b-l5gg3ooazq] {
            background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
            border-color: #818cf8 !important;
        }

/* Manual Date Input */
.date-manual-input[b-l5gg3ooazq] {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-top: 6px !important;
    padding: 8px 12px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}

    .date-manual-input:focus-within[b-l5gg3ooazq] {
        border-color: #667eea !important;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
    }

[data-theme="dark"] .date-manual-input[b-l5gg3ooazq] {
    background: rgba(51, 65, 85, 0.8) !important;
    border: 2px solid rgba(148, 163, 184, 0.3) !important;
}

    [data-theme="dark"] .date-manual-input:focus-within[b-l5gg3ooazq] {
        border-color: #818cf8 !important;
    }

.manual-input-field[b-l5gg3ooazq] {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    color: #1f2937 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    outline: none !important;
    text-align: center !important;
}

    .manual-input-field:focus[b-l5gg3ooazq] {
        background: rgba(248, 250, 252, 0.9) !important;
    }

[data-theme="dark"] .manual-input-field[b-l5gg3ooazq] {
    color: #f3f4f6 !important;
}

    [data-theme="dark"] .manual-input-field:focus[b-l5gg3ooazq] {
        background: rgba(30, 41, 59, 0.98) !important;
    }

.manual-input-separator[b-l5gg3ooazq] {
    color: #6b7280 !important;
    font-weight: bold !important;
    user-select: none !important;
}

[data-theme="dark"] .manual-input-separator[b-l5gg3ooazq] {
    color: #9ca3af !important;
}

.manual-input-icon[b-l5gg3ooazq] {
    color: #667eea !important;
    font-size: 12px !important;
    flex-shrink: 0 !important;
}

[data-theme="dark"] .manual-input-icon[b-l5gg3ooazq] {
    color: #818cf8 !important;
}

/* Action Buttons */
.date-actions-compact[b-l5gg3ooazq] {
    display: flex !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] .date-actions-compact[b-l5gg3ooazq] {
    border-top: 1px solid rgba(148, 163, 184, 0.3) !important;
}

.btn-compact[b-l5gg3ooazq] {
    padding: 8px 16px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    min-width: 80px !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
}

.btn-modern[b-l5gg3ooazq]::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05)) !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
}

.btn-modern:hover[b-l5gg3ooazq]::before {
    opacity: 1 !important;
}

.btn-cancel[b-l5gg3ooazq] {
    background: transparent !important;
    color: #6b7280 !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
}

    .btn-cancel:hover[b-l5gg3ooazq] {
        background: rgba(248, 250, 252, 0.8) !important;
        color: #1f2937 !important;
        border-color: #6b7280 !important;
        transform: translateY(-2px) !important;
    }

[data-theme="dark"] .btn-cancel[b-l5gg3ooazq] {
    color: #9ca3af !important;
    border: 2px solid rgba(148, 163, 184, 0.3) !important;
}

    [data-theme="dark"] .btn-cancel:hover[b-l5gg3ooazq] {
        background: rgba(51, 65, 85, 0.8) !important;
        color: #f3f4f6 !important;
        border-color: #9ca3af !important;
    }

.btn-apply[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white !important;
    border: 2px solid transparent !important;
    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.3) !important;
}

    .btn-apply:hover:not(:disabled)[b-l5gg3ooazq] {
        transform: translateY(-3px) !important;
        box-shadow: 0 12px 32px rgba(102, 126, 234, 0.4) !important;
    }

    .btn-apply:disabled[b-l5gg3ooazq] {
        opacity: 0.5 !important;
        cursor: not-allowed !important;
        transform: none !important;
        box-shadow: none !important;
    }

        .btn-apply:disabled:hover[b-l5gg3ooazq] {
            transform: none !important;
            box-shadow: none !important;
        }

[data-theme="dark"] .btn-apply[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
}

.btn-today[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #f59e0b, #f59e0b) !important;
    color: white !important;
    border: 2px solid transparent !important;
    box-shadow: 0 8px 24px rgba(245, 158, 11, 0.3) !important;
}

    .btn-today:hover:not(:disabled)[b-l5gg3ooazq] {
        transform: translateY(-3px) !important;
        box-shadow: 0 12px 32px rgba(245, 158, 11, 0.4) !important;
        background: linear-gradient(135deg, #f59e0b, #d97706) !important;
    }

[data-theme="dark"] .btn-today[b-l5gg3ooazq] {
    background: linear-gradient(135deg, #fbbf24, #fbbf24) !important;
}

/* Dropdown Overlay */
.dropdown-overlay[b-l5gg3ooazq] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.4) !important;
    backdrop-filter: blur(8px) !important;
    z-index: 3 !important;
    cursor: default !important;
    animation: overlayFadeIn-b-l5gg3ooazq 0.3s ease !important;
}

/* Keyframes */
@keyframes calendarSlideIn-b-l5gg3ooazq {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes overlayFadeIn-b-l5gg3ooazq {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes dropdownSlideIn-b-l5gg3ooazq {
    0% {
        opacity: 0;
        transform: translateY(-10px) scale(0.95);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes spin-b-l5gg3ooazq {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes calendarSlideLeft-b-l5gg3ooazq {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Responsive Design */
@media (max-width: 1200px) {
    .filter-container[b-l5gg3ooazq] {
        gap: 12px;
    }

    .filter-pill[b-l5gg3ooazq] {
        min-width: clamp(160px, 22vw, 200px);
        height: 44px;
    }

    .modern-date-pill[b-l5gg3ooazq] {
        min-width: clamp(200px, 32vw, 280px);
    }

    .modern-date-dropdown[b-l5gg3ooazq] {
        min-width: 380px !important;
    }
}

@media (max-width: 768px) {
    .filter-container[b-l5gg3ooazq] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        order: 1;
    }

    .refresh-btn[b-l5gg3ooazq] {
        order: 2;
        align-self: center;
    }

    .filter-pill[b-l5gg3ooazq], .modern-date-pill[b-l5gg3ooazq] {
        min-width: unset;
        width: 100%;
        height: 52px;
    }

    .pill-wrapper[b-l5gg3ooazq] {
        padding: 0 20px;
        gap: 12px;
    }

    .select-dropdown[b-l5gg3ooazq], .modern-date-dropdown[b-l5gg3ooazq] {
        left: -20px !important;
        right: -20px !important;
        min-width: unset !important;
    }

    .modern-date-dropdown[b-l5gg3ooazq] {
        border-radius: 20px !important;
    }

    .date-inputs-modern[b-l5gg3ooazq] {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .date-arrow[b-l5gg3ooazq] {
        transform: rotate(90deg) !important;
        margin: 12px 0 !important;
    }

    .quick-options-grid[b-l5gg3ooazq] {
        grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)) !important;
        gap: 6px !important;
    }

    .quick-option[b-l5gg3ooazq] {
        padding: 10px 12px !important;
        min-height: 40px !important;
    }

    .option-text[b-l5gg3ooazq] {
        font-size: 11px !important;
    }
}

@media (max-width: 480px) {
    .filter-section[b-l5gg3ooazq] {
        padding: 16px;
        margin-bottom: 16px;
        border-radius: 16px;
    }

    .filter-pill[b-l5gg3ooazq], .modern-date-pill[b-l5gg3ooazq] {
        height: 48px;
        border-radius: 24px;
    }

    .pill-wrapper[b-l5gg3ooazq] {
        padding: 0 16px;
        gap: 10px;
    }

    .pill-icon[b-l5gg3ooazq] {
        font-size: 13px;
        width: 18px;
    }

    .pill-label[b-l5gg3ooazq] {
        font-size: 10px;
    }

    .select-value[b-l5gg3ooazq] {
        font-size: 12px;
    }

    .modern-date-dropdown[b-l5gg3ooazq] {
        border-radius: 16px !important;
        min-width: 280px !important;
    }

    .date-quick-options[b-l5gg3ooazq] {
        padding: 20px 16px 12px !important;
    }

    .quick-options-grid[b-l5gg3ooazq] {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .custom-date-section[b-l5gg3ooazq] {
        padding: 16px 20px !important;
    }

    .modern-calendar-container[b-l5gg3ooazq] {
        margin-top: 20px !important;
    }

    .calendar-header[b-l5gg3ooazq] {
        padding: 16px 20px !important;
    }

    .calendar-body[b-l5gg3ooazq] {
        padding: 20px !important;
    }

    .calendar-month-year[b-l5gg3ooazq] {
        font-size: 18px !important;
        margin: 0 16px !important;
    }

    .calendar-day[b-l5gg3ooazq] {
        min-height: 44px !important;
        font-size: 13px !important;
    }

    .calendar-nav-btn[b-l5gg3ooazq] {
        min-width: 44px !important;
        height: 44px !important;
        padding: 10px !important;
    }

    .date-actions-modern[b-l5gg3ooazq] {
        flex-direction: column !important;
        gap: 12px !important;
    }

    .btn-modern[b-l5gg3ooazq] {
        min-width: unset !important;
        width: 100% !important;
    }
}

/* Accessibility */
.calendar-day:focus[b-l5gg3ooazq],
.quick-option:focus[b-l5gg3ooazq],
.btn-compact:focus[b-l5gg3ooazq],
.date-display:focus[b-l5gg3ooazq] {
    outline: 3px solid rgba(102, 126, 234, 0.3) !important;
    outline-offset: 2px !important;
}

/* High Contrast */
@media (prefers-contrast: high) {
    .currency-pill[b-l5gg3ooazq] {
        border: rgba(0, 0, 0, 0.3);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    }

        .currency-pill:hover[b-l5gg3ooazq] {
            box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
        }

    .filter-section[b-l5gg3ooazq] {
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    }

    [data-theme="dark"] .currency-pill[b-l5gg3ooazq] {
        border: rgba(255, 255, 255, 0.3);
        box-shadow: 0 10px 30px rgba(255, 255, 255, 0.2);
    }

        [data-theme="dark"] .currency-pill:hover[b-l5gg3ooazq] {
            box-shadow: 0 20px 50px rgba(255, 255, 255, 0.3);
        }

    [data-theme="dark"] .filter-section[b-l5gg3ooazq] {
        box-shadow: 0 10px 30px rgba(255, 255, 255, 0.2);
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    *[b-l5gg3ooazq],
    *[b-l5gg3ooazq]::before,
    *[b-l5gg3ooazq]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
/* _content/Client/Pages/EDevlet/Ayarlar/Parametreler.razor.rz.scp.css */



/* Responsive */
@media (max-width: 768px) {
    .container[b-wfmxxsthsh] {
        padding: 1rem;
    }

    .header h1[b-wfmxxsthsh] {
        font-size: 2rem;
        flex-direction: column;
        gap: 0.5rem;
    }

    .parameter-section .tree-content-body[b-wfmxxsthsh] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .parameter-section .checkbox-wrapper[b-wfmxxsthsh],
    .parameter-section .form-check[b-wfmxxsthsh],
    .parameter-section .bym-checkbox-wrapper[b-wfmxxsthsh] {
        padding: 1.5rem;
    }

    .parameter-section[b-wfmxxsthsh] {
        padding: 1.5rem;
    }
}
/* _content/Client/Pages/EDevlet/EFatura/GelenEFaturalar.razor.rz.scp.css */
/* _content/Client/Pages/ETicaret/Siparisler/ETicaretSiparisler.razor.rz.scp.css */
.integration-container[b-01f73hyfx9] {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.integration-card[b-01f73hyfx9] {
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    border: 1px solid #dee2e6;
}

    .integration-card:hover[b-01f73hyfx9] {
        transform: translateY(-3px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        border-color: #0d6efd;
    }

.integration-img[b-01f73hyfx9] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.integration-inactive[b-01f73hyfx9] {
    filter: grayscale(100%);
    opacity: 0.6;
}

.integration-tab-content[b-01f73hyfx9] {
    max-height: calc(100vh - 250px);
    overflow-y: auto;
    padding: 10px;
}

.integration-right-panel[b-01f73hyfx9] {
    background-color: #f8f9fa;
    min-height: calc(100vh - 250px);
}

.integration-nav-tabs .nav-link[b-01f73hyfx9] {
    font-weight: 500;
}

    .integration-nav-tabs .nav-link.active[b-01f73hyfx9] {
        font-weight: 600;
    }
/* _content/Client/Pages/FinansYonetimi/Banka/BankaHesapIslemleri.razor.rz.scp.css */
/* ============================================
   CSS VARIABLES
   ============================================ */
:root[b-q36a6chke1] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-q36a6chke1] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* ============================================
   ARAMA KARTI
   ============================================ */
.search-card-container[b-q36a6chke1] {
    position: sticky;
    top: 0;
    z-index: 1000;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-q36a6chke1] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-q36a6chke1] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-q36a6chke1] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-q36a6chke1] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-q36a6chke1] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-q36a6chke1]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-q36a6chke1] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-q36a6chke1] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-q36a6chke1] {
        transform: scale(0.95);
    }

/* ============================================
   CARİ KARTI
   ============================================ */
.stok-card[b-q36a6chke1] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
    animation: fadeIn-b-q36a6chke1 0.3s ease-out;
}

    .stok-card:hover[b-q36a6chke1] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-q36a6chke1] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-q36a6chke1] {
        transform: scale(0.98);
    }

.card-header-section[b-q36a6chke1] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-q36a6chke1] {
    width: 100%;
}

.card-title-row[b-q36a6chke1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-q36a6chke1] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-q36a6chke1] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-q36a6chke1] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-q36a6chke1] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-q36a6chke1] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-q36a6chke1] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-q36a6chke1] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-q36a6chke1] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-q36a6chke1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-q36a6chke1] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-q36a6chke1] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-q36a6chke1] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-q36a6chke1] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-q36a6chke1] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-q36a6chke1] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-q36a6chke1] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-q36a6chke1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-q36a6chke1] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-q36a6chke1] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-q36a6chke1] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-q36a6chke1] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

/* ============================================
   KART AKSİYONLARI
   ============================================ */
.card-actions[b-q36a6chke1] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-q36a6chke1] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-q36a6chke1] {
        transform: scale(0.95);
    }

.btn-primary[b-q36a6chke1] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-q36a6chke1] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-q36a6chke1] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-q36a6chke1] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

.btn-danger[b-q36a6chke1] {
    background: var(--danger-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(245, 101, 101, 0.3);
}

    .btn-danger:hover[b-q36a6chke1] {
        box-shadow: 0 6px 16px rgba(245, 101, 101, 0.4);
        transform: translateY(-2px);
    }

.btn-warning[b-q36a6chke1] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

    .btn-warning:hover[b-q36a6chke1] {
        box-shadow: 0 6px 16px rgba(245, 158, 11, 0.4);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-q36a6chke1] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-q36a6chke1] {
        background: #475569;
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-q36a6chke1] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 998;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-q36a6chke1] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-q36a6chke1] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-q36a6chke1] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-q36a6chke1] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-q36a6chke1] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-q36a6chke1] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-q36a6chke1] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-q36a6chke1] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-q36a6chke1] {
    color: #667eea;
}

.separator[b-q36a6chke1] {
    color: var(--text-muted);
}

.total-pages[b-q36a6chke1] {
    color: var(--text-secondary);
}




.page-size-selector[b-q36a6chke1] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-q36a6chke1] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-q36a6chke1] {
        border-color: #667eea;
    }

.pagination-text[b-q36a6chke1] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-q36a6chke1] {
        font-size: 14px;
    }

    .card-quick-info[b-q36a6chke1] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-q36a6chke1] {
        padding: 10px;
    }

    .stok-card[b-q36a6chke1] {
        margin: 6px 10px;
    }

    .quick-value[b-q36a6chke1] {
        font-size: 15px;
    }

    .card-header-section[b-q36a6chke1] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-q36a6chke1],
    .stok-card[b-q36a6chke1],
    .pagination-footer[b-q36a6chke1],
    .mobile-pagination[b-q36a6chke1],
    .pagination-details[b-q36a6chke1] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-q36a6chke1 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/Client/Pages/FinansYonetimi/Banka/BankaHesapMobil/BankaHesapMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-5iasvmsofa] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-5iasvmsofa] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-5iasvmsofa] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-5iasvmsofa] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-5iasvmsofa] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-5iasvmsofa] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-5iasvmsofa]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-5iasvmsofa] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-5iasvmsofa] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-5iasvmsofa] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-5iasvmsofa] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-5iasvmsofa] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-5iasvmsofa] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-5iasvmsofa] {
        transform: scale(0.98);
    }

.card-header-section[b-5iasvmsofa] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-5iasvmsofa] {
    width: 100%;
}

.card-title-row[b-5iasvmsofa] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-5iasvmsofa] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-5iasvmsofa] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-5iasvmsofa] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-5iasvmsofa] {
        transform: rotate(0deg);
    }

.card-meta-row[b-5iasvmsofa] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-5iasvmsofa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-5iasvmsofa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-5iasvmsofa] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-5iasvmsofa] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-5iasvmsofa] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-5iasvmsofa] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-5iasvmsofa] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-5iasvmsofa] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-5iasvmsofa] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-5iasvmsofa] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-5iasvmsofa] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-5iasvmsofa] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-5iasvmsofa] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-5iasvmsofa] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-5iasvmsofa] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-5iasvmsofa] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-5iasvmsofa] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-5iasvmsofa] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-5iasvmsofa] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-5iasvmsofa] {
        transform: scale(0.95);
    }

.btn-primary[b-5iasvmsofa] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-5iasvmsofa] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-5iasvmsofa] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-5iasvmsofa] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-5iasvmsofa] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-5iasvmsofa] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-5iasvmsofa] {
        font-size: 14px;
    }

    .card-quick-info[b-5iasvmsofa] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-5iasvmsofa] {
        padding: 10px;
    }

    .stok-card[b-5iasvmsofa] {
        margin: 6px 10px;
    }

    .quick-value[b-5iasvmsofa] {
        font-size: 15px;
    }

    .card-header-section[b-5iasvmsofa] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-5iasvmsofa],
    .stok-card[b-5iasvmsofa] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-5iasvmsofa {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-5iasvmsofa] {
    animation: fadeIn-b-5iasvmsofa 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-5iasvmsofa]::-webkit-scrollbar {
        width: 6px;
    }

    [b-5iasvmsofa]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-5iasvmsofa]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-5iasvmsofa]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-5iasvmsofa],
    .custom-grid[b-5iasvmsofa] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-5iasvmsofa],
    [data-bs-theme="dark"] .custom-grid[b-5iasvmsofa] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-5iasvmsofa],
    .dxbs-grid-header-content[b-5iasvmsofa],
    .dxbs-grid-header-panel[b-5iasvmsofa],
    .dxbs-grid-filter-row[b-5iasvmsofa],
    .dxbs-grid-command-column[b-5iasvmsofa],
    .dxbs-grid-selection-column[b-5iasvmsofa],
    .dxbs-grid-data-column[b-5iasvmsofa],
    .dxbs-grid-table thead[b-5iasvmsofa],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-5iasvmsofa],
    .dxbs-grid-table > tbody > tr > th[b-5iasvmsofa],
    .dxbs-grid-pager[b-5iasvmsofa],
    .dxbs-grid-empty-data[b-5iasvmsofa],
    .dxbs-grid-toolbar[b-5iasvmsofa],
    .dxbs-grid-statusbar[b-5iasvmsofa] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-5iasvmsofa],
    .dxbs-grid-table > tbody[b-5iasvmsofa],
    .dxbs-grid-table > tbody > tr[b-5iasvmsofa] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-5iasvmsofa] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-5iasvmsofa],
        .dxbs-grid-detail-cell > *[b-5iasvmsofa] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-5iasvmsofa] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-5iasvmsofa],
    .dxbs-grid-header-content[b-5iasvmsofa],
    .dxbs-grid-filter-row[b-5iasvmsofa],
    .dxbs-grid-command-column[b-5iasvmsofa],
    .dxbs-grid-selection-column[b-5iasvmsofa],
    .dxbs-grid-data-column[b-5iasvmsofa],
    .dxbs-grid-table thead[b-5iasvmsofa],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-5iasvmsofa] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-5iasvmsofa],
    .dxbs-grid-table > tbody[b-5iasvmsofa],
    .dxbs-grid-table > tbody > tr[b-5iasvmsofa] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-5iasvmsofa] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-5iasvmsofa] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-5iasvmsofa] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-5iasvmsofa] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-5iasvmsofa] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-5iasvmsofa] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-5iasvmsofa] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-5iasvmsofa] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-5iasvmsofa]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-5iasvmsofa] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-5iasvmsofa] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-5iasvmsofa] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-5iasvmsofa] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-5iasvmsofa] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-5iasvmsofa] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-5iasvmsofa] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-5iasvmsofa] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-5iasvmsofa] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-5iasvmsofa] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-5iasvmsofa] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-5iasvmsofa] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-5iasvmsofa] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-5iasvmsofa] {
    color: #667eea;
}

.separator[b-5iasvmsofa] {
    color: var(--text-muted);
}

.total-pages[b-5iasvmsofa] {
    color: var(--text-secondary);
}




.page-size-selector[b-5iasvmsofa] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-5iasvmsofa] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-5iasvmsofa] {
        border-color: #667eea;
    }

.pagination-text[b-5iasvmsofa] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-5iasvmsofa] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-5iasvmsofa] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-5iasvmsofa] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-5iasvmsofa] {
        transform: scale(0.98);
    }

.card-header-section[b-5iasvmsofa] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-5iasvmsofa] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-5iasvmsofa] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-5iasvmsofa] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-5iasvmsofa] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-5iasvmsofa] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-5iasvmsofa] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-5iasvmsofa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-5iasvmsofa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-5iasvmsofa] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-5iasvmsofa] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-5iasvmsofa] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-5iasvmsofa] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-5iasvmsofa] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-5iasvmsofa] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-5iasvmsofa] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-5iasvmsofa] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-5iasvmsofa] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-5iasvmsofa] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-5iasvmsofa] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-5iasvmsofa] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-5iasvmsofa] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-5iasvmsofa] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-5iasvmsofa] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-5iasvmsofa] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-5iasvmsofa] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-5iasvmsofa] {
        transform: scale(0.95);
    }

.btn-primary[b-5iasvmsofa] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-5iasvmsofa] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-5iasvmsofa] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-5iasvmsofa] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-5iasvmsofa] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-5iasvmsofa] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-5iasvmsofa] {
        font-size: 14px;
    }

    .card-quick-info[b-5iasvmsofa] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-5iasvmsofa] {
        padding: 10px;
    }

    .stok-card[b-5iasvmsofa] {
        margin: 6px 10px;
    }

    .quick-value[b-5iasvmsofa] {
        font-size: 15px;
    }

    .card-header-section[b-5iasvmsofa] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-5iasvmsofa],
    .stok-card[b-5iasvmsofa],
    .mobile-pagination[b-5iasvmsofa],
    .pagination-details[b-5iasvmsofa] {
        display: none !important;
    }
}

@keyframes fadeIn-b-5iasvmsofa {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-5iasvmsofa] {
    animation: fadeIn-b-5iasvmsofa 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-5iasvmsofa]::-webkit-scrollbar {
        width: 6px;
    }

    [b-5iasvmsofa]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-5iasvmsofa]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-5iasvmsofa]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-5iasvmsofa] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-5iasvmsofa] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-5iasvmsofa] {
    background: #0f172a;
}

.pagination-btn[b-5iasvmsofa] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-5iasvmsofa] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-5iasvmsofa] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-5iasvmsofa] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-5iasvmsofa] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-5iasvmsofa] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-5iasvmsofa] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-5iasvmsofa] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-5iasvmsofa] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-5iasvmsofa] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-5iasvmsofa] {
        border-color: #667eea;
    }

.pagination-text[b-5iasvmsofa] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-5iasvmsofa] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-5iasvmsofa] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-5iasvmsofa] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-5iasvmsofa]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-5iasvmsofa] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-5iasvmsofa] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-5iasvmsofa] {
        transform: scale(0.95);
    }

#faturaContainer[b-5iasvmsofa] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Banka/BankaKartiMobil/BankaKartiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-rnlp9b7izb] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-rnlp9b7izb] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-rnlp9b7izb] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-rnlp9b7izb] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-rnlp9b7izb] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-rnlp9b7izb] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-rnlp9b7izb]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-rnlp9b7izb] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-rnlp9b7izb] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-rnlp9b7izb] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-rnlp9b7izb] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-rnlp9b7izb] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-rnlp9b7izb] {
        transform: scale(0.98);
    }

.card-header-section[b-rnlp9b7izb] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-rnlp9b7izb] {
    width: 100%;
}

.card-title-row[b-rnlp9b7izb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-rnlp9b7izb] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-rnlp9b7izb] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-rnlp9b7izb] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-rnlp9b7izb] {
        transform: rotate(0deg);
    }

.card-meta-row[b-rnlp9b7izb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-rnlp9b7izb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-rnlp9b7izb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-rnlp9b7izb] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-rnlp9b7izb] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-rnlp9b7izb] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-rnlp9b7izb] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-rnlp9b7izb] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-rnlp9b7izb] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-rnlp9b7izb] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-rnlp9b7izb] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-rnlp9b7izb] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-rnlp9b7izb] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-rnlp9b7izb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-rnlp9b7izb] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-rnlp9b7izb] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-rnlp9b7izb] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-rnlp9b7izb] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-rnlp9b7izb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-rnlp9b7izb] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

.btn-primary[b-rnlp9b7izb] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-rnlp9b7izb] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-rnlp9b7izb] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-rnlp9b7izb] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-rnlp9b7izb] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-rnlp9b7izb] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-rnlp9b7izb] {
        font-size: 14px;
    }

    .card-quick-info[b-rnlp9b7izb] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-rnlp9b7izb] {
        padding: 10px;
    }

    .stok-card[b-rnlp9b7izb] {
        margin: 6px 10px;
    }

    .quick-value[b-rnlp9b7izb] {
        font-size: 15px;
    }

    .card-header-section[b-rnlp9b7izb] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-rnlp9b7izb],
    .stok-card[b-rnlp9b7izb] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-rnlp9b7izb {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-rnlp9b7izb] {
    animation: fadeIn-b-rnlp9b7izb 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-rnlp9b7izb]::-webkit-scrollbar {
        width: 6px;
    }

    [b-rnlp9b7izb]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-rnlp9b7izb]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-rnlp9b7izb]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-rnlp9b7izb],
    .custom-grid[b-rnlp9b7izb] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-rnlp9b7izb],
    [data-bs-theme="dark"] .custom-grid[b-rnlp9b7izb] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-rnlp9b7izb],
    .dxbs-grid-header-content[b-rnlp9b7izb],
    .dxbs-grid-header-panel[b-rnlp9b7izb],
    .dxbs-grid-filter-row[b-rnlp9b7izb],
    .dxbs-grid-command-column[b-rnlp9b7izb],
    .dxbs-grid-selection-column[b-rnlp9b7izb],
    .dxbs-grid-data-column[b-rnlp9b7izb],
    .dxbs-grid-table thead[b-rnlp9b7izb],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-rnlp9b7izb],
    .dxbs-grid-table > tbody > tr > th[b-rnlp9b7izb],
    .dxbs-grid-pager[b-rnlp9b7izb],
    .dxbs-grid-empty-data[b-rnlp9b7izb],
    .dxbs-grid-toolbar[b-rnlp9b7izb],
    .dxbs-grid-statusbar[b-rnlp9b7izb] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-rnlp9b7izb],
    .dxbs-grid-table > tbody[b-rnlp9b7izb],
    .dxbs-grid-table > tbody > tr[b-rnlp9b7izb] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-rnlp9b7izb] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-rnlp9b7izb],
        .dxbs-grid-detail-cell > *[b-rnlp9b7izb] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-rnlp9b7izb] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-rnlp9b7izb],
    .dxbs-grid-header-content[b-rnlp9b7izb],
    .dxbs-grid-filter-row[b-rnlp9b7izb],
    .dxbs-grid-command-column[b-rnlp9b7izb],
    .dxbs-grid-selection-column[b-rnlp9b7izb],
    .dxbs-grid-data-column[b-rnlp9b7izb],
    .dxbs-grid-table thead[b-rnlp9b7izb],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-rnlp9b7izb] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-rnlp9b7izb],
    .dxbs-grid-table > tbody[b-rnlp9b7izb],
    .dxbs-grid-table > tbody > tr[b-rnlp9b7izb] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-rnlp9b7izb] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-rnlp9b7izb] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-rnlp9b7izb] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-rnlp9b7izb] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-rnlp9b7izb] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-rnlp9b7izb] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-rnlp9b7izb] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-rnlp9b7izb] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-rnlp9b7izb]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-rnlp9b7izb] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-rnlp9b7izb] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-rnlp9b7izb] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-rnlp9b7izb] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-rnlp9b7izb] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-rnlp9b7izb] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-rnlp9b7izb] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-rnlp9b7izb] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-rnlp9b7izb] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-rnlp9b7izb] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-rnlp9b7izb] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-rnlp9b7izb] {
    color: #667eea;
}

.separator[b-rnlp9b7izb] {
    color: var(--text-muted);
}

.total-pages[b-rnlp9b7izb] {
    color: var(--text-secondary);
}




.page-size-selector[b-rnlp9b7izb] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-rnlp9b7izb] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-rnlp9b7izb] {
        border-color: #667eea;
    }

.pagination-text[b-rnlp9b7izb] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-rnlp9b7izb] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-rnlp9b7izb] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-rnlp9b7izb] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-rnlp9b7izb] {
        transform: scale(0.98);
    }

.card-header-section[b-rnlp9b7izb] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-rnlp9b7izb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-rnlp9b7izb] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-rnlp9b7izb] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-rnlp9b7izb] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-rnlp9b7izb] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-rnlp9b7izb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-rnlp9b7izb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-rnlp9b7izb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-rnlp9b7izb] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-rnlp9b7izb] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-rnlp9b7izb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-rnlp9b7izb] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-rnlp9b7izb] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-rnlp9b7izb] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-rnlp9b7izb] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-rnlp9b7izb] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-rnlp9b7izb] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-rnlp9b7izb] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-rnlp9b7izb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-rnlp9b7izb] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-rnlp9b7izb] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-rnlp9b7izb] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-rnlp9b7izb] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-rnlp9b7izb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-rnlp9b7izb] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

.btn-primary[b-rnlp9b7izb] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-rnlp9b7izb] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-rnlp9b7izb] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-rnlp9b7izb] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-rnlp9b7izb] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-rnlp9b7izb] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-rnlp9b7izb] {
        font-size: 14px;
    }

    .card-quick-info[b-rnlp9b7izb] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-rnlp9b7izb] {
        padding: 10px;
    }

    .stok-card[b-rnlp9b7izb] {
        margin: 6px 10px;
    }

    .quick-value[b-rnlp9b7izb] {
        font-size: 15px;
    }

    .card-header-section[b-rnlp9b7izb] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-rnlp9b7izb],
    .stok-card[b-rnlp9b7izb],
    .mobile-pagination[b-rnlp9b7izb],
    .pagination-details[b-rnlp9b7izb] {
        display: none !important;
    }
}

@keyframes fadeIn-b-rnlp9b7izb {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-rnlp9b7izb] {
    animation: fadeIn-b-rnlp9b7izb 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-rnlp9b7izb]::-webkit-scrollbar {
        width: 6px;
    }

    [b-rnlp9b7izb]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-rnlp9b7izb]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-rnlp9b7izb]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-rnlp9b7izb] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-rnlp9b7izb] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-rnlp9b7izb] {
    background: #0f172a;
}

.pagination-btn[b-rnlp9b7izb] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-rnlp9b7izb] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-rnlp9b7izb] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-rnlp9b7izb] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-rnlp9b7izb] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-rnlp9b7izb] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-rnlp9b7izb] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-rnlp9b7izb] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-rnlp9b7izb] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-rnlp9b7izb] {
        border-color: #667eea;
    }

.pagination-text[b-rnlp9b7izb] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-rnlp9b7izb] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-rnlp9b7izb] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-rnlp9b7izb] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-rnlp9b7izb]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-rnlp9b7izb] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-rnlp9b7izb] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-rnlp9b7izb] {
        transform: scale(0.95);
    }

#faturaContainer[b-rnlp9b7izb] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Banka/BankaMobil/BankaMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-zl11d5teb9] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-zl11d5teb9] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-zl11d5teb9] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-zl11d5teb9] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-zl11d5teb9] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-zl11d5teb9] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-zl11d5teb9]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-zl11d5teb9] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-zl11d5teb9] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-zl11d5teb9] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-zl11d5teb9] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-zl11d5teb9] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-zl11d5teb9] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-zl11d5teb9] {
        transform: scale(0.98);
    }

.card-header-section[b-zl11d5teb9] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-zl11d5teb9] {
    width: 100%;
}

.card-title-row[b-zl11d5teb9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-zl11d5teb9] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-zl11d5teb9] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-zl11d5teb9] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-zl11d5teb9] {
        transform: rotate(0deg);
    }

.card-meta-row[b-zl11d5teb9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-zl11d5teb9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-zl11d5teb9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-zl11d5teb9] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-zl11d5teb9] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-zl11d5teb9] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-zl11d5teb9] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-zl11d5teb9] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-zl11d5teb9] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-zl11d5teb9] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-zl11d5teb9] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-zl11d5teb9] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-zl11d5teb9] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-zl11d5teb9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-zl11d5teb9] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-zl11d5teb9] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-zl11d5teb9] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-zl11d5teb9] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-zl11d5teb9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-zl11d5teb9] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-zl11d5teb9] {
        transform: scale(0.95);
    }

.btn-primary[b-zl11d5teb9] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-zl11d5teb9] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-zl11d5teb9] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-zl11d5teb9] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-zl11d5teb9] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-zl11d5teb9] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-zl11d5teb9] {
        font-size: 14px;
    }

    .card-quick-info[b-zl11d5teb9] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-zl11d5teb9] {
        padding: 10px;
    }

    .stok-card[b-zl11d5teb9] {
        margin: 6px 10px;
    }

    .quick-value[b-zl11d5teb9] {
        font-size: 15px;
    }

    .card-header-section[b-zl11d5teb9] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-zl11d5teb9],
    .stok-card[b-zl11d5teb9] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-zl11d5teb9 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-zl11d5teb9] {
    animation: fadeIn-b-zl11d5teb9 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-zl11d5teb9]::-webkit-scrollbar {
        width: 6px;
    }

    [b-zl11d5teb9]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-zl11d5teb9]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-zl11d5teb9]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-zl11d5teb9],
    .custom-grid[b-zl11d5teb9] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-zl11d5teb9],
    [data-bs-theme="dark"] .custom-grid[b-zl11d5teb9] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-zl11d5teb9],
    .dxbs-grid-header-content[b-zl11d5teb9],
    .dxbs-grid-header-panel[b-zl11d5teb9],
    .dxbs-grid-filter-row[b-zl11d5teb9],
    .dxbs-grid-command-column[b-zl11d5teb9],
    .dxbs-grid-selection-column[b-zl11d5teb9],
    .dxbs-grid-data-column[b-zl11d5teb9],
    .dxbs-grid-table thead[b-zl11d5teb9],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-zl11d5teb9],
    .dxbs-grid-table > tbody > tr > th[b-zl11d5teb9],
    .dxbs-grid-pager[b-zl11d5teb9],
    .dxbs-grid-empty-data[b-zl11d5teb9],
    .dxbs-grid-toolbar[b-zl11d5teb9],
    .dxbs-grid-statusbar[b-zl11d5teb9] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-zl11d5teb9],
    .dxbs-grid-table > tbody[b-zl11d5teb9],
    .dxbs-grid-table > tbody > tr[b-zl11d5teb9] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-zl11d5teb9] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-zl11d5teb9],
        .dxbs-grid-detail-cell > *[b-zl11d5teb9] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-zl11d5teb9] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-zl11d5teb9],
    .dxbs-grid-header-content[b-zl11d5teb9],
    .dxbs-grid-filter-row[b-zl11d5teb9],
    .dxbs-grid-command-column[b-zl11d5teb9],
    .dxbs-grid-selection-column[b-zl11d5teb9],
    .dxbs-grid-data-column[b-zl11d5teb9],
    .dxbs-grid-table thead[b-zl11d5teb9],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-zl11d5teb9] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-zl11d5teb9],
    .dxbs-grid-table > tbody[b-zl11d5teb9],
    .dxbs-grid-table > tbody > tr[b-zl11d5teb9] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-zl11d5teb9] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-zl11d5teb9] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-zl11d5teb9] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-zl11d5teb9] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-zl11d5teb9] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-zl11d5teb9] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-zl11d5teb9] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-zl11d5teb9] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-zl11d5teb9]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-zl11d5teb9] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-zl11d5teb9] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-zl11d5teb9] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-zl11d5teb9] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-zl11d5teb9] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-zl11d5teb9] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-zl11d5teb9] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-zl11d5teb9] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-zl11d5teb9] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-zl11d5teb9] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-zl11d5teb9] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-zl11d5teb9] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-zl11d5teb9] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-zl11d5teb9] {
    color: #667eea;
}

.separator[b-zl11d5teb9] {
    color: var(--text-muted);
}

.total-pages[b-zl11d5teb9] {
    color: var(--text-secondary);
}




.page-size-selector[b-zl11d5teb9] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-zl11d5teb9] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-zl11d5teb9] {
        border-color: #667eea;
    }

.pagination-text[b-zl11d5teb9] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-zl11d5teb9] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-zl11d5teb9] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-zl11d5teb9] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-zl11d5teb9] {
        transform: scale(0.98);
    }

.card-header-section[b-zl11d5teb9] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-zl11d5teb9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-zl11d5teb9] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-zl11d5teb9] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-zl11d5teb9] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-zl11d5teb9] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-zl11d5teb9] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-zl11d5teb9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-zl11d5teb9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-zl11d5teb9] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-zl11d5teb9] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-zl11d5teb9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-zl11d5teb9] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-zl11d5teb9] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-zl11d5teb9] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-zl11d5teb9] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-zl11d5teb9] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-zl11d5teb9] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-zl11d5teb9] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-zl11d5teb9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-zl11d5teb9] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-zl11d5teb9] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-zl11d5teb9] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-zl11d5teb9] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-zl11d5teb9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-zl11d5teb9] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-zl11d5teb9] {
        transform: scale(0.95);
    }

.btn-primary[b-zl11d5teb9] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-zl11d5teb9] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-zl11d5teb9] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-zl11d5teb9] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-zl11d5teb9] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-zl11d5teb9] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-zl11d5teb9] {
        font-size: 14px;
    }

    .card-quick-info[b-zl11d5teb9] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-zl11d5teb9] {
        padding: 10px;
    }

    .stok-card[b-zl11d5teb9] {
        margin: 6px 10px;
    }

    .quick-value[b-zl11d5teb9] {
        font-size: 15px;
    }

    .card-header-section[b-zl11d5teb9] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-zl11d5teb9],
    .stok-card[b-zl11d5teb9],
    .mobile-pagination[b-zl11d5teb9],
    .pagination-details[b-zl11d5teb9] {
        display: none !important;
    }
}

@keyframes fadeIn-b-zl11d5teb9 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-zl11d5teb9] {
    animation: fadeIn-b-zl11d5teb9 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-zl11d5teb9]::-webkit-scrollbar {
        width: 6px;
    }

    [b-zl11d5teb9]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-zl11d5teb9]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-zl11d5teb9]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-zl11d5teb9] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-zl11d5teb9] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-zl11d5teb9] {
    background: #0f172a;
}

.pagination-btn[b-zl11d5teb9] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-zl11d5teb9] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-zl11d5teb9] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-zl11d5teb9] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-zl11d5teb9] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-zl11d5teb9] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-zl11d5teb9] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-zl11d5teb9] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-zl11d5teb9] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-zl11d5teb9] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-zl11d5teb9] {
        border-color: #667eea;
    }

.pagination-text[b-zl11d5teb9] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-zl11d5teb9] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-zl11d5teb9] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-zl11d5teb9] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-zl11d5teb9]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-zl11d5teb9] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-zl11d5teb9] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-zl11d5teb9] {
        transform: scale(0.95);
    }

#faturaContainer[b-zl11d5teb9] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Banka/BankaSubeleriMobil/BankaSubeleriMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-0l19nlowo2] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-0l19nlowo2] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-0l19nlowo2] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-0l19nlowo2] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-0l19nlowo2] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-0l19nlowo2] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0l19nlowo2]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0l19nlowo2] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0l19nlowo2] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0l19nlowo2] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-0l19nlowo2] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-0l19nlowo2] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-0l19nlowo2] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-0l19nlowo2] {
        transform: scale(0.98);
    }

.card-header-section[b-0l19nlowo2] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-0l19nlowo2] {
    width: 100%;
}

.card-title-row[b-0l19nlowo2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-0l19nlowo2] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-0l19nlowo2] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-0l19nlowo2] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-0l19nlowo2] {
        transform: rotate(0deg);
    }

.card-meta-row[b-0l19nlowo2] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-0l19nlowo2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-0l19nlowo2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-0l19nlowo2] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-0l19nlowo2] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-0l19nlowo2] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-0l19nlowo2] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-0l19nlowo2] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-0l19nlowo2] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-0l19nlowo2] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-0l19nlowo2] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-0l19nlowo2] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-0l19nlowo2] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-0l19nlowo2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-0l19nlowo2] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-0l19nlowo2] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-0l19nlowo2] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-0l19nlowo2] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-0l19nlowo2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-0l19nlowo2] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-0l19nlowo2] {
        transform: scale(0.95);
    }

.btn-primary[b-0l19nlowo2] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-0l19nlowo2] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-0l19nlowo2] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-0l19nlowo2] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-0l19nlowo2] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-0l19nlowo2] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-0l19nlowo2] {
        font-size: 14px;
    }

    .card-quick-info[b-0l19nlowo2] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-0l19nlowo2] {
        padding: 10px;
    }

    .stok-card[b-0l19nlowo2] {
        margin: 6px 10px;
    }

    .quick-value[b-0l19nlowo2] {
        font-size: 15px;
    }

    .card-header-section[b-0l19nlowo2] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-0l19nlowo2],
    .stok-card[b-0l19nlowo2] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-0l19nlowo2 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-0l19nlowo2] {
    animation: fadeIn-b-0l19nlowo2 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-0l19nlowo2]::-webkit-scrollbar {
        width: 6px;
    }

    [b-0l19nlowo2]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-0l19nlowo2]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-0l19nlowo2]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-0l19nlowo2],
    .custom-grid[b-0l19nlowo2] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-0l19nlowo2],
    [data-bs-theme="dark"] .custom-grid[b-0l19nlowo2] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-0l19nlowo2],
    .dxbs-grid-header-content[b-0l19nlowo2],
    .dxbs-grid-header-panel[b-0l19nlowo2],
    .dxbs-grid-filter-row[b-0l19nlowo2],
    .dxbs-grid-command-column[b-0l19nlowo2],
    .dxbs-grid-selection-column[b-0l19nlowo2],
    .dxbs-grid-data-column[b-0l19nlowo2],
    .dxbs-grid-table thead[b-0l19nlowo2],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-0l19nlowo2],
    .dxbs-grid-table > tbody > tr > th[b-0l19nlowo2],
    .dxbs-grid-pager[b-0l19nlowo2],
    .dxbs-grid-empty-data[b-0l19nlowo2],
    .dxbs-grid-toolbar[b-0l19nlowo2],
    .dxbs-grid-statusbar[b-0l19nlowo2] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-0l19nlowo2],
    .dxbs-grid-table > tbody[b-0l19nlowo2],
    .dxbs-grid-table > tbody > tr[b-0l19nlowo2] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-0l19nlowo2] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-0l19nlowo2],
        .dxbs-grid-detail-cell > *[b-0l19nlowo2] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-0l19nlowo2] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-0l19nlowo2],
    .dxbs-grid-header-content[b-0l19nlowo2],
    .dxbs-grid-filter-row[b-0l19nlowo2],
    .dxbs-grid-command-column[b-0l19nlowo2],
    .dxbs-grid-selection-column[b-0l19nlowo2],
    .dxbs-grid-data-column[b-0l19nlowo2],
    .dxbs-grid-table thead[b-0l19nlowo2],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-0l19nlowo2] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-0l19nlowo2],
    .dxbs-grid-table > tbody[b-0l19nlowo2],
    .dxbs-grid-table > tbody > tr[b-0l19nlowo2] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-0l19nlowo2] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-0l19nlowo2] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-0l19nlowo2] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-0l19nlowo2] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-0l19nlowo2] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-0l19nlowo2] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-0l19nlowo2] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-0l19nlowo2] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0l19nlowo2]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0l19nlowo2] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0l19nlowo2] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0l19nlowo2] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-0l19nlowo2] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-0l19nlowo2] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-0l19nlowo2] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-0l19nlowo2] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-0l19nlowo2] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-0l19nlowo2] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-0l19nlowo2] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-0l19nlowo2] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-0l19nlowo2] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-0l19nlowo2] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-0l19nlowo2] {
    color: #667eea;
}

.separator[b-0l19nlowo2] {
    color: var(--text-muted);
}

.total-pages[b-0l19nlowo2] {
    color: var(--text-secondary);
}




.page-size-selector[b-0l19nlowo2] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-0l19nlowo2] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-0l19nlowo2] {
        border-color: #667eea;
    }

.pagination-text[b-0l19nlowo2] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-0l19nlowo2] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-0l19nlowo2] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-0l19nlowo2] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-0l19nlowo2] {
        transform: scale(0.98);
    }

.card-header-section[b-0l19nlowo2] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-0l19nlowo2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-0l19nlowo2] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-0l19nlowo2] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-0l19nlowo2] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-0l19nlowo2] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-0l19nlowo2] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-0l19nlowo2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-0l19nlowo2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-0l19nlowo2] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-0l19nlowo2] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-0l19nlowo2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-0l19nlowo2] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-0l19nlowo2] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-0l19nlowo2] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-0l19nlowo2] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-0l19nlowo2] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-0l19nlowo2] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-0l19nlowo2] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-0l19nlowo2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-0l19nlowo2] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-0l19nlowo2] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-0l19nlowo2] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-0l19nlowo2] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-0l19nlowo2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-0l19nlowo2] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-0l19nlowo2] {
        transform: scale(0.95);
    }

.btn-primary[b-0l19nlowo2] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-0l19nlowo2] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-0l19nlowo2] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-0l19nlowo2] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-0l19nlowo2] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-0l19nlowo2] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-0l19nlowo2] {
        font-size: 14px;
    }

    .card-quick-info[b-0l19nlowo2] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-0l19nlowo2] {
        padding: 10px;
    }

    .stok-card[b-0l19nlowo2] {
        margin: 6px 10px;
    }

    .quick-value[b-0l19nlowo2] {
        font-size: 15px;
    }

    .card-header-section[b-0l19nlowo2] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-0l19nlowo2],
    .stok-card[b-0l19nlowo2],
    .mobile-pagination[b-0l19nlowo2],
    .pagination-details[b-0l19nlowo2] {
        display: none !important;
    }
}

@keyframes fadeIn-b-0l19nlowo2 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-0l19nlowo2] {
    animation: fadeIn-b-0l19nlowo2 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-0l19nlowo2]::-webkit-scrollbar {
        width: 6px;
    }

    [b-0l19nlowo2]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-0l19nlowo2]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-0l19nlowo2]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-0l19nlowo2] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-0l19nlowo2] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-0l19nlowo2] {
    background: #0f172a;
}

.pagination-btn[b-0l19nlowo2] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-0l19nlowo2] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-0l19nlowo2] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-0l19nlowo2] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-0l19nlowo2] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-0l19nlowo2] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-0l19nlowo2] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-0l19nlowo2] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-0l19nlowo2] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-0l19nlowo2] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-0l19nlowo2] {
        border-color: #667eea;
    }

.pagination-text[b-0l19nlowo2] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-0l19nlowo2] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-0l19nlowo2] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-0l19nlowo2] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0l19nlowo2]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0l19nlowo2] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0l19nlowo2] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0l19nlowo2] {
        transform: scale(0.95);
    }

#faturaContainer[b-0l19nlowo2] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Cari/CariAra.razor.rz.scp.css */
/* ============================================
   CSS VARIABLES
   ============================================ */
:root[b-3bp734m46w] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-3bp734m46w] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* ============================================
   MOBİL - GRİD GİZLEME (max-width: 991px)
   ============================================ */
@media (max-width: 991px) {
    .dxbs-grid[b-3bp734m46w] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-3bp734m46w],
    [data-bs-theme="dark"] .custom-grid[b-3bp734m46w] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-3bp734m46w],
    .dxbs-grid-header-content[b-3bp734m46w],
    .dxbs-grid-header-panel[b-3bp734m46w],
    .dxbs-grid-filter-row[b-3bp734m46w],
    .dxbs-grid-command-column[b-3bp734m46w],
    .dxbs-grid-selection-column[b-3bp734m46w],
    .dxbs-grid-data-column[b-3bp734m46w],
    .dxbs-grid-table thead[b-3bp734m46w],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-3bp734m46w],
    .dxbs-grid-table > tbody > tr > th[b-3bp734m46w],
    .dxbs-grid-pager[b-3bp734m46w],
    .dxbs-grid-empty-data[b-3bp734m46w],
    .dxbs-grid-toolbar[b-3bp734m46w],
    .dxbs-grid-statusbar[b-3bp734m46w] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-3bp734m46w],
    .dxbs-grid-table > tbody[b-3bp734m46w],
    .dxbs-grid-table > tbody > tr[b-3bp734m46w] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-3bp734m46w] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-3bp734m46w],
        .dxbs-grid-detail-cell > *[b-3bp734m46w] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }

    .custom-grid[b-3bp734m46w] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }

    /* SCROLLBAR */
    [b-3bp734m46w]::-webkit-scrollbar {
        width: 6px;
    }

    [b-3bp734m46w]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-3bp734m46w]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-3bp734m46w]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

/* ============================================
   ARAMA KARTI
   ============================================ */
.search-card-container[b-3bp734m46w] {
    position: sticky;
    top: 0;
    z-index: 1000;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-3bp734m46w] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-3bp734m46w] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-3bp734m46w] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-3bp734m46w] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-3bp734m46w] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-3bp734m46w]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-3bp734m46w] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-3bp734m46w] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-3bp734m46w] {
        transform: scale(0.95);
    }

/* ============================================
   CARİ KARTI
   ============================================ */
.stok-card[b-3bp734m46w] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
    animation: fadeIn-b-3bp734m46w 0.3s ease-out;
}

    .stok-card:hover[b-3bp734m46w] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-3bp734m46w] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-3bp734m46w] {
        transform: scale(0.98);
    }

.card-header-section[b-3bp734m46w] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-3bp734m46w] {
    width: 100%;
}

.card-title-row[b-3bp734m46w] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-3bp734m46w] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-3bp734m46w] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-3bp734m46w] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-3bp734m46w] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-3bp734m46w] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-3bp734m46w] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-3bp734m46w] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-3bp734m46w] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-3bp734m46w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-3bp734m46w] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-3bp734m46w] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-3bp734m46w] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-3bp734m46w] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-3bp734m46w] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-3bp734m46w] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-3bp734m46w] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-3bp734m46w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-3bp734m46w] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-3bp734m46w] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-3bp734m46w] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-3bp734m46w] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

/* ============================================
   KART AKSİYONLARI
   ============================================ */
.card-actions[b-3bp734m46w] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-3bp734m46w] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-3bp734m46w] {
        transform: scale(0.95);
    }

.btn-primary[b-3bp734m46w] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-3bp734m46w] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-3bp734m46w] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-3bp734m46w] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

.btn-danger[b-3bp734m46w] {
    background: var(--danger-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(245, 101, 101, 0.3);
}

    .btn-danger:hover[b-3bp734m46w] {
        box-shadow: 0 6px 16px rgba(245, 101, 101, 0.4);
        transform: translateY(-2px);
    }

.btn-warning[b-3bp734m46w] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

    .btn-warning:hover[b-3bp734m46w] {
        box-shadow: 0 6px 16px rgba(245, 158, 11, 0.4);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-3bp734m46w] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-3bp734m46w] {
        background: #475569;
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-3bp734m46w] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 998;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-3bp734m46w] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-3bp734m46w] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-3bp734m46w] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-3bp734m46w] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-3bp734m46w] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-3bp734m46w] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-3bp734m46w] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-3bp734m46w] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-3bp734m46w] {
    color: #667eea;
}

.separator[b-3bp734m46w] {
    color: var(--text-muted);
}

.total-pages[b-3bp734m46w] {
    color: var(--text-secondary);
}




.page-size-selector[b-3bp734m46w] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-3bp734m46w] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-3bp734m46w] {
        border-color: #667eea;
    }

.pagination-text[b-3bp734m46w] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-3bp734m46w] {
        font-size: 14px;
    }

    .card-quick-info[b-3bp734m46w] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-3bp734m46w] {
        padding: 10px;
    }

    .stok-card[b-3bp734m46w] {
        margin: 6px 10px;
    }

    .quick-value[b-3bp734m46w] {
        font-size: 15px;
    }

    .card-header-section[b-3bp734m46w] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-3bp734m46w],
    .stok-card[b-3bp734m46w],
    .pagination-footer[b-3bp734m46w],
    .mobile-pagination[b-3bp734m46w],
    .pagination-details[b-3bp734m46w] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-3bp734m46w {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Modern Popup Base Styles */
.modern-popup .dx-popup-wrapper[b-3bp734m46w] {
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3) !important;
}

.modern-popup .dx-popup-content[b-3bp734m46w] {
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%) !important;
    border-radius: 24px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: none !important;
}

.modern-popup .dx-popup-title[b-3bp734m46w] {
    display: none !important;
}

.modern-popup .dx-overlay-content[b-3bp734m46w] {
    border-radius: 24px !important;
    overflow: hidden !important;
}

.modern-popup-content[b-3bp734m46w] {
    padding: 32px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    background: transparent !important;
}

/* Icon Wrapper */
.popup-icon-wrapper[b-3bp734m46w] {
    width: 72px !important;
    height: 72px !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, rgba(255,255,255,0.9), rgba(255,255,255,0.6)) !important;
    backdrop-filter: blur(10px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.1) !important;
    margin: 0 auto !important;
}

/* Typography */
.popup-title[b-3bp734m46w] {
    font-size: 24px !important;
    font-weight: 700 !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    margin: 0 !important;
    text-align: center !important;
}

.popup-description[b-3bp734m46w] {
    font-size: 14px !important;
    color: #64748b !important;
    text-align: center !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

/* WhatsApp Specific */
.whatsapp-popup .popup-title[b-3bp734m46w] {
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.whatsapp-input .dx-texteditor[b-3bp734m46w] {
    background: white !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

    .whatsapp-input .dx-texteditor:hover[b-3bp734m46w] {
        border-color: #25D366 !important;
        box-shadow: 0 6px 20px rgba(37, 211, 102, 0.15) !important;
    }

    .whatsapp-input .dx-texteditor.dx-state-focused[b-3bp734m46w] {
        border-color: #25D366 !important;
        box-shadow: 0 8px 24px rgba(37, 211, 102, 0.25) !important;
        transform: translateY(-2px) !important;
    }

.whatsapp-input .dx-texteditor-input[b-3bp734m46w] {
    padding: 16px 18px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    letter-spacing: 0.5px !important;
}

.whatsapp-input .dx-placeholder[b-3bp734m46w] {
    color: #94a3b8 !important;
    font-size: 15px !important;
}

.input-wrapper[b-3bp734m46w] {
    margin-top: 8px !important;
}

    .input-wrapper .input-label[b-3bp734m46w] {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: #475569 !important;
        margin-bottom: 8px !important;
        display: block !important;
    }

.modern-input input[b-3bp734m46w] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid transparent;
    border-radius: 12px;
    font-size: 15px;
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}

    .modern-input input:focus[b-3bp734m46w] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 8px 24px rgba(102,126,234,0.2);
        transform: translateY(-2px);
    }

/* Form Section */
.form-section[b-3bp734m46w] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Checkbox Group */
.checkbox-group[b-3bp734m46w] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.modern-checkbox[b-3bp734m46w] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    background: rgba(255,255,255,0.7);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: 2px solid transparent;
}

    .modern-checkbox:hover[b-3bp734m46w] {
        background: rgba(255,255,255,0.9);
        border-color: rgba(102,126,234,0.3);
        transform: translateX(4px);
    }

.checkbox-label[b-3bp734m46w] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.label-text[b-3bp734m46w] {
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
}

.label-description[b-3bp734m46w] {
    font-size: 13px;
    color: #64748b;
    line-height: 1.4;
}

/* Date Inputs */
.date-inputs[b-3bp734m46w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    transition: opacity 0.3s ease;
}

    .date-inputs.disabled[b-3bp734m46w] {
        opacity: 0.5;
        pointer-events: none;
    }

.input-group[b-3bp734m46w] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.input-label[b-3bp734m46w] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    margin: 0;
}

.modern-date-input[b-3bp734m46w] {
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    border: 2px solid transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100% !important;
}

    .modern-date-input:hover[b-3bp734m46w] {
        border-color: rgba(102,126,234,0.3);
    }

/* Action Buttons */
.modern-popup-actions[b-3bp734m46w] {
    padding: 24px 32px;
    background: linear-gradient(to top, rgba(255,255,255,0.9), rgba(255,255,255,0.6));
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(255,255,255,0.5);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.modern-btn[b-3bp734m46w] {
    padding: 12px 28px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
    overflow: hidden !important;
}

    .modern-btn[b-3bp734m46w]::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 0;
        height: 0;
        border-radius: 50%;
        background: rgba(255,255,255,0.3);
        transform: translate(-50%, -50%);
        transition: width 0.6s, height 0.6s;
    }

    .modern-btn:hover[b-3bp734m46w]::before {
        width: 300px;
        height: 300px;
    }

.modern-btn-primary[b-3bp734m46w] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white !important;
    box-shadow: 0 4px 16px rgba(102,126,234,0.4) !important;
}

    .modern-btn-primary:hover[b-3bp734m46w] {
        transform: translateY(-2px) !important;
        box-shadow: 0 8px 24px rgba(102,126,234,0.5) !important;
    }

.modern-btn-secondary[b-3bp734m46w] {
    background: rgba(255,255,255,0.9) !important;
    color: #64748b !important;
    border: 2px solid rgba(100,116,139,0.2) !important;
}

    .modern-btn-secondary:hover[b-3bp734m46w] {
        background: rgba(255,255,255,1) !important;
        border-color: rgba(100,116,139,0.4) !important;
        transform: translateY(-2px) !important;
    }

/* WhatsApp Button Override */
.whatsapp-popup .modern-btn-primary[b-3bp734m46w] {
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
    box-shadow: 0 4px 16px rgba(37,211,102,0.4) !important;
}

    .whatsapp-popup .modern-btn-primary:hover[b-3bp734m46w] {
        box-shadow: 0 8px 24px rgba(37,211,102,0.5) !important;
    }

/* Success Icon */
.success-icon[b-3bp734m46w] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(5, 150, 105, 0.1)) !important;
}

.success-title[b-3bp734m46w] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Link Display */
.link-display-wrapper[b-3bp734m46w] {
    margin-top: 8px !important;
}

.link-display[b-3bp734m46w] {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 16px 18px !important;
    background: white !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

    .link-display:hover[b-3bp734m46w] {
        border-color: #667eea !important;
        box-shadow: 0 6px 20px rgba(102, 126, 234, 0.15) !important;
    }

.link-icon[b-3bp734m46w] {
    flex-shrink: 0 !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.1), rgba(118, 75, 162, 0.1)) !important;
    border-radius: 8px !important;
}

.link-text[b-3bp734m46w] {
    flex: 1 !important;
    font-size: 13px !important;
    color: #475569 !important;
    word-break: break-all !important;
    line-height: 1.5 !important;
    font-weight: 500 !important;
}

/* Share Section */
.share-section[b-3bp734m46w] {
    margin-top: 24px !important;
}

.share-title[b-3bp734m46w] {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    margin: 0 0 16px 0 !important;
    text-align: center !important;
}

.share-buttons[b-3bp734m46w] {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
}

.share-btn[b-3bp734m46w] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 16px 12px !important;
    background: white !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    position: relative !important;
    overflow: hidden !important;
}

    .share-btn[b-3bp734m46w]::before {
        content: '' !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        width: 0 !important;
        height: 0 !important;
        border-radius: 50% !important;
        background: rgba(255,255,255,0.5) !important;
        transform: translate(-50%, -50%) !important;
        transition: width 0.6s, height 0.6s !important;
    }

    .share-btn:hover[b-3bp734m46w]::before {
        width: 200px !important;
        height: 200px !important;
    }

    .share-btn:hover[b-3bp734m46w] {
        transform: translateY(-4px) !important;
    }

    .share-btn svg[b-3bp734m46w] {
        position: relative !important;
        z-index: 1 !important;
    }

    .share-btn span[b-3bp734m46w] {
        position: relative !important;
        z-index: 1 !important;
    }

.copy-btn[b-3bp734m46w] {
    color: #667eea !important;
}

    .copy-btn:hover[b-3bp734m46w] {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        border-color: transparent !important;
        color: white !important;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.4) !important;
    }

.mail-btn[b-3bp734m46w] {
    color: #3b82f6 !important;
}

    .mail-btn:hover[b-3bp734m46w] {
        background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
        border-color: transparent !important;
        color: white !important;
        box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4) !important;
    }

.whatsapp-btn[b-3bp734m46w] {
    color: #25D366 !important;
}

    .whatsapp-btn:hover[b-3bp734m46w] {
        background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
        border-color: transparent !important;
        color: white !important;
        box-shadow: 0 8px 24px rgba(37, 211, 102, 0.4) !important;
    }

/* Animations */
@keyframes fadeInUp-b-3bp734m46w {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.modern-popup .dx-popup-content[b-3bp734m46w] {
    animation: fadeInUp-b-3bp734m46w 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================
   teelfon-tablet
   ============================================ */

@media (max-width: 767px) {
    .modern-popup.dx-popup-wrapper[b-3bp734m46w],
    .modern-popup .dx-popup-wrapper[b-3bp734m46w],
    .modern-popup.dx-widget[b-3bp734m46w],
    .dx-overlay-wrapper.modern-popup .dx-overlay-content[b-3bp734m46w] {
        width: 95vw !important;
        max-width: 95vw !important;
        min-width: unset !important;
        margin: 0 auto !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    .modern-popup .dx-overlay-content[b-3bp734m46w] {
        width: 95vw !important;
        max-width: 95vw !important;
    }

    .modern-popup-content[b-3bp734m46w] {
        padding: 20px !important;
        gap: 16px !important;
    }

    .popup-icon-wrapper[b-3bp734m46w] {
        width: 56px !important;
        height: 56px !important;
    }

        .popup-icon-wrapper svg[b-3bp734m46w] {
            width: 32px !important;
            height: 32px !important;
        }

    .popup-title[b-3bp734m46w] {
        font-size: 20px !important;
    }

    .popup-description[b-3bp734m46w] {
        font-size: 13px !important;
    }

    .date-inputs[b-3bp734m46w] {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .modern-popup-actions[b-3bp734m46w] {
        padding: 16px 20px !important;
        flex-direction: column-reverse !important;
        gap: 8px !important;
    }

    .modern-btn[b-3bp734m46w] {
        width: 100% !important;
        padding: 14px 20px !important;
    }

    .share-buttons[b-3bp734m46w] {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .share-btn[b-3bp734m46w] {
        padding: 14px 16px !important;
    }

    .form-section[b-3bp734m46w] {
        gap: 16px !important;
    }

    .modern-checkbox[b-3bp734m46w] {
        padding: 12px !important;
    }

    .checkbox-group[b-3bp734m46w] {
        gap: 12px !important;
    }
}

@media (max-width: 479px) {
    .modern-popup.dx-popup-wrapper[b-3bp734m46w],
    .modern-popup .dx-popup-wrapper[b-3bp734m46w],
    .modern-popup.dx-widget[b-3bp734m46w],
    .dx-overlay-wrapper.modern-popup .dx-overlay-content[b-3bp734m46w] {
        width: 96vw !important;
        max-width: 96vw !important;
        min-width: unset !important;
        border-radius: 16px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    .modern-popup .dx-overlay-content[b-3bp734m46w] {
        width: 96vw !important;
        max-width: 96vw !important;
    }

    .modern-popup .dx-popup-content[b-3bp734m46w],
    .modern-popup .dx-overlay-content[b-3bp734m46w] {
        border-radius: 16px !important;
    }

    .modern-popup-content[b-3bp734m46w] {
        padding: 16px !important;
        gap: 12px !important;
    }

    .popup-icon-wrapper[b-3bp734m46w] {
        width: 48px !important;
        height: 48px !important;
        border-radius: 12px !important;
    }

        .popup-icon-wrapper svg[b-3bp734m46w] {
            width: 28px !important;
            height: 28px !important;
        }

    .popup-title[b-3bp734m46w] {
        font-size: 18px !important;
        line-height: 1.3 !important;
    }

    .popup-description[b-3bp734m46w] {
        font-size: 12px !important;
    }

    .modern-popup-actions[b-3bp734m46w] {
        padding: 12px 16px !important;
    }

    .modern-btn[b-3bp734m46w] {
        padding: 12px 16px !important;
        font-size: 13px !important;
    }

    .share-btn[b-3bp734m46w] {
        padding: 12px !important;
        font-size: 13px !important;
    }

    .link-display[b-3bp734m46w] {
        padding: 12px 14px !important;
        gap: 10px !important;
    }

    .link-icon[b-3bp734m46w] {
        width: 32px !important;
        height: 32px !important;
    }

        .link-icon svg[b-3bp734m46w] {
            width: 18px !important;
            height: 18px !important;
        }

    .link-text[b-3bp734m46w] {
        font-size: 12px !important;
    }

    .share-title[b-3bp734m46w] {
        font-size: 13px !important;
        margin-bottom: 12px !important;
    }

    .share-btn svg[b-3bp734m46w] {
        width: 18px !important;
        height: 18px !important;
    }

    .modern-checkbox[b-3bp734m46w] {
        padding: 10px !important;
        gap: 10px !important;
    }

    .label-text[b-3bp734m46w] {
        font-size: 14px !important;
    }

    .label-description[b-3bp734m46w] {
        font-size: 12px !important;
    }

    .whatsapp-input .dx-texteditor-input[b-3bp734m46w] {
        padding: 12px 14px !important;
        font-size: 15px !important;
    }

    .input-wrapper .input-label[b-3bp734m46w] {
        font-size: 13px !important;
    }
}

@media (max-width: 359px) {
    .modern-popup.dx-popup-wrapper[b-3bp734m46w],
    .modern-popup .dx-popup-wrapper[b-3bp734m46w],
    .modern-popup.dx-widget[b-3bp734m46w],
    .dx-overlay-wrapper.modern-popup .dx-overlay-content[b-3bp734m46w] {
        width: 98vw !important;
        max-width: 98vw !important;
        min-width: unset !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    .modern-popup .dx-overlay-content[b-3bp734m46w] {
        width: 98vw !important;
        max-width: 98vw !important;
    }

    .popup-title[b-3bp734m46w] {
        font-size: 16px !important;
    }

    .modern-popup-content[b-3bp734m46w] {
        padding: 12px !important;
    }

    .modern-popup-actions[b-3bp734m46w] {
        padding: 10px 12px !important;
    }
}
/* _content/Client/Pages/FinansYonetimi/Cari/CariAraMobil/CariAraMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-68acad56ki] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-68acad56ki] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-68acad56ki] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-68acad56ki] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-68acad56ki] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-68acad56ki] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-68acad56ki]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-68acad56ki] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-68acad56ki] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-68acad56ki] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-68acad56ki] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-68acad56ki] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-68acad56ki] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-68acad56ki] {
        transform: scale(0.98);
    }

.card-header-section[b-68acad56ki] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-68acad56ki] {
    width: 100%;
}

.card-title-row[b-68acad56ki] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-68acad56ki] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-68acad56ki] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-68acad56ki] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-68acad56ki] {
        transform: rotate(0deg);
    }

.card-meta-row[b-68acad56ki] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-68acad56ki] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-68acad56ki] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-68acad56ki] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-68acad56ki] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-68acad56ki] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-68acad56ki] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-68acad56ki] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-68acad56ki] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-68acad56ki] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-68acad56ki] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-68acad56ki] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-68acad56ki] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-68acad56ki] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-68acad56ki] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-68acad56ki] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-68acad56ki] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-68acad56ki] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-68acad56ki] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-68acad56ki] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-68acad56ki] {
        transform: scale(0.95);
    }

.btn-primary[b-68acad56ki] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-68acad56ki] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-68acad56ki] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-68acad56ki] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-68acad56ki] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-68acad56ki] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-68acad56ki] {
        font-size: 14px;
    }

    .card-quick-info[b-68acad56ki] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-68acad56ki] {
        padding: 10px;
    }

    .stok-card[b-68acad56ki] {
        margin: 6px 10px;
    }

    .quick-value[b-68acad56ki] {
        font-size: 15px;
    }

    .card-header-section[b-68acad56ki] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-68acad56ki],
    .stok-card[b-68acad56ki] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-68acad56ki {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-68acad56ki] {
    animation: fadeIn-b-68acad56ki 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-68acad56ki]::-webkit-scrollbar {
        width: 6px;
    }

    [b-68acad56ki]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-68acad56ki]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-68acad56ki]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-68acad56ki],
    .custom-grid[b-68acad56ki] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-68acad56ki],
    [data-bs-theme="dark"] .custom-grid[b-68acad56ki] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-68acad56ki],
    .dxbs-grid-header-content[b-68acad56ki],
    .dxbs-grid-header-panel[b-68acad56ki],
    .dxbs-grid-filter-row[b-68acad56ki],
    .dxbs-grid-command-column[b-68acad56ki],
    .dxbs-grid-selection-column[b-68acad56ki],
    .dxbs-grid-data-column[b-68acad56ki],
    .dxbs-grid-table thead[b-68acad56ki],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-68acad56ki],
    .dxbs-grid-table > tbody > tr > th[b-68acad56ki],
    .dxbs-grid-pager[b-68acad56ki],
    .dxbs-grid-empty-data[b-68acad56ki],
    .dxbs-grid-toolbar[b-68acad56ki],
    .dxbs-grid-statusbar[b-68acad56ki] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-68acad56ki],
    .dxbs-grid-table > tbody[b-68acad56ki],
    .dxbs-grid-table > tbody > tr[b-68acad56ki] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-68acad56ki] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-68acad56ki],
        .dxbs-grid-detail-cell > *[b-68acad56ki] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-68acad56ki] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-68acad56ki],
    .dxbs-grid-header-content[b-68acad56ki],
    .dxbs-grid-filter-row[b-68acad56ki],
    .dxbs-grid-command-column[b-68acad56ki],
    .dxbs-grid-selection-column[b-68acad56ki],
    .dxbs-grid-data-column[b-68acad56ki],
    .dxbs-grid-table thead[b-68acad56ki],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-68acad56ki] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-68acad56ki],
    .dxbs-grid-table > tbody[b-68acad56ki],
    .dxbs-grid-table > tbody > tr[b-68acad56ki] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-68acad56ki] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-68acad56ki] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-68acad56ki] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-68acad56ki] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-68acad56ki] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-68acad56ki] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-68acad56ki] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-68acad56ki] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-68acad56ki]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-68acad56ki] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-68acad56ki] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-68acad56ki] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-68acad56ki] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-68acad56ki] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-68acad56ki] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-68acad56ki] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-68acad56ki] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-68acad56ki] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-68acad56ki] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-68acad56ki] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-68acad56ki] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-68acad56ki] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-68acad56ki] {
    color: #667eea;
}

.separator[b-68acad56ki] {
    color: var(--text-muted);
}

.total-pages[b-68acad56ki] {
    color: var(--text-secondary);
}




.page-size-selector[b-68acad56ki] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-68acad56ki] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-68acad56ki] {
        border-color: #667eea;
    }

.pagination-text[b-68acad56ki] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-68acad56ki] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-68acad56ki] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-68acad56ki] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-68acad56ki] {
        transform: scale(0.98);
    }

.card-header-section[b-68acad56ki] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-68acad56ki] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-68acad56ki] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-68acad56ki] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-68acad56ki] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-68acad56ki] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-68acad56ki] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-68acad56ki] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-68acad56ki] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-68acad56ki] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-68acad56ki] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-68acad56ki] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-68acad56ki] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-68acad56ki] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-68acad56ki] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-68acad56ki] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-68acad56ki] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-68acad56ki] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-68acad56ki] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-68acad56ki] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-68acad56ki] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-68acad56ki] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-68acad56ki] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-68acad56ki] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-68acad56ki] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-68acad56ki] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-68acad56ki] {
        transform: scale(0.95);
    }

.btn-primary[b-68acad56ki] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-68acad56ki] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-68acad56ki] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-68acad56ki] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-68acad56ki] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-68acad56ki] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-68acad56ki] {
        font-size: 14px;
    }

    .card-quick-info[b-68acad56ki] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-68acad56ki] {
        padding: 10px;
    }

    .stok-card[b-68acad56ki] {
        margin: 6px 10px;
    }

    .quick-value[b-68acad56ki] {
        font-size: 15px;
    }

    .card-header-section[b-68acad56ki] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-68acad56ki],
    .stok-card[b-68acad56ki],
    .mobile-pagination[b-68acad56ki],
    .pagination-details[b-68acad56ki] {
        display: none !important;
    }
}

@keyframes fadeIn-b-68acad56ki {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-68acad56ki] {
    animation: fadeIn-b-68acad56ki 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-68acad56ki]::-webkit-scrollbar {
        width: 6px;
    }

    [b-68acad56ki]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-68acad56ki]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-68acad56ki]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-68acad56ki] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-68acad56ki] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-68acad56ki] {
    background: #0f172a;
}

.pagination-btn[b-68acad56ki] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-68acad56ki] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-68acad56ki] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-68acad56ki] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-68acad56ki] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-68acad56ki] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-68acad56ki] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-68acad56ki] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-68acad56ki] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-68acad56ki] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-68acad56ki] {
        border-color: #667eea;
    }

.pagination-text[b-68acad56ki] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-68acad56ki] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-68acad56ki] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-68acad56ki] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-68acad56ki]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-68acad56ki] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-68acad56ki] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-68acad56ki] {
        transform: scale(0.95);
    }

#faturaContainer[b-68acad56ki] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Cari/CariHesapIslemleriMobil/CariHesapIslemleriMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-iq0xqnzbl5] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-iq0xqnzbl5] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-iq0xqnzbl5] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-iq0xqnzbl5] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-iq0xqnzbl5] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-iq0xqnzbl5] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-iq0xqnzbl5]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-iq0xqnzbl5] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-iq0xqnzbl5] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-iq0xqnzbl5] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-iq0xqnzbl5] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-iq0xqnzbl5] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-iq0xqnzbl5] {
        transform: scale(0.98);
    }

.card-header-section[b-iq0xqnzbl5] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-iq0xqnzbl5] {
    width: 100%;
}

.card-title-row[b-iq0xqnzbl5] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-iq0xqnzbl5] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-iq0xqnzbl5] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-iq0xqnzbl5] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-iq0xqnzbl5] {
        transform: rotate(0deg);
    }

.card-meta-row[b-iq0xqnzbl5] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-iq0xqnzbl5] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-iq0xqnzbl5] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-iq0xqnzbl5] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-iq0xqnzbl5] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-iq0xqnzbl5] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-iq0xqnzbl5] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-iq0xqnzbl5] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-iq0xqnzbl5] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-iq0xqnzbl5] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-iq0xqnzbl5] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-iq0xqnzbl5] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-iq0xqnzbl5] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-iq0xqnzbl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-iq0xqnzbl5] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-iq0xqnzbl5] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-iq0xqnzbl5] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-iq0xqnzbl5] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-iq0xqnzbl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-iq0xqnzbl5] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

.btn-primary[b-iq0xqnzbl5] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-iq0xqnzbl5] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-iq0xqnzbl5] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-iq0xqnzbl5] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-iq0xqnzbl5] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-iq0xqnzbl5] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-iq0xqnzbl5] {
        font-size: 14px;
    }

    .card-quick-info[b-iq0xqnzbl5] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-iq0xqnzbl5] {
        padding: 10px;
    }

    .stok-card[b-iq0xqnzbl5] {
        margin: 6px 10px;
    }

    .quick-value[b-iq0xqnzbl5] {
        font-size: 15px;
    }

    .card-header-section[b-iq0xqnzbl5] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-iq0xqnzbl5],
    .stok-card[b-iq0xqnzbl5] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-iq0xqnzbl5 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-iq0xqnzbl5] {
    animation: fadeIn-b-iq0xqnzbl5 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-iq0xqnzbl5]::-webkit-scrollbar {
        width: 6px;
    }

    [b-iq0xqnzbl5]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-iq0xqnzbl5]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-iq0xqnzbl5]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-iq0xqnzbl5],
    .custom-grid[b-iq0xqnzbl5] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-iq0xqnzbl5],
    [data-bs-theme="dark"] .custom-grid[b-iq0xqnzbl5] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-iq0xqnzbl5],
    .dxbs-grid-header-content[b-iq0xqnzbl5],
    .dxbs-grid-header-panel[b-iq0xqnzbl5],
    .dxbs-grid-filter-row[b-iq0xqnzbl5],
    .dxbs-grid-command-column[b-iq0xqnzbl5],
    .dxbs-grid-selection-column[b-iq0xqnzbl5],
    .dxbs-grid-data-column[b-iq0xqnzbl5],
    .dxbs-grid-table thead[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody > tr > th[b-iq0xqnzbl5],
    .dxbs-grid-pager[b-iq0xqnzbl5],
    .dxbs-grid-empty-data[b-iq0xqnzbl5],
    .dxbs-grid-toolbar[b-iq0xqnzbl5],
    .dxbs-grid-statusbar[b-iq0xqnzbl5] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody > tr[b-iq0xqnzbl5] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-iq0xqnzbl5] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-iq0xqnzbl5],
        .dxbs-grid-detail-cell > *[b-iq0xqnzbl5] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-iq0xqnzbl5] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-iq0xqnzbl5],
    .dxbs-grid-header-content[b-iq0xqnzbl5],
    .dxbs-grid-filter-row[b-iq0xqnzbl5],
    .dxbs-grid-command-column[b-iq0xqnzbl5],
    .dxbs-grid-selection-column[b-iq0xqnzbl5],
    .dxbs-grid-data-column[b-iq0xqnzbl5],
    .dxbs-grid-table thead[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-iq0xqnzbl5] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody[b-iq0xqnzbl5],
    .dxbs-grid-table > tbody > tr[b-iq0xqnzbl5] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-iq0xqnzbl5] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-iq0xqnzbl5] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-iq0xqnzbl5] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-iq0xqnzbl5] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-iq0xqnzbl5] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-iq0xqnzbl5] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-iq0xqnzbl5] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-iq0xqnzbl5] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-iq0xqnzbl5]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-iq0xqnzbl5] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-iq0xqnzbl5] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-iq0xqnzbl5] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-iq0xqnzbl5] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-iq0xqnzbl5] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-iq0xqnzbl5] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-iq0xqnzbl5] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-iq0xqnzbl5] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-iq0xqnzbl5] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-iq0xqnzbl5] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-iq0xqnzbl5] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-iq0xqnzbl5] {
    color: #667eea;
}

.separator[b-iq0xqnzbl5] {
    color: var(--text-muted);
}

.total-pages[b-iq0xqnzbl5] {
    color: var(--text-secondary);
}




.page-size-selector[b-iq0xqnzbl5] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-iq0xqnzbl5] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-iq0xqnzbl5] {
        border-color: #667eea;
    }

.pagination-text[b-iq0xqnzbl5] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-iq0xqnzbl5] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-iq0xqnzbl5] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-iq0xqnzbl5] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-iq0xqnzbl5] {
        transform: scale(0.98);
    }

.card-header-section[b-iq0xqnzbl5] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-iq0xqnzbl5] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-iq0xqnzbl5] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-iq0xqnzbl5] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-iq0xqnzbl5] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-iq0xqnzbl5] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-iq0xqnzbl5] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-iq0xqnzbl5] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-iq0xqnzbl5] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-iq0xqnzbl5] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-iq0xqnzbl5] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-iq0xqnzbl5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-iq0xqnzbl5] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-iq0xqnzbl5] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-iq0xqnzbl5] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-iq0xqnzbl5] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-iq0xqnzbl5] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-iq0xqnzbl5] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-iq0xqnzbl5] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-iq0xqnzbl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-iq0xqnzbl5] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-iq0xqnzbl5] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-iq0xqnzbl5] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-iq0xqnzbl5] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-iq0xqnzbl5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-iq0xqnzbl5] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

.btn-primary[b-iq0xqnzbl5] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-iq0xqnzbl5] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-iq0xqnzbl5] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-iq0xqnzbl5] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-iq0xqnzbl5] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-iq0xqnzbl5] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-iq0xqnzbl5] {
        font-size: 14px;
    }

    .card-quick-info[b-iq0xqnzbl5] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-iq0xqnzbl5] {
        padding: 10px;
    }

    .stok-card[b-iq0xqnzbl5] {
        margin: 6px 10px;
    }

    .quick-value[b-iq0xqnzbl5] {
        font-size: 15px;
    }

    .card-header-section[b-iq0xqnzbl5] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-iq0xqnzbl5],
    .stok-card[b-iq0xqnzbl5],
    .mobile-pagination[b-iq0xqnzbl5],
    .pagination-details[b-iq0xqnzbl5] {
        display: none !important;
    }
}

@keyframes fadeIn-b-iq0xqnzbl5 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-iq0xqnzbl5] {
    animation: fadeIn-b-iq0xqnzbl5 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-iq0xqnzbl5]::-webkit-scrollbar {
        width: 6px;
    }

    [b-iq0xqnzbl5]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-iq0xqnzbl5]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-iq0xqnzbl5]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-iq0xqnzbl5] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-iq0xqnzbl5] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-iq0xqnzbl5] {
    background: #0f172a;
}

.pagination-btn[b-iq0xqnzbl5] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-iq0xqnzbl5] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-iq0xqnzbl5] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-iq0xqnzbl5] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-iq0xqnzbl5] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-iq0xqnzbl5] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-iq0xqnzbl5] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-iq0xqnzbl5] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-iq0xqnzbl5] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-iq0xqnzbl5] {
        border-color: #667eea;
    }

.pagination-text[b-iq0xqnzbl5] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-iq0xqnzbl5] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-iq0xqnzbl5] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-iq0xqnzbl5] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-iq0xqnzbl5]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-iq0xqnzbl5] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-iq0xqnzbl5] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-iq0xqnzbl5] {
        transform: scale(0.95);
    }

#faturaContainer[b-iq0xqnzbl5] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Cari/CariKartMobil/CariKartMobil.razor.rz.scp.css */
/* ========================================
   STOK MOBİL COMPONENT STYLES
   ======================================== */

:root[b-tgtm63o1sx] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-tgtm63o1sx] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* Container */
.stok-mobil-container[b-tgtm63o1sx] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    background: var(--info-row-bg);
    overflow: hidden;
    position: relative;
}

/* ========================================
   HEADER SECTION
   ======================================== */
.stok-mobil-header[b-tgtm63o1sx] {
    background: var(--primary-gradient);
    padding: 16px;
    padding-top: calc(env(safe-area-inset-top) + 16px);
    box-shadow: var(--shadow-md);
    position: relative;
    z-index: 10;
}

    .stok-mobil-header[b-tgtm63o1sx]::after {
        content: '';
        position: absolute;
        bottom: -20px;
        left: 0;
        right: 0;
        height: 20px;
        background: var(--primary-gradient);
        border-radius: 0 0 50% 50% / 0 0 100% 100%;
    }

.header-content[b-tgtm63o1sx] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.stok-image-wrapper[b-tgtm63o1sx] {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    padding: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.stok-image[b-tgtm63o1sx] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 12px;
    background: white;
}

.stok-info[b-tgtm63o1sx] {
    flex: 1;
    min-width: 0;
    color: white;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ========================================
   EDITABLE HEADER INPUTS
   ======================================== */
.stok-kod-input[b-tgtm63o1sx] {
    width: 100%;
    font-size: 12px;
    font-weight: 600;
    color: white;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 6px 10px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    transition: all 0.3s ease;
}

    .stok-kod-input[b-tgtm63o1sx]::placeholder {
        color: rgba(255, 255, 255, 0.6);
    }

    .stok-kod-input:focus[b-tgtm63o1sx] {
        outline: none;
        background: rgba(255, 255, 255, 0.25);
        border-color: rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1);
    }

.stok-adi-input[b-tgtm63o1sx] {
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    color: white;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 8px 12px;
    transition: all 0.3s ease;
}

    .stok-adi-input[b-tgtm63o1sx]::placeholder {
        color: rgba(255, 255, 255, 0.6);
    }

    .stok-adi-input:focus[b-tgtm63o1sx] {
        outline: none;
        background: rgba(255, 255, 255, 0.25);
        border-color: rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1);
    }

/* Durum Toggle Button */
.stok-durum-wrapper[b-tgtm63o1sx] {
    display: flex;
    align-items: center;
}

.stok-durum-toggle[b-tgtm63o1sx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 500;
    padding: 6px 12px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
}

    .stok-durum-toggle:hover[b-tgtm63o1sx] {
        background: rgba(255, 255, 255, 0.3);
        transform: scale(1.05);
    }

    .stok-durum-toggle:active[b-tgtm63o1sx] {
        transform: scale(0.98);
    }

    .stok-durum-toggle i[b-tgtm63o1sx] {
        font-size: 8px;
        transition: all 0.3s ease;
    }

    .stok-durum-toggle.aktif[b-tgtm63o1sx] {
        background: rgba(72, 187, 120, 0.3);
        border-color: rgba(72, 187, 120, 0.5);
    }

        .stok-durum-toggle.aktif i[b-tgtm63o1sx] {
            color: #48bb78;
            animation: pulse-b-tgtm63o1sx 2s ease-in-out infinite;
        }

    .stok-durum-toggle.pasif[b-tgtm63o1sx] {
        background: rgba(245, 101, 101, 0.3);
        border-color: rgba(245, 101, 101, 0.5);
    }

        .stok-durum-toggle.pasif i[b-tgtm63o1sx] {
            color: #f56565;
        }

@keyframes pulse-b-tgtm63o1sx {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.6;
        transform: scale(1.2);
    }
}

/* ========================================
   TAB NAVIGATION
   ======================================== */
.stok-mobil-tabs[b-tgtm63o1sx] {
    background: var(--card-bg);
    padding: 8px 12px 0;
    margin-top: 12px;
    position: relative;
    z-index: 5;
    box-shadow: var(--shadow-sm);
}

.tabs-wrapper[b-tgtm63o1sx] {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
}

    .tabs-wrapper[b-tgtm63o1sx]::-webkit-scrollbar {
        display: none;
    }

.tab-item[b-tgtm63o1sx] {
    flex: 1;
    min-width: 75px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 12px 8px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    border-radius: 12px 12px 0 0;
}

    .tab-item i[b-tgtm63o1sx] {
        font-size: 18px;
        transition: all 0.3s ease;
    }

    .tab-item span[b-tgtm63o1sx] {
        white-space: nowrap;
    }

    .tab-item[b-tgtm63o1sx]::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 3px;
        background: var(--primary-gradient);
        border-radius: 3px 3px 0 0;
        transition: width 0.3s ease;
    }

    .tab-item:hover[b-tgtm63o1sx] {
        color: var(--text-secondary);
        background: var(--info-row-bg);
    }

    .tab-item.active[b-tgtm63o1sx] {
        color: #667eea;
        background: var(--info-row-bg);
    }

        .tab-item.active[b-tgtm63o1sx]::after {
            width: 70%;
        }

        .tab-item.active i[b-tgtm63o1sx] {
            transform: scale(1.1);
        }

/* ========================================
   TAB CONTENT AREA
   ======================================== */
.stok-mobil-content[b-tgtm63o1sx] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--info-row-bg);
    position: relative;
    -webkit-overflow-scrolling: touch;
}

.tab-content-wrapper[b-tgtm63o1sx] {
    min-height: 100%;
    padding-bottom: 100px;
}

.tab-pane[b-tgtm63o1sx] {
    display: none;
    padding: 16px;
    animation: fadeIn-b-tgtm63o1sx 0.3s ease;
}

    .tab-pane.active[b-tgtm63o1sx] {
        display: block;
    }

@keyframes fadeIn-b-tgtm63o1sx {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Empty Tab Content */
.empty-tab-content[b-tgtm63o1sx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: var(--text-muted);
    text-align: center;
    gap: 12px;
}

    .empty-tab-content i[b-tgtm63o1sx] {
        font-size: 48px;
        opacity: 0.5;
    }

    .empty-tab-content span[b-tgtm63o1sx] {
        font-size: 14px;
    }

/* Loading Overlay */
.loading-overlay[b-tgtm63o1sx] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.loading-spinner[b-tgtm63o1sx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    color: var(--text-muted);
}

.spinner[b-tgtm63o1sx] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border-color);
    border-top-color: #667eea;
    border-radius: 50%;
    animation: spin-b-tgtm63o1sx 0.8s linear infinite;
}

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

/* ========================================
   BOTTOM ACTION BAR
   ======================================== */
.stok-mobil-actions[b-tgtm63o1sx] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    padding-bottom: calc(env(safe-area-inset-bottom) + 12px);
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.1);
    z-index: 100;
}

.action-btn[b-tgtm63o1sx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    border: none;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    min-height: 48px;
}

    .action-btn:disabled[b-tgtm63o1sx] {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none !important;
    }

    .action-btn i[b-tgtm63o1sx] {
        font-size: 16px;
    }

    .action-btn span[b-tgtm63o1sx] {
        white-space: nowrap;
    }

/* Save Button */
.save-btn[b-tgtm63o1sx] {
    flex: 2;
    background: var(--success-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(72, 187, 120, 0.3);
}

    .save-btn:not(:disabled):hover[b-tgtm63o1sx] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(72, 187, 120, 0.4);
    }

    .save-btn:not(:disabled):active[b-tgtm63o1sx] {
        transform: translateY(0);
    }

/* Delete Button */
.delete-btn[b-tgtm63o1sx] {
    flex: 2;
    background: var(--danger-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(245, 101, 101, 0.3);
}

    .delete-btn:not(:disabled):hover[b-tgtm63o1sx] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(245, 101, 101, 0.4);
    }

    .delete-btn:not(:disabled):active[b-tgtm63o1sx] {
        transform: translateY(0);
    }

/* Info Button */
.info-btn[b-tgtm63o1sx] {
    flex: 0 0 48px;
    background: var(--card-header-bg);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

    .info-btn:not(:disabled):hover[b-tgtm63o1sx] {
        background: var(--primary-gradient);
        color: white;
        border-color: transparent;
    }

/* Close Button */
.close-btn[b-tgtm63o1sx] {
    flex: 0 0 48px;
    background: var(--card-header-bg);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

    .close-btn:hover[b-tgtm63o1sx] {
        background: var(--danger-gradient);
        color: white;
        border-color: transparent;
    }

/* ========================================
   FORM ELEMENTS (Generic Styling)
   ======================================== */
.stok-mobil-content .form-group[b-tgtm63o1sx] {
    margin-bottom: 16px;
}

.stok-mobil-content .form-label[b-tgtm63o1sx] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stok-mobil-content .form-control[b-tgtm63o1sx] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
}

    .stok-mobil-content .form-control:focus[b-tgtm63o1sx] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
    }

/* Card Styling for Tab Content */
.stok-mobil-content .mobile-card[b-tgtm63o1sx] {
    background: var(--card-bg);
    border-radius: 16px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.stok-mobil-content .mobile-card-header[b-tgtm63o1sx] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    gap: 8px;
}

    .stok-mobil-content .mobile-card-header i[b-tgtm63o1sx] {
        color: #667eea;
    }

/* Info Row Styling */
.stok-mobil-content .info-row[b-tgtm63o1sx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-color);
}

    .stok-mobil-content .info-row:last-child[b-tgtm63o1sx] {
        border-bottom: none;
    }

.stok-mobil-content .info-label[b-tgtm63o1sx] {
    font-size: 13px;
    color: var(--text-muted);
}

.stok-mobil-content .info-value[b-tgtm63o1sx] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    text-align: right;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .stok-mobil-header[b-tgtm63o1sx] {
        padding: 12px;
    }

    .stok-image-wrapper[b-tgtm63o1sx] {
        width: 60px;
        height: 60px;
    }

    .stok-kod-input[b-tgtm63o1sx] {
        font-size: 11px;
        padding: 5px 8px;
    }

    .stok-adi-input[b-tgtm63o1sx] {
        font-size: 16px;
        padding: 7px 10px;
    }

    .stok-durum-toggle[b-tgtm63o1sx] {
        font-size: 11px;
        padding: 5px 10px;
    }

    .tab-item[b-tgtm63o1sx] {
        min-width: 65px;
        padding: 10px 6px;
    }

        .tab-item i[b-tgtm63o1sx] {
            font-size: 16px;
        }

        .tab-item span[b-tgtm63o1sx] {
            font-size: 10px;
        }

    .action-btn[b-tgtm63o1sx] {
        padding: 10px 12px;
        font-size: 12px;
    }

        .action-btn span[b-tgtm63o1sx] {
            display: none;
        }

    .save-btn span[b-tgtm63o1sx],
    .delete-btn span[b-tgtm63o1sx] {
        display: inline;
    }
}

@media (min-width: 576px) {
    .stok-mobil-container[b-tgtm63o1sx] {
        max-width: 576px;
        margin: 0 auto;
    }

    .stok-mobil-actions[b-tgtm63o1sx] {
        max-width: 576px;
        left: 50%;
        transform: translateX(-50%);
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .stok-mobil-header[b-tgtm63o1sx] {
        padding: 10px 16px;
    }

        .stok-mobil-header[b-tgtm63o1sx]::after {
            display: none;
        }

    .stok-image-wrapper[b-tgtm63o1sx] {
        width: 50px;
        height: 50px;
    }

    .stok-kod-input[b-tgtm63o1sx] {
        font-size: 11px;
    }

    .stok-adi-input[b-tgtm63o1sx] {
        font-size: 14px;
    }

    .stok-mobil-tabs[b-tgtm63o1sx] {
        margin-top: 0;
    }

    .tab-item[b-tgtm63o1sx] {
        flex-direction: row;
        gap: 6px;
        padding: 8px 12px;
    }
}

/* Dark Mode Specific Overrides */
[data-bs-theme="dark"] .stok-image[b-tgtm63o1sx] {
    background: #2d3748;
}

[data-bs-theme="dark"] .tab-item.active[b-tgtm63o1sx] {
    color: #a78bfa;
}

[data-bs-theme="dark"] .spinner[b-tgtm63o1sx] {
    border-top-color: #a78bfa;
}

[data-bs-theme="dark"] .stok-kod-input[b-tgtm63o1sx],
[data-bs-theme="dark"] .stok-adi-input[b-tgtm63o1sx] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.15);
}

    [data-bs-theme="dark"] .stok-kod-input:focus[b-tgtm63o1sx],
    [data-bs-theme="dark"] .stok-adi-input:focus[b-tgtm63o1sx] {
        background: rgba(255, 255, 255, 0.15);
        border-color: rgba(255, 255, 255, 0.3);
    }
/* _content/Client/Pages/FinansYonetimi/Cari/CariKartMobil/CariKartMobil_FaturaSevk.razor.rz.scp.css */
/* ========================================
   STOK MOBİL GENEL TAB STYLES
   ======================================== */

:root[b-5hh2f9wp33] {
    --primary-color: #667eea;
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --input-focus-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

[data-bs-theme="dark"][b-5hh2f9wp33] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --input-focus-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}

/* ========================================
   MAIN CONTAINER
   ======================================== */
.mobil-genel-container[b-5hh2f9wp33] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    width: 100%;
}

/* ========================================
   MOBILE CARD COMPONENTS
   ======================================== */
.mobile-card[b-5hh2f9wp33] {
    background: var(--card-bg);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.mobile-card-header[b-5hh2f9wp33] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .mobile-card-header i[b-5hh2f9wp33] {
        color: var(--primary-color);
        font-size: 18px;
        flex-shrink: 0;
    }

    .mobile-card-header span[b-5hh2f9wp33] {
        flex: 1;
    }

.mobile-card-body[b-5hh2f9wp33] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ========================================
   FORM GROUPS
   ======================================== */
.form-group-mobile[b-5hh2f9wp33] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label-mobile[b-5hh2f9wp33] {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

/* ========================================
   FORM CONTROLS
   ======================================== */
.form-control-mobile[b-5hh2f9wp33] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

    .form-control-mobile:focus[b-5hh2f9wp33] {
        outline: none;
        border-color: var(--primary-color);
        box-shadow: var(--input-focus-shadow);
    }

    .form-control-mobile:disabled[b-5hh2f9wp33] {
        opacity: 0.6;
        cursor: not-allowed;
        background: var(--info-row-bg);
    }

/* Select specific styling */
select.form-control-mobile[b-5hh2f9wp33] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23718096' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 12px;
    padding-right: 40px;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .mobile-card-header[b-5hh2f9wp33] {
        padding: 12px 14px;
        font-size: 13px;
    }

        .mobile-card-header i[b-5hh2f9wp33] {
            font-size: 16px;
        }

    .mobile-card-body[b-5hh2f9wp33] {
        padding: 14px;
        gap: 14px;
    }

    .form-control-mobile[b-5hh2f9wp33] {
        padding: 10px 12px;
        font-size: 13px;
    }

    .form-label-mobile[b-5hh2f9wp33] {
        font-size: 10px;
    }

    .btn-addon[b-5hh2f9wp33] {
        min-width: 40px;
        padding: 0 10px;
    }
}

@media (min-width: 576px) {
    .mobil-genel-container[b-5hh2f9wp33] {
        padding: 0 8px;
    }

    .mobile-card[b-5hh2f9wp33] {
        border-radius: 20px;
    }

    .mobile-card-body[b-5hh2f9wp33] {
        padding: 20px;
        gap: 18px;
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .mobil-genel-container[b-5hh2f9wp33] {
        gap: 8px;
    }

    .mobile-card[b-5hh2f9wp33] {
        border-radius: 12px;
    }

    .mobile-card-header[b-5hh2f9wp33] {
        padding: 10px 14px;
    }

    .mobile-card-body[b-5hh2f9wp33] {
        padding: 12px;
        gap: 12px;
    }

    .form-control-mobile[b-5hh2f9wp33] {
        padding: 8px 12px;
    }

    .form-group-mobile[b-5hh2f9wp33] {
        gap: 6px;
    }
}

/* ========================================
   DARK MODE OVERRIDES
   ======================================== */
[data-bs-theme="dark"] .mobile-card[b-5hh2f9wp33] {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .mobile-card-header[b-5hh2f9wp33] {
    background: var(--card-header-bg);
}

    [data-bs-theme="dark"] .mobile-card-header i[b-5hh2f9wp33] {
        color: #a78bfa;
    }

[data-bs-theme="dark"] .form-control-mobile[b-5hh2f9wp33] {
    background: var(--card-bg);
    color: var(--text-primary);
    border-color: var(--border-color);
}

    [data-bs-theme="dark"] .form-control-mobile:focus[b-5hh2f9wp33] {
        border-color: #a78bfa;
        box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15);
    }

[data-bs-theme="dark"] select.form-control-mobile[b-5hh2f9wp33] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2394a3b8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .btn-addon[b-5hh2f9wp33] {
    background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
}

/* ========================================
   ACCESSIBILITY
   ======================================== */
.form-control-mobile:focus-visible[b-5hh2f9wp33] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.btn-addon:focus-visible[b-5hh2f9wp33] {
    outline: 2px solid white;
    outline-offset: 2px;
}

/* ========================================
   TOUCH OPTIMIZATION
   ======================================== */
@media (hover: none) and (pointer: coarse) {
    .form-control-mobile[b-5hh2f9wp33],
    .btn-addon[b-5hh2f9wp33] {
        min-height: 44px;
    }
}
/* _content/Client/Pages/FinansYonetimi/Cari/CariKartMobil/CariKartMobil_Hareketler.razor.rz.scp.css */
/* ============================================
   HAREKET MOBİL CONTAINER
   ============================================ */
.hareket-mobil-container[b-7zopz3ipmm] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--card-bg);
}

/* ============================================
   HAREKET TABS
   ============================================ */
.hareket-tabs[b-7zopz3ipmm] {
    display: flex;
    background: var(--card-header-bg);
    border-bottom: 2px solid var(--border-color);
    padding: 8px 12px;
    gap: 8px;
}

.hareket-tab[b-7zopz3ipmm] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .hareket-tab i[b-7zopz3ipmm] {
        font-size: 16px;
    }

    .hareket-tab:active[b-7zopz3ipmm] {
        transform: scale(0.95);
    }

    .hareket-tab.active[b-7zopz3ipmm] {
        background: var(--primary-gradient);
        color: white;
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
    }

/* ============================================
   FİLTRE SECTİON
   ============================================ */
.hareket-filter-section[b-7zopz3ipmm] {
    padding: 12px;
    background: var(--info-row-bg);
    border-bottom: 1px solid var(--border-color);
}

.filter-row[b-7zopz3ipmm] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.filter-item[b-7zopz3ipmm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .filter-item.full-width[b-7zopz3ipmm] {
        flex: 1 1 100%;
    }

.filter-label[b-7zopz3ipmm] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .filter-label i[b-7zopz3ipmm] {
        color: #667eea;
        font-size: 12px;
    }

.filter-input[b-7zopz3ipmm],
.filter-select[b-7zopz3ipmm] {
    width: 100%;
    padding: 8px 12px;
    border: 2px solid var(--border-color);
    border-radius: 8px;
    background: var(--card-bg);
    color: var(--text-primary);
    font-size: 13px;
    font-weight: 600;
    transition: all 0.2s ease;
}

    .filter-input:focus[b-7zopz3ipmm],
    .filter-select:focus[b-7zopz3ipmm] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

.filter-actions[b-7zopz3ipmm] {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.filter-btn[b-7zopz3ipmm] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .filter-btn i[b-7zopz3ipmm] {
        font-size: 14px;
    }

    .filter-btn:active[b-7zopz3ipmm] {
        transform: scale(0.95);
    }

.search-btn[b-7zopz3ipmm] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .search-btn:hover[b-7zopz3ipmm] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
    }

.report-btn[b-7zopz3ipmm] {
    background: var(--success-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(72, 187, 120, 0.3);
}

    .report-btn:hover[b-7zopz3ipmm] {
        box-shadow: 0 6px 16px rgba(72, 187, 120, 0.4);
    }

/* ============================================
   HAREKET CONTENT
   ============================================ */
.hareket-content[b-7zopz3ipmm] {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
}

/* ============================================
   LOADING
   ============================================ */
.loading-container[b-7zopz3ipmm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    gap: 12px;
}

    .loading-container span[b-7zopz3ipmm] {
        font-size: 14px;
        font-weight: 600;
        color: var(--text-secondary);
    }

.spinner[b-7zopz3ipmm] {
    width: 40px;
    height: 40px;
    border: 4px solid var(--border-color);
    border-top-color: #667eea;
    border-radius: 50%;
    animation: spin-b-7zopz3ipmm 0.8s linear infinite;
}

@keyframes spin-b-7zopz3ipmm {
    to {
        transform: rotate(360deg);
    }
}

/* ============================================
   HAREKET LIST & CARDS
   ============================================ */
.hareket-list[b-7zopz3ipmm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.hareket-card[b-7zopz3ipmm] {
    background: var(--card-bg);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 2px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .hareket-card:active[b-7zopz3ipmm] {
        transform: scale(0.98);
    }

    .hareket-card:hover[b-7zopz3ipmm] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
    }

.hareket-card-header[b-7zopz3ipmm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.hareket-main-info[b-7zopz3ipmm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.hareket-title[b-7zopz3ipmm] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    line-height: 1.3;
}

.hareket-date[b-7zopz3ipmm] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
}

    .hareket-date i[b-7zopz3ipmm] {
        color: #667eea;
        font-size: 11px;
    }

.hareket-arrow[b-7zopz3ipmm] {
    font-size: 18px;
    color: #667eea;
    transition: all 0.3s ease;
}

.hareket-card:hover .hareket-arrow[b-7zopz3ipmm] {
    transform: translateX(4px);
}

.hareket-card-body[b-7zopz3ipmm] {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.hareket-info-row[b-7zopz3ipmm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 10px;
    background: var(--info-row-bg);
    border-radius: 8px;
    transition: all 0.2s ease;
}

    .hareket-info-row:hover[b-7zopz3ipmm] {
        background: var(--border-color);
    }

.hareket-label[b-7zopz3ipmm] {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
}

.hareket-value[b-7zopz3ipmm] {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-primary);
    text-align: right;
}

    .hareket-value.highlight[b-7zopz3ipmm] {
        color: #667eea;
        font-size: 14px;
    }

    .hareket-value.price[b-7zopz3ipmm] {
        color: #48bb78;
        font-size: 14px;
    }

    .hareket-value.out[b-7zopz3ipmm] {
        color: #f56565;
        font-size: 14px;
    }

/* ============================================
   EMPTY STATE
   ============================================ */
.empty-state[b-7zopz3ipmm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
}

    .empty-state i[b-7zopz3ipmm] {
        font-size: 64px;
        color: var(--text-muted);
        opacity: 0.5;
    }

    .empty-state p[b-7zopz3ipmm] {
        font-size: 15px;
        font-weight: 600;
        color: var(--text-secondary);
        margin: 0;
    }

/* ============================================
   RESPONSİVE
   ============================================ */
@media (max-width: 360px) {
    .hareket-tab span[b-7zopz3ipmm] {
        font-size: 11px;
    }

    .hareket-title[b-7zopz3ipmm] {
        font-size: 14px;
    }

    .filter-btn span[b-7zopz3ipmm] {
        display: none;
    }

    .filter-btn i[b-7zopz3ipmm] {
        font-size: 16px;
    }
}

/* ============================================
   DARK MODE
   ============================================ */
[data-bs-theme="dark"] .hareket-mobil-container[b-7zopz3ipmm] {
    background: #0f172a;
}

[data-bs-theme="dark"] .hareket-card[b-7zopz3ipmm] {
    background: #1e293b;
}

[data-bs-theme="dark"] .hareket-card-header[b-7zopz3ipmm] {
    background: #334155;
}

[data-bs-theme="dark"] .filter-input[b-7zopz3ipmm],
[data-bs-theme="dark"] .filter-select[b-7zopz3ipmm] {
    background: #1e293b;
    border-color: #334155;
}

    [data-bs-theme="dark"] .filter-input:focus[b-7zopz3ipmm],
    [data-bs-theme="dark"] .filter-select:focus[b-7zopz3ipmm] {
        border-color: #667eea;
    }

/* ============================================
   SCROLLBAR
   ============================================ */
.hareket-content[b-7zopz3ipmm]::-webkit-scrollbar {
    width: 6px;
}

.hareket-content[b-7zopz3ipmm]::-webkit-scrollbar-track {
    background: var(--info-row-bg);
}

.hareket-content[b-7zopz3ipmm]::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 3px;
}

    .hareket-content[b-7zopz3ipmm]::-webkit-scrollbar-thumb:hover {
        background: #667eea;
    }
/* _content/Client/Pages/FinansYonetimi/Cari/CariKartMobil/CariKartMobil_Ticari.razor.rz.scp.css */
/* ========================================
   STOK MOBİL GENEL TAB STYLES
   ======================================== */

:root[b-xzwpdnptre] {
    --primary-color: #667eea;
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --input-focus-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

[data-bs-theme="dark"][b-xzwpdnptre] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --input-focus-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}

/* ========================================
   MAIN CONTAINER
   ======================================== */
.mobil-genel-container[b-xzwpdnptre] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    width: 100%;
}

/* ========================================
   MOBILE CARD COMPONENTS
   ======================================== */
.mobile-card[b-xzwpdnptre] {
    background: var(--card-bg);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.mobile-card-header[b-xzwpdnptre] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .mobile-card-header i[b-xzwpdnptre] {
        color: var(--primary-color);
        font-size: 18px;
        flex-shrink: 0;
    }

    .mobile-card-header span[b-xzwpdnptre] {
        flex: 1;
    }

.mobile-card-body[b-xzwpdnptre] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ========================================
   FORM GROUPS
   ======================================== */
.form-group-mobile[b-xzwpdnptre] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label-mobile[b-xzwpdnptre] {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

/* ========================================
   FORM CONTROLS
   ======================================== */
.form-control-mobile[b-xzwpdnptre] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

    .form-control-mobile:focus[b-xzwpdnptre] {
        outline: none;
        border-color: var(--primary-color);
        box-shadow: var(--input-focus-shadow);
    }

    .form-control-mobile:disabled[b-xzwpdnptre] {
        opacity: 0.6;
        cursor: not-allowed;
        background: var(--info-row-bg);
    }

/* Select specific styling */
select.form-control-mobile[b-xzwpdnptre] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23718096' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 12px;
    padding-right: 40px;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .mobile-card-header[b-xzwpdnptre] {
        padding: 12px 14px;
        font-size: 13px;
    }

        .mobile-card-header i[b-xzwpdnptre] {
            font-size: 16px;
        }

    .mobile-card-body[b-xzwpdnptre] {
        padding: 14px;
        gap: 14px;
    }

    .form-control-mobile[b-xzwpdnptre] {
        padding: 10px 12px;
        font-size: 13px;
    }

    .form-label-mobile[b-xzwpdnptre] {
        font-size: 10px;
    }

    .btn-addon[b-xzwpdnptre] {
        min-width: 40px;
        padding: 0 10px;
    }
}

@media (min-width: 576px) {
    .mobil-genel-container[b-xzwpdnptre] {
        padding: 0 8px;
    }

    .mobile-card[b-xzwpdnptre] {
        border-radius: 20px;
    }

    .mobile-card-body[b-xzwpdnptre] {
        padding: 20px;
        gap: 18px;
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .mobil-genel-container[b-xzwpdnptre] {
        gap: 8px;
    }

    .mobile-card[b-xzwpdnptre] {
        border-radius: 12px;
    }

    .mobile-card-header[b-xzwpdnptre] {
        padding: 10px 14px;
    }

    .mobile-card-body[b-xzwpdnptre] {
        padding: 12px;
        gap: 12px;
    }

    .form-control-mobile[b-xzwpdnptre] {
        padding: 8px 12px;
    }

    .form-group-mobile[b-xzwpdnptre] {
        gap: 6px;
    }
}

/* ========================================
   DARK MODE OVERRIDES
   ======================================== */
[data-bs-theme="dark"] .mobile-card[b-xzwpdnptre] {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .mobile-card-header[b-xzwpdnptre] {
    background: var(--card-header-bg);
}

    [data-bs-theme="dark"] .mobile-card-header i[b-xzwpdnptre] {
        color: #a78bfa;
    }

[data-bs-theme="dark"] .form-control-mobile[b-xzwpdnptre] {
    background: var(--card-bg);
    color: var(--text-primary);
    border-color: var(--border-color);
}

    [data-bs-theme="dark"] .form-control-mobile:focus[b-xzwpdnptre] {
        border-color: #a78bfa;
        box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15);
    }

[data-bs-theme="dark"] select.form-control-mobile[b-xzwpdnptre] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2394a3b8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .btn-addon[b-xzwpdnptre] {
    background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
}

/* ========================================
   ACCESSIBILITY
   ======================================== */
.form-control-mobile:focus-visible[b-xzwpdnptre] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.btn-addon:focus-visible[b-xzwpdnptre] {
    outline: 2px solid white;
    outline-offset: 2px;
}

/* ========================================
   TOUCH OPTIMIZATION
   ======================================== */
@media (hover: none) and (pointer: coarse) {
    .form-control-mobile[b-xzwpdnptre],
    .btn-addon[b-xzwpdnptre] {
        min-height: 44px;
    }
}
/* _content/Client/Pages/FinansYonetimi/Cari/CariKart/Cari_FaturaSevkBilgileri.razor.rz.scp.css */
.phone-input-container[b-1bnpdbo4y7] {
    position: relative;
}

.flag-button-clean[b-1bnpdbo4y7] {
    border: none !important;
    background-color: transparent !important;
    padding: 4px !important;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}

    .flag-button-clean:hover[b-1bnpdbo4y7] {
        background-color: rgba(0,0,0,0.05) !important;
    }

    .flag-button-clean:focus[b-1bnpdbo4y7] {
        box-shadow: none !important;
        background-color: rgba(0,0,0,0.05) !important;
        outline: none;
    }

    .flag-button-clean:active[b-1bnpdbo4y7] {
        background-color: rgba(0,0,0,0.1) !important;
    }

.flag-display[b-1bnpdbo4y7] {
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 2px;
    border: 1px solid #e5e7eb;
}

.country-dropdown[b-1bnpdbo4y7] {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
}

.country-item[b-1bnpdbo4y7] {
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #f3f4f6;
}

    .country-item:last-child[b-1bnpdbo4y7] {
        border-bottom: none;
    }

    .country-item:hover[b-1bnpdbo4y7] {
        background-color: #f8f9fa !important;
    }

.flag-small[b-1bnpdbo4y7] {
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 2px;
    border: 1px solid #e5e7eb;
}

.cursor-pointer[b-1bnpdbo4y7] {
    cursor: pointer;
}

.country-dropdown[b-1bnpdbo4y7]::-webkit-scrollbar {
    width: 6px;
}

.country-dropdown[b-1bnpdbo4y7]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.country-dropdown[b-1bnpdbo4y7]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

    .country-dropdown[b-1bnpdbo4y7]::-webkit-scrollbar-thumb:hover {
        background: #a8a8a8;
    }

.flag-dropdown-container[b-1bnpdbo4y7] {
    flex-shrink: 0;
}
/* === FLOATING LABEL === */

.bym-floating-label[b-1bnpdbo4y7] {
    position: absolute;
    top: -35%;
    left: 0.75rem;
    font-size: 12px;
    font-weight: bold;
    color: #000 !important;
    pointer-events: auto;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    margin: 0;
    padding: 0;
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
}

    .bym-floating-label[b-1bnpdbo4y7]::before {
        content: '' !important;
        background: white !important;
        background-color: white !important;
        opacity: 1 !important;
        z-index: -1;
    }
/* COMPLETELY OPAQUE WHITE BACKGROUND */
/*.label-white-layer {
        display: inline-flex;
        align-items: center;
        gap: 0;
        background: white !important;
        background-color: white !important;
        opacity: 1 !important;
        padding: 0 6px;
        position: relative;
        z-index: 10;
        margin: 0;
    }*/

/* Additional white background layer for complete opacity */
/*.label-white-layer::before {
        content: '';
        position: absolute;
        top: -2px;
        left: -2px;
        right: -2px;
        bottom: -2px;
        background: white !important;
        background-color: white !important;
        opacity: 1 !important;
        z-index: -1;
    }*/

/* Another layer to ensure complete coverage */
/*.label-white-layer::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        height: 4px;
        transform: translateY(-50%);
        background: white !important;
        background-color: white !important;
        opacity: 1 !important;
        z-index: -1;
    }*/

[data-bs-theme="dark"] .label-white-layer[b-1bnpdbo4y7],
.dark .label-white-layer[b-1bnpdbo4y7] {
    background: rgb(21, 23, 28) !important;
    background-color: rgb(21, 23, 28) !important;
    border-top-color: rgb(21, 23, 28);
    border-bottom-color: rgb(21, 23, 28);
    outline-color: rgb(21, 23, 28);
}

    [data-bs-theme="dark"] .label-white-layer[b-1bnpdbo4y7]::before,
    .dark .label-white-layer[b-1bnpdbo4y7]::before,
    [data-bs-theme="dark"] .label-white-layer[b-1bnpdbo4y7]::after,
    .dark .label-white-layer[b-1bnpdbo4y7]::after {
        background: rgb(21, 23, 28) !important;
        background-color: rgb(21, 23, 28) !important;
    }

/* Remove the label-background div - not needed */
.label-background[b-1bnpdbo4y7] {
    display: none !important;
}

/* Label text */
.label-text[b-1bnpdbo4y7] {
    cursor: pointer;
    user-select: none;
    position: relative;
    z-index: 11;
    background: inherit; /* Inherit parent's background */
    padding: 0 2px; /* Small padding for text */
}

[data-bs-theme="dark"] .bym-floating-label[b-1bnpdbo4y7],
.dark .bym-floating-label[b-1bnpdbo4y7] {
    color: #fff !important;
}

/* Tooltip with same background treatment */
.tooltip-background[b-1bnpdbo4y7] {
    display: none;
    align-items: center;
    margin-left: 6px;
    position: relative;
    z-index: 11;
    background: inherit; /* Inherit parent's background */
}

.form-floating:hover .tooltip-background[b-1bnpdbo4y7],
.bym-floating-label:hover .tooltip-background[b-1bnpdbo4y7],
.form-floating:has(.global-tooltip.show) .tooltip-background[b-1bnpdbo4y7] {
    display: inline-flex;
}

/* Remove the tooltip-white-layer - not needed */
.tooltip-white-layer[b-1bnpdbo4y7] {
    display: none !important;
}

.tooltip-icon[b-1bnpdbo4y7] {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1px solid #000;
    background: #fff;
    color: #000;
    font-size: 10px;
    font-weight: bold;
    cursor: help;
    line-height: 1;
}

[data-bs-theme="dark"] .tooltip-icon[b-1bnpdbo4y7],
.dark .tooltip-icon[b-1bnpdbo4y7] {
    background: #15171c;
    border-color: #6b7280;
    color: #9ca3af;
}

/* Focus states - maintain solid background */
.form-floating .dx-texteditor:focus ~ .bym-floating-label[b-1bnpdbo4y7],
.form-floating .dx-texteditor:not(:placeholder-shown) ~ .bym-floating-label[b-1bnpdbo4y7] {
    color: #000 !important;
}

    /* Ensure white background stays solid on focus */
    .form-floating .dx-texteditor:focus ~ .bym-floating-label .label-white-layer[b-1bnpdbo4y7],
    .form-floating .dx-texteditor:not(:placeholder-shown) ~ .bym-floating-label .label-white-layer[b-1bnpdbo4y7] {
        background: white !important;
        background-color: white !important;
        opacity: 1 !important;
    }

[data-bs-theme="dark"] .form-floating .dx-texteditor:focus ~ .bym-floating-label[b-1bnpdbo4y7],
[data-bs-theme="dark"] .form-floating .dx-texteditor:not(:placeholder-shown) ~ .bym-floating-label[b-1bnpdbo4y7],
.dark .form-floating .dx-texteditor:focus ~ .bym-floating-label[b-1bnpdbo4y7],
.dark .form-floating .dx-texteditor:not(:placeholder-shown) ~ .bym-floating-label[b-1bnpdbo4y7] {
    color: #60a5fa !important;
}

    [data-bs-theme="dark"] .form-floating .dx-texteditor:focus ~ .bym-floating-label .label-white-layer[b-1bnpdbo4y7],
    [data-bs-theme="dark"] .form-floating .dx-texteditor:not(:placeholder-shown) ~ .bym-floating-label .label-white-layer[b-1bnpdbo4y7],
    .dark .form-floating .dx-texteditor:focus ~ .bym-floating-label .label-white-layer[b-1bnpdbo4y7],
    .dark .form-floating .dx-texteditor:not(:placeholder-shown) ~ .bym-floating-label .label-white-layer[b-1bnpdbo4y7] {
        background: rgb(21, 23, 28) !important;
        background-color: rgb(21, 23, 28) !important;
        opacity: 1 !important;
    }

/* Input alignment */
.form-floating .dx-texteditor[b-1bnpdbo4y7] {
    min-height: 3.5rem;
    display: flex;
    align-items: center;
}

    .form-floating .dx-texteditor .dx-texteditor-input-container[b-1bnpdbo4y7] {
        display: flex;
        align-items: center;
        height: 100%;
        padding: 0 0.75rem;
    }

    .form-floating .dx-texteditor input.dx-texteditor-input[b-1bnpdbo4y7] {
        padding: 0.5rem 0.75rem !important;
        margin: 0;
        height: auto;
        line-height: normal;
        font-size: 1rem;
    }

.form-floating .form-control[b-1bnpdbo4y7] {
    min-height: 3.5rem;
    padding: 1rem 0.75rem;
    display: flex;
    align-items: center;
}

/* Global tooltip */
.global-tooltip[b-1bnpdbo4y7] {
    visibility: hidden;
    opacity: 0;
    background: #fff !important;
    color: #000 !important;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    z-index: 999999;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    pointer-events: none;
    min-width: 140px;
    max-width: 280px;
    text-align: left;
    border: 1px solid rgba(0, 0, 0, 0.08);
    position: fixed;
    transition: opacity 0.2s, visibility 0.2s;
}

    .global-tooltip.show[b-1bnpdbo4y7] {
        visibility: visible;
        opacity: 1;
    }

[data-bs-theme="dark"] .global-tooltip[b-1bnpdbo4y7],
.dark .global-tooltip[b-1bnpdbo4y7] {
    background: #374151 !important;
    color: #e5e7eb !important;
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.global-tooltip[b-1bnpdbo4y7]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -7px;
    transform: translateY(-50%);
    border: 7px solid transparent;
    border-right-color: #fff;
}

[data-bs-theme="dark"] .global-tooltip[b-1bnpdbo4y7]::before,
.dark .global-tooltip[b-1bnpdbo4y7]::before {
    border-right-color: #374151;
}

/* InGrid */
.dx-texteditor.fs-6 input.dx-texteditor-input[b-1bnpdbo4y7] {
    padding: 0.5rem !important;
    font-size: inherit !important;
}

/* Date/Time Edit */
.form-floating .dxbs-date-edit[b-1bnpdbo4y7],
.form-floating .dxbs-time-edit[b-1bnpdbo4y7] {
    display: flex;
    align-items: center;
    min-height: 3.5rem;
}

    .form-floating .dxbs-date-edit input[b-1bnpdbo4y7],
    .form-floating .dxbs-time-edit input[b-1bnpdbo4y7] {
        padding: 0.5rem 0.75rem !important;
    }
/* _content/Client/Pages/FinansYonetimi/Cari/CariVirmanMobil/CariVirmanMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-vl10xz12qq] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-vl10xz12qq] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-vl10xz12qq] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-vl10xz12qq] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-vl10xz12qq] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-vl10xz12qq] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-vl10xz12qq]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-vl10xz12qq] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-vl10xz12qq] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-vl10xz12qq] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-vl10xz12qq] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-vl10xz12qq] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-vl10xz12qq] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-vl10xz12qq] {
        transform: scale(0.98);
    }

.card-header-section[b-vl10xz12qq] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-vl10xz12qq] {
    width: 100%;
}

.card-title-row[b-vl10xz12qq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-vl10xz12qq] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-vl10xz12qq] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-vl10xz12qq] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-vl10xz12qq] {
        transform: rotate(0deg);
    }

.card-meta-row[b-vl10xz12qq] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-vl10xz12qq] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-vl10xz12qq] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-vl10xz12qq] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-vl10xz12qq] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-vl10xz12qq] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-vl10xz12qq] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-vl10xz12qq] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-vl10xz12qq] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-vl10xz12qq] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-vl10xz12qq] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-vl10xz12qq] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-vl10xz12qq] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-vl10xz12qq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-vl10xz12qq] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-vl10xz12qq] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-vl10xz12qq] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-vl10xz12qq] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-vl10xz12qq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-vl10xz12qq] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-vl10xz12qq] {
        transform: scale(0.95);
    }

.btn-primary[b-vl10xz12qq] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-vl10xz12qq] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-vl10xz12qq] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-vl10xz12qq] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-vl10xz12qq] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-vl10xz12qq] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-vl10xz12qq] {
        font-size: 14px;
    }

    .card-quick-info[b-vl10xz12qq] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-vl10xz12qq] {
        padding: 10px;
    }

    .stok-card[b-vl10xz12qq] {
        margin: 6px 10px;
    }

    .quick-value[b-vl10xz12qq] {
        font-size: 15px;
    }

    .card-header-section[b-vl10xz12qq] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-vl10xz12qq],
    .stok-card[b-vl10xz12qq] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-vl10xz12qq {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-vl10xz12qq] {
    animation: fadeIn-b-vl10xz12qq 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-vl10xz12qq]::-webkit-scrollbar {
        width: 6px;
    }

    [b-vl10xz12qq]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-vl10xz12qq]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-vl10xz12qq]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-vl10xz12qq],
    .custom-grid[b-vl10xz12qq] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-vl10xz12qq],
    [data-bs-theme="dark"] .custom-grid[b-vl10xz12qq] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-vl10xz12qq],
    .dxbs-grid-header-content[b-vl10xz12qq],
    .dxbs-grid-header-panel[b-vl10xz12qq],
    .dxbs-grid-filter-row[b-vl10xz12qq],
    .dxbs-grid-command-column[b-vl10xz12qq],
    .dxbs-grid-selection-column[b-vl10xz12qq],
    .dxbs-grid-data-column[b-vl10xz12qq],
    .dxbs-grid-table thead[b-vl10xz12qq],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-vl10xz12qq],
    .dxbs-grid-table > tbody > tr > th[b-vl10xz12qq],
    .dxbs-grid-pager[b-vl10xz12qq],
    .dxbs-grid-empty-data[b-vl10xz12qq],
    .dxbs-grid-toolbar[b-vl10xz12qq],
    .dxbs-grid-statusbar[b-vl10xz12qq] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-vl10xz12qq],
    .dxbs-grid-table > tbody[b-vl10xz12qq],
    .dxbs-grid-table > tbody > tr[b-vl10xz12qq] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-vl10xz12qq] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-vl10xz12qq],
        .dxbs-grid-detail-cell > *[b-vl10xz12qq] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-vl10xz12qq] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-vl10xz12qq],
    .dxbs-grid-header-content[b-vl10xz12qq],
    .dxbs-grid-filter-row[b-vl10xz12qq],
    .dxbs-grid-command-column[b-vl10xz12qq],
    .dxbs-grid-selection-column[b-vl10xz12qq],
    .dxbs-grid-data-column[b-vl10xz12qq],
    .dxbs-grid-table thead[b-vl10xz12qq],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-vl10xz12qq] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-vl10xz12qq],
    .dxbs-grid-table > tbody[b-vl10xz12qq],
    .dxbs-grid-table > tbody > tr[b-vl10xz12qq] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-vl10xz12qq] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-vl10xz12qq] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-vl10xz12qq] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-vl10xz12qq] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-vl10xz12qq] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-vl10xz12qq] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-vl10xz12qq] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-vl10xz12qq] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-vl10xz12qq]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-vl10xz12qq] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-vl10xz12qq] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-vl10xz12qq] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-vl10xz12qq] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-vl10xz12qq] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-vl10xz12qq] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-vl10xz12qq] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-vl10xz12qq] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-vl10xz12qq] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-vl10xz12qq] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-vl10xz12qq] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-vl10xz12qq] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-vl10xz12qq] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-vl10xz12qq] {
    color: #667eea;
}

.separator[b-vl10xz12qq] {
    color: var(--text-muted);
}

.total-pages[b-vl10xz12qq] {
    color: var(--text-secondary);
}




.page-size-selector[b-vl10xz12qq] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-vl10xz12qq] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-vl10xz12qq] {
        border-color: #667eea;
    }

.pagination-text[b-vl10xz12qq] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-vl10xz12qq] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-vl10xz12qq] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-vl10xz12qq] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-vl10xz12qq] {
        transform: scale(0.98);
    }

.card-header-section[b-vl10xz12qq] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-vl10xz12qq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-vl10xz12qq] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-vl10xz12qq] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-vl10xz12qq] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-vl10xz12qq] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-vl10xz12qq] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-vl10xz12qq] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-vl10xz12qq] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-vl10xz12qq] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-vl10xz12qq] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-vl10xz12qq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-vl10xz12qq] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-vl10xz12qq] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-vl10xz12qq] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-vl10xz12qq] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-vl10xz12qq] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-vl10xz12qq] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-vl10xz12qq] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-vl10xz12qq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-vl10xz12qq] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-vl10xz12qq] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-vl10xz12qq] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-vl10xz12qq] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-vl10xz12qq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-vl10xz12qq] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-vl10xz12qq] {
        transform: scale(0.95);
    }

.btn-primary[b-vl10xz12qq] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-vl10xz12qq] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-vl10xz12qq] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-vl10xz12qq] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-vl10xz12qq] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-vl10xz12qq] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-vl10xz12qq] {
        font-size: 14px;
    }

    .card-quick-info[b-vl10xz12qq] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-vl10xz12qq] {
        padding: 10px;
    }

    .stok-card[b-vl10xz12qq] {
        margin: 6px 10px;
    }

    .quick-value[b-vl10xz12qq] {
        font-size: 15px;
    }

    .card-header-section[b-vl10xz12qq] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-vl10xz12qq],
    .stok-card[b-vl10xz12qq],
    .mobile-pagination[b-vl10xz12qq],
    .pagination-details[b-vl10xz12qq] {
        display: none !important;
    }
}

@keyframes fadeIn-b-vl10xz12qq {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-vl10xz12qq] {
    animation: fadeIn-b-vl10xz12qq 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-vl10xz12qq]::-webkit-scrollbar {
        width: 6px;
    }

    [b-vl10xz12qq]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-vl10xz12qq]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-vl10xz12qq]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-vl10xz12qq] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-vl10xz12qq] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-vl10xz12qq] {
    background: #0f172a;
}

.pagination-btn[b-vl10xz12qq] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-vl10xz12qq] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-vl10xz12qq] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-vl10xz12qq] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-vl10xz12qq] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-vl10xz12qq] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-vl10xz12qq] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-vl10xz12qq] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-vl10xz12qq] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-vl10xz12qq] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-vl10xz12qq] {
        border-color: #667eea;
    }

.pagination-text[b-vl10xz12qq] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-vl10xz12qq] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-vl10xz12qq] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-vl10xz12qq] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-vl10xz12qq]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-vl10xz12qq] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-vl10xz12qq] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-vl10xz12qq] {
        transform: scale(0.95);
    }

#faturaContainer[b-vl10xz12qq] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/CekSenet/CekSenetBordrolariMobil/CekSenetBordrolariMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-l1pdwlrss8] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-l1pdwlrss8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-l1pdwlrss8] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-l1pdwlrss8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-l1pdwlrss8] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-l1pdwlrss8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-l1pdwlrss8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-l1pdwlrss8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-l1pdwlrss8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-l1pdwlrss8] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-l1pdwlrss8] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-l1pdwlrss8] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-l1pdwlrss8] {
        transform: scale(0.98);
    }

.card-header-section[b-l1pdwlrss8] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-l1pdwlrss8] {
    width: 100%;
}

.card-title-row[b-l1pdwlrss8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-l1pdwlrss8] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-l1pdwlrss8] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-l1pdwlrss8] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-l1pdwlrss8] {
        transform: rotate(0deg);
    }

.card-meta-row[b-l1pdwlrss8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-l1pdwlrss8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-l1pdwlrss8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-l1pdwlrss8] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-l1pdwlrss8] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-l1pdwlrss8] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-l1pdwlrss8] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-l1pdwlrss8] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-l1pdwlrss8] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-l1pdwlrss8] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-l1pdwlrss8] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-l1pdwlrss8] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-l1pdwlrss8] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-l1pdwlrss8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-l1pdwlrss8] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-l1pdwlrss8] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-l1pdwlrss8] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-l1pdwlrss8] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-l1pdwlrss8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-l1pdwlrss8] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

.btn-primary[b-l1pdwlrss8] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-l1pdwlrss8] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-l1pdwlrss8] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-l1pdwlrss8] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-l1pdwlrss8] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-l1pdwlrss8] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-l1pdwlrss8] {
        font-size: 14px;
    }

    .card-quick-info[b-l1pdwlrss8] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-l1pdwlrss8] {
        padding: 10px;
    }

    .stok-card[b-l1pdwlrss8] {
        margin: 6px 10px;
    }

    .quick-value[b-l1pdwlrss8] {
        font-size: 15px;
    }

    .card-header-section[b-l1pdwlrss8] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-l1pdwlrss8],
    .stok-card[b-l1pdwlrss8] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-l1pdwlrss8 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-l1pdwlrss8] {
    animation: fadeIn-b-l1pdwlrss8 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-l1pdwlrss8]::-webkit-scrollbar {
        width: 6px;
    }

    [b-l1pdwlrss8]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-l1pdwlrss8]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-l1pdwlrss8]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-l1pdwlrss8],
    .custom-grid[b-l1pdwlrss8] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-l1pdwlrss8],
    [data-bs-theme="dark"] .custom-grid[b-l1pdwlrss8] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-l1pdwlrss8],
    .dxbs-grid-header-content[b-l1pdwlrss8],
    .dxbs-grid-header-panel[b-l1pdwlrss8],
    .dxbs-grid-filter-row[b-l1pdwlrss8],
    .dxbs-grid-command-column[b-l1pdwlrss8],
    .dxbs-grid-selection-column[b-l1pdwlrss8],
    .dxbs-grid-data-column[b-l1pdwlrss8],
    .dxbs-grid-table thead[b-l1pdwlrss8],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-l1pdwlrss8],
    .dxbs-grid-table > tbody > tr > th[b-l1pdwlrss8],
    .dxbs-grid-pager[b-l1pdwlrss8],
    .dxbs-grid-empty-data[b-l1pdwlrss8],
    .dxbs-grid-toolbar[b-l1pdwlrss8],
    .dxbs-grid-statusbar[b-l1pdwlrss8] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-l1pdwlrss8],
    .dxbs-grid-table > tbody[b-l1pdwlrss8],
    .dxbs-grid-table > tbody > tr[b-l1pdwlrss8] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-l1pdwlrss8] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-l1pdwlrss8],
        .dxbs-grid-detail-cell > *[b-l1pdwlrss8] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-l1pdwlrss8] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-l1pdwlrss8],
    .dxbs-grid-header-content[b-l1pdwlrss8],
    .dxbs-grid-filter-row[b-l1pdwlrss8],
    .dxbs-grid-command-column[b-l1pdwlrss8],
    .dxbs-grid-selection-column[b-l1pdwlrss8],
    .dxbs-grid-data-column[b-l1pdwlrss8],
    .dxbs-grid-table thead[b-l1pdwlrss8],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-l1pdwlrss8] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-l1pdwlrss8],
    .dxbs-grid-table > tbody[b-l1pdwlrss8],
    .dxbs-grid-table > tbody > tr[b-l1pdwlrss8] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-l1pdwlrss8] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-l1pdwlrss8] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-l1pdwlrss8] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-l1pdwlrss8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-l1pdwlrss8] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-l1pdwlrss8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-l1pdwlrss8] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-l1pdwlrss8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-l1pdwlrss8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-l1pdwlrss8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-l1pdwlrss8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-l1pdwlrss8] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-l1pdwlrss8] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-l1pdwlrss8] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-l1pdwlrss8] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-l1pdwlrss8] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-l1pdwlrss8] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-l1pdwlrss8] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-l1pdwlrss8] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-l1pdwlrss8] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-l1pdwlrss8] {
    color: #667eea;
}

.separator[b-l1pdwlrss8] {
    color: var(--text-muted);
}

.total-pages[b-l1pdwlrss8] {
    color: var(--text-secondary);
}




.page-size-selector[b-l1pdwlrss8] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-l1pdwlrss8] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-l1pdwlrss8] {
        border-color: #667eea;
    }

.pagination-text[b-l1pdwlrss8] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-l1pdwlrss8] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-l1pdwlrss8] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-l1pdwlrss8] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-l1pdwlrss8] {
        transform: scale(0.98);
    }

.card-header-section[b-l1pdwlrss8] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-l1pdwlrss8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-l1pdwlrss8] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-l1pdwlrss8] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-l1pdwlrss8] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-l1pdwlrss8] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-l1pdwlrss8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-l1pdwlrss8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-l1pdwlrss8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-l1pdwlrss8] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-l1pdwlrss8] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-l1pdwlrss8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-l1pdwlrss8] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-l1pdwlrss8] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-l1pdwlrss8] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-l1pdwlrss8] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-l1pdwlrss8] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-l1pdwlrss8] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-l1pdwlrss8] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-l1pdwlrss8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-l1pdwlrss8] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-l1pdwlrss8] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-l1pdwlrss8] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-l1pdwlrss8] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-l1pdwlrss8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-l1pdwlrss8] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

.btn-primary[b-l1pdwlrss8] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-l1pdwlrss8] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-l1pdwlrss8] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-l1pdwlrss8] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-l1pdwlrss8] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-l1pdwlrss8] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-l1pdwlrss8] {
        font-size: 14px;
    }

    .card-quick-info[b-l1pdwlrss8] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-l1pdwlrss8] {
        padding: 10px;
    }

    .stok-card[b-l1pdwlrss8] {
        margin: 6px 10px;
    }

    .quick-value[b-l1pdwlrss8] {
        font-size: 15px;
    }

    .card-header-section[b-l1pdwlrss8] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-l1pdwlrss8],
    .stok-card[b-l1pdwlrss8],
    .mobile-pagination[b-l1pdwlrss8],
    .pagination-details[b-l1pdwlrss8] {
        display: none !important;
    }
}

@keyframes fadeIn-b-l1pdwlrss8 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-l1pdwlrss8] {
    animation: fadeIn-b-l1pdwlrss8 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-l1pdwlrss8]::-webkit-scrollbar {
        width: 6px;
    }

    [b-l1pdwlrss8]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-l1pdwlrss8]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-l1pdwlrss8]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-l1pdwlrss8] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-l1pdwlrss8] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-l1pdwlrss8] {
    background: #0f172a;
}

.pagination-btn[b-l1pdwlrss8] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-l1pdwlrss8] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-l1pdwlrss8] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-l1pdwlrss8] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-l1pdwlrss8] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-l1pdwlrss8] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-l1pdwlrss8] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-l1pdwlrss8] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-l1pdwlrss8] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-l1pdwlrss8] {
        border-color: #667eea;
    }

.pagination-text[b-l1pdwlrss8] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-l1pdwlrss8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-l1pdwlrss8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-l1pdwlrss8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-l1pdwlrss8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-l1pdwlrss8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-l1pdwlrss8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-l1pdwlrss8] {
        transform: scale(0.95);
    }

#faturaContainer[b-l1pdwlrss8] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/CekSenet/CekSenetKartlariMobil/CekSenetKartlariMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-apzsyb0vbs] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-apzsyb0vbs] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-apzsyb0vbs] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-apzsyb0vbs] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-apzsyb0vbs] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-apzsyb0vbs] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-apzsyb0vbs]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-apzsyb0vbs] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-apzsyb0vbs] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-apzsyb0vbs] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-apzsyb0vbs] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-apzsyb0vbs] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-apzsyb0vbs] {
        transform: scale(0.98);
    }

.card-header-section[b-apzsyb0vbs] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-apzsyb0vbs] {
    width: 100%;
}

.card-title-row[b-apzsyb0vbs] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-apzsyb0vbs] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-apzsyb0vbs] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-apzsyb0vbs] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-apzsyb0vbs] {
        transform: rotate(0deg);
    }

.card-meta-row[b-apzsyb0vbs] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-apzsyb0vbs] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-apzsyb0vbs] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-apzsyb0vbs] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-apzsyb0vbs] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-apzsyb0vbs] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-apzsyb0vbs] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-apzsyb0vbs] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-apzsyb0vbs] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-apzsyb0vbs] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-apzsyb0vbs] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-apzsyb0vbs] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-apzsyb0vbs] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-apzsyb0vbs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-apzsyb0vbs] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-apzsyb0vbs] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-apzsyb0vbs] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-apzsyb0vbs] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-apzsyb0vbs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-apzsyb0vbs] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

.btn-primary[b-apzsyb0vbs] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-apzsyb0vbs] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-apzsyb0vbs] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-apzsyb0vbs] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-apzsyb0vbs] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-apzsyb0vbs] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-apzsyb0vbs] {
        font-size: 14px;
    }

    .card-quick-info[b-apzsyb0vbs] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-apzsyb0vbs] {
        padding: 10px;
    }

    .stok-card[b-apzsyb0vbs] {
        margin: 6px 10px;
    }

    .quick-value[b-apzsyb0vbs] {
        font-size: 15px;
    }

    .card-header-section[b-apzsyb0vbs] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-apzsyb0vbs],
    .stok-card[b-apzsyb0vbs] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-apzsyb0vbs {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-apzsyb0vbs] {
    animation: fadeIn-b-apzsyb0vbs 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-apzsyb0vbs]::-webkit-scrollbar {
        width: 6px;
    }

    [b-apzsyb0vbs]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-apzsyb0vbs]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-apzsyb0vbs]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-apzsyb0vbs],
    .custom-grid[b-apzsyb0vbs] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-apzsyb0vbs],
    [data-bs-theme="dark"] .custom-grid[b-apzsyb0vbs] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-apzsyb0vbs],
    .dxbs-grid-header-content[b-apzsyb0vbs],
    .dxbs-grid-header-panel[b-apzsyb0vbs],
    .dxbs-grid-filter-row[b-apzsyb0vbs],
    .dxbs-grid-command-column[b-apzsyb0vbs],
    .dxbs-grid-selection-column[b-apzsyb0vbs],
    .dxbs-grid-data-column[b-apzsyb0vbs],
    .dxbs-grid-table thead[b-apzsyb0vbs],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-apzsyb0vbs],
    .dxbs-grid-table > tbody > tr > th[b-apzsyb0vbs],
    .dxbs-grid-pager[b-apzsyb0vbs],
    .dxbs-grid-empty-data[b-apzsyb0vbs],
    .dxbs-grid-toolbar[b-apzsyb0vbs],
    .dxbs-grid-statusbar[b-apzsyb0vbs] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-apzsyb0vbs],
    .dxbs-grid-table > tbody[b-apzsyb0vbs],
    .dxbs-grid-table > tbody > tr[b-apzsyb0vbs] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-apzsyb0vbs] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-apzsyb0vbs],
        .dxbs-grid-detail-cell > *[b-apzsyb0vbs] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-apzsyb0vbs] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-apzsyb0vbs],
    .dxbs-grid-header-content[b-apzsyb0vbs],
    .dxbs-grid-filter-row[b-apzsyb0vbs],
    .dxbs-grid-command-column[b-apzsyb0vbs],
    .dxbs-grid-selection-column[b-apzsyb0vbs],
    .dxbs-grid-data-column[b-apzsyb0vbs],
    .dxbs-grid-table thead[b-apzsyb0vbs],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-apzsyb0vbs] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-apzsyb0vbs],
    .dxbs-grid-table > tbody[b-apzsyb0vbs],
    .dxbs-grid-table > tbody > tr[b-apzsyb0vbs] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-apzsyb0vbs] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-apzsyb0vbs] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-apzsyb0vbs] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-apzsyb0vbs] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-apzsyb0vbs] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-apzsyb0vbs] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-apzsyb0vbs] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-apzsyb0vbs] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-apzsyb0vbs]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-apzsyb0vbs] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-apzsyb0vbs] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-apzsyb0vbs] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-apzsyb0vbs] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-apzsyb0vbs] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-apzsyb0vbs] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-apzsyb0vbs] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-apzsyb0vbs] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-apzsyb0vbs] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-apzsyb0vbs] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-apzsyb0vbs] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-apzsyb0vbs] {
    color: #667eea;
}

.separator[b-apzsyb0vbs] {
    color: var(--text-muted);
}

.total-pages[b-apzsyb0vbs] {
    color: var(--text-secondary);
}




.page-size-selector[b-apzsyb0vbs] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-apzsyb0vbs] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-apzsyb0vbs] {
        border-color: #667eea;
    }

.pagination-text[b-apzsyb0vbs] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-apzsyb0vbs] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-apzsyb0vbs] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-apzsyb0vbs] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-apzsyb0vbs] {
        transform: scale(0.98);
    }

.card-header-section[b-apzsyb0vbs] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-apzsyb0vbs] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-apzsyb0vbs] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-apzsyb0vbs] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-apzsyb0vbs] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-apzsyb0vbs] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-apzsyb0vbs] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-apzsyb0vbs] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-apzsyb0vbs] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-apzsyb0vbs] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-apzsyb0vbs] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-apzsyb0vbs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-apzsyb0vbs] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-apzsyb0vbs] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-apzsyb0vbs] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-apzsyb0vbs] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-apzsyb0vbs] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-apzsyb0vbs] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-apzsyb0vbs] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-apzsyb0vbs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-apzsyb0vbs] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-apzsyb0vbs] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-apzsyb0vbs] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-apzsyb0vbs] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-apzsyb0vbs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-apzsyb0vbs] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

.btn-primary[b-apzsyb0vbs] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-apzsyb0vbs] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-apzsyb0vbs] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-apzsyb0vbs] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-apzsyb0vbs] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-apzsyb0vbs] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-apzsyb0vbs] {
        font-size: 14px;
    }

    .card-quick-info[b-apzsyb0vbs] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-apzsyb0vbs] {
        padding: 10px;
    }

    .stok-card[b-apzsyb0vbs] {
        margin: 6px 10px;
    }

    .quick-value[b-apzsyb0vbs] {
        font-size: 15px;
    }

    .card-header-section[b-apzsyb0vbs] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-apzsyb0vbs],
    .stok-card[b-apzsyb0vbs],
    .mobile-pagination[b-apzsyb0vbs],
    .pagination-details[b-apzsyb0vbs] {
        display: none !important;
    }
}

@keyframes fadeIn-b-apzsyb0vbs {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-apzsyb0vbs] {
    animation: fadeIn-b-apzsyb0vbs 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-apzsyb0vbs]::-webkit-scrollbar {
        width: 6px;
    }

    [b-apzsyb0vbs]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-apzsyb0vbs]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-apzsyb0vbs]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-apzsyb0vbs] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-apzsyb0vbs] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-apzsyb0vbs] {
    background: #0f172a;
}

.pagination-btn[b-apzsyb0vbs] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-apzsyb0vbs] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-apzsyb0vbs] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-apzsyb0vbs] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-apzsyb0vbs] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-apzsyb0vbs] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-apzsyb0vbs] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-apzsyb0vbs] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-apzsyb0vbs] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-apzsyb0vbs] {
        border-color: #667eea;
    }

.pagination-text[b-apzsyb0vbs] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-apzsyb0vbs] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-apzsyb0vbs] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-apzsyb0vbs] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-apzsyb0vbs]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-apzsyb0vbs] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-apzsyb0vbs] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-apzsyb0vbs] {
        transform: scale(0.95);
    }

#faturaContainer[b-apzsyb0vbs] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Kasa/KasaAra.razor.rz.scp.css */
:root[b-0edj2dw54o] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-0edj2dw54o] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

@media (max-width: 991px) {
    .dxbs-grid[b-0edj2dw54o] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-0edj2dw54o],
    .dxbs-grid-header-content[b-0edj2dw54o],
    .dxbs-grid-filter-row[b-0edj2dw54o],
    .dxbs-grid-command-column[b-0edj2dw54o],
    .dxbs-grid-selection-column[b-0edj2dw54o],
    .dxbs-grid-data-column[b-0edj2dw54o],
    .dxbs-grid-table thead[b-0edj2dw54o],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-0edj2dw54o] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-0edj2dw54o],
    .dxbs-grid-table > tbody[b-0edj2dw54o],
    .dxbs-grid-table > tbody > tr[b-0edj2dw54o] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-0edj2dw54o] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-0edj2dw54o] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-0edj2dw54o] {
    position: sticky;
    z-index: 1000;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-0edj2dw54o] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-0edj2dw54o] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-0edj2dw54o] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-0edj2dw54o] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-0edj2dw54o] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0edj2dw54o]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0edj2dw54o] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0edj2dw54o] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0edj2dw54o] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-0edj2dw54o] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 998;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-0edj2dw54o] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-0edj2dw54o] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-0edj2dw54o] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-0edj2dw54o] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-0edj2dw54o] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-0edj2dw54o] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-0edj2dw54o] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-0edj2dw54o] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-0edj2dw54o] {
    color: #667eea;
}

.separator[b-0edj2dw54o] {
    color: var(--text-muted);
}

.total-pages[b-0edj2dw54o] {
    color: var(--text-secondary);
}




.page-size-selector[b-0edj2dw54o] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-0edj2dw54o] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-0edj2dw54o] {
        border-color: #667eea;
    }

.pagination-text[b-0edj2dw54o] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-0edj2dw54o] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-0edj2dw54o] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-0edj2dw54o] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-0edj2dw54o] {
        transform: scale(0.98);
    }

.card-header-section[b-0edj2dw54o] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-0edj2dw54o] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-0edj2dw54o] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-0edj2dw54o] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-0edj2dw54o] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-0edj2dw54o] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-0edj2dw54o] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-0edj2dw54o] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-0edj2dw54o] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-0edj2dw54o] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-0edj2dw54o] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-0edj2dw54o] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-0edj2dw54o] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-0edj2dw54o] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-0edj2dw54o] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-0edj2dw54o] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-0edj2dw54o] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-0edj2dw54o] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-0edj2dw54o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-0edj2dw54o] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-0edj2dw54o] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-0edj2dw54o] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-0edj2dw54o] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-0edj2dw54o] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

.action-btn[b-0edj2dw54o] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-0edj2dw54o] {
        transform: scale(0.95);
    }

.btn-primary[b-0edj2dw54o] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-0edj2dw54o] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-0edj2dw54o] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-0edj2dw54o] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-0edj2dw54o] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-0edj2dw54o] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-0edj2dw54o] {
        font-size: 14px;
    }

    .card-quick-info[b-0edj2dw54o] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-0edj2dw54o] {
        padding: 10px;
    }

    .stok-card[b-0edj2dw54o] {
        margin: 6px 10px;
    }

    .quick-value[b-0edj2dw54o] {
        font-size: 15px;
    }

    .card-header-section[b-0edj2dw54o] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-0edj2dw54o],
    .stok-card[b-0edj2dw54o],
    .mobile-pagination[b-0edj2dw54o],
    .pagination-details[b-0edj2dw54o] {
        display: none !important;
    }
}

@keyframes fadeIn-b-0edj2dw54o {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-0edj2dw54o] {
    animation: fadeIn-b-0edj2dw54o 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-0edj2dw54o]::-webkit-scrollbar {
        width: 6px;
    }

    [b-0edj2dw54o]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-0edj2dw54o]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-0edj2dw54o]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
/* _content/Client/Pages/FinansYonetimi/Kasa/KasaIslemMobil/KasaIslemMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-h7wnieghiw] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-h7wnieghiw] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-h7wnieghiw] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-h7wnieghiw] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-h7wnieghiw] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-h7wnieghiw] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-h7wnieghiw]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-h7wnieghiw] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-h7wnieghiw] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-h7wnieghiw] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-h7wnieghiw] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-h7wnieghiw] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-h7wnieghiw] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-h7wnieghiw] {
        transform: scale(0.98);
    }

.card-header-section[b-h7wnieghiw] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-h7wnieghiw] {
    width: 100%;
}

.card-title-row[b-h7wnieghiw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-h7wnieghiw] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-h7wnieghiw] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-h7wnieghiw] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-h7wnieghiw] {
        transform: rotate(0deg);
    }

.card-meta-row[b-h7wnieghiw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-h7wnieghiw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-h7wnieghiw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-h7wnieghiw] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-h7wnieghiw] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-h7wnieghiw] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-h7wnieghiw] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-h7wnieghiw] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-h7wnieghiw] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-h7wnieghiw] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-h7wnieghiw] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-h7wnieghiw] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-h7wnieghiw] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-h7wnieghiw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-h7wnieghiw] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-h7wnieghiw] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-h7wnieghiw] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-h7wnieghiw] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-h7wnieghiw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-h7wnieghiw] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-h7wnieghiw] {
        transform: scale(0.95);
    }

.btn-primary[b-h7wnieghiw] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-h7wnieghiw] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-h7wnieghiw] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-h7wnieghiw] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-h7wnieghiw] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-h7wnieghiw] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-h7wnieghiw] {
        font-size: 14px;
    }

    .card-quick-info[b-h7wnieghiw] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-h7wnieghiw] {
        padding: 10px;
    }

    .stok-card[b-h7wnieghiw] {
        margin: 6px 10px;
    }

    .quick-value[b-h7wnieghiw] {
        font-size: 15px;
    }

    .card-header-section[b-h7wnieghiw] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-h7wnieghiw],
    .stok-card[b-h7wnieghiw] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-h7wnieghiw {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-h7wnieghiw] {
    animation: fadeIn-b-h7wnieghiw 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-h7wnieghiw]::-webkit-scrollbar {
        width: 6px;
    }

    [b-h7wnieghiw]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-h7wnieghiw]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-h7wnieghiw]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-h7wnieghiw],
    .custom-grid[b-h7wnieghiw] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-h7wnieghiw],
    [data-bs-theme="dark"] .custom-grid[b-h7wnieghiw] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-h7wnieghiw],
    .dxbs-grid-header-content[b-h7wnieghiw],
    .dxbs-grid-header-panel[b-h7wnieghiw],
    .dxbs-grid-filter-row[b-h7wnieghiw],
    .dxbs-grid-command-column[b-h7wnieghiw],
    .dxbs-grid-selection-column[b-h7wnieghiw],
    .dxbs-grid-data-column[b-h7wnieghiw],
    .dxbs-grid-table thead[b-h7wnieghiw],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-h7wnieghiw],
    .dxbs-grid-table > tbody > tr > th[b-h7wnieghiw],
    .dxbs-grid-pager[b-h7wnieghiw],
    .dxbs-grid-empty-data[b-h7wnieghiw],
    .dxbs-grid-toolbar[b-h7wnieghiw],
    .dxbs-grid-statusbar[b-h7wnieghiw] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-h7wnieghiw],
    .dxbs-grid-table > tbody[b-h7wnieghiw],
    .dxbs-grid-table > tbody > tr[b-h7wnieghiw] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-h7wnieghiw] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-h7wnieghiw],
        .dxbs-grid-detail-cell > *[b-h7wnieghiw] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-h7wnieghiw] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-h7wnieghiw],
    .dxbs-grid-header-content[b-h7wnieghiw],
    .dxbs-grid-filter-row[b-h7wnieghiw],
    .dxbs-grid-command-column[b-h7wnieghiw],
    .dxbs-grid-selection-column[b-h7wnieghiw],
    .dxbs-grid-data-column[b-h7wnieghiw],
    .dxbs-grid-table thead[b-h7wnieghiw],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-h7wnieghiw] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-h7wnieghiw],
    .dxbs-grid-table > tbody[b-h7wnieghiw],
    .dxbs-grid-table > tbody > tr[b-h7wnieghiw] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-h7wnieghiw] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-h7wnieghiw] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-h7wnieghiw] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-h7wnieghiw] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-h7wnieghiw] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-h7wnieghiw] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-h7wnieghiw] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-h7wnieghiw] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-h7wnieghiw]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-h7wnieghiw] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-h7wnieghiw] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-h7wnieghiw] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-h7wnieghiw] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-h7wnieghiw] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-h7wnieghiw] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-h7wnieghiw] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-h7wnieghiw] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-h7wnieghiw] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-h7wnieghiw] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-h7wnieghiw] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-h7wnieghiw] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-h7wnieghiw] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-h7wnieghiw] {
    color: #667eea;
}

.separator[b-h7wnieghiw] {
    color: var(--text-muted);
}

.total-pages[b-h7wnieghiw] {
    color: var(--text-secondary);
}




.page-size-selector[b-h7wnieghiw] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-h7wnieghiw] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-h7wnieghiw] {
        border-color: #667eea;
    }

.pagination-text[b-h7wnieghiw] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-h7wnieghiw] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-h7wnieghiw] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-h7wnieghiw] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-h7wnieghiw] {
        transform: scale(0.98);
    }

.card-header-section[b-h7wnieghiw] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-h7wnieghiw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-h7wnieghiw] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-h7wnieghiw] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-h7wnieghiw] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-h7wnieghiw] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-h7wnieghiw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-h7wnieghiw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-h7wnieghiw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-h7wnieghiw] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-h7wnieghiw] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-h7wnieghiw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-h7wnieghiw] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-h7wnieghiw] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-h7wnieghiw] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-h7wnieghiw] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-h7wnieghiw] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-h7wnieghiw] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-h7wnieghiw] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-h7wnieghiw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-h7wnieghiw] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-h7wnieghiw] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-h7wnieghiw] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-h7wnieghiw] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-h7wnieghiw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-h7wnieghiw] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-h7wnieghiw] {
        transform: scale(0.95);
    }

.btn-primary[b-h7wnieghiw] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-h7wnieghiw] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-h7wnieghiw] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-h7wnieghiw] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-h7wnieghiw] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-h7wnieghiw] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-h7wnieghiw] {
        font-size: 14px;
    }

    .card-quick-info[b-h7wnieghiw] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-h7wnieghiw] {
        padding: 10px;
    }

    .stok-card[b-h7wnieghiw] {
        margin: 6px 10px;
    }

    .quick-value[b-h7wnieghiw] {
        font-size: 15px;
    }

    .card-header-section[b-h7wnieghiw] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-h7wnieghiw],
    .stok-card[b-h7wnieghiw],
    .mobile-pagination[b-h7wnieghiw],
    .pagination-details[b-h7wnieghiw] {
        display: none !important;
    }
}

@keyframes fadeIn-b-h7wnieghiw {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-h7wnieghiw] {
    animation: fadeIn-b-h7wnieghiw 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-h7wnieghiw]::-webkit-scrollbar {
        width: 6px;
    }

    [b-h7wnieghiw]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-h7wnieghiw]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-h7wnieghiw]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-h7wnieghiw] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-h7wnieghiw] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-h7wnieghiw] {
    background: #0f172a;
}

.pagination-btn[b-h7wnieghiw] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-h7wnieghiw] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-h7wnieghiw] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-h7wnieghiw] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-h7wnieghiw] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-h7wnieghiw] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-h7wnieghiw] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-h7wnieghiw] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-h7wnieghiw] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-h7wnieghiw] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-h7wnieghiw] {
        border-color: #667eea;
    }

.pagination-text[b-h7wnieghiw] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-h7wnieghiw] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-h7wnieghiw] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-h7wnieghiw] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-h7wnieghiw]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-h7wnieghiw] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-h7wnieghiw] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-h7wnieghiw] {
        transform: scale(0.95);
    }

#faturaContainer[b-h7wnieghiw] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Kasa/KasaMobil/KasaMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-kof8zyx6g6] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-kof8zyx6g6] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-kof8zyx6g6] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-kof8zyx6g6] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-kof8zyx6g6] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-kof8zyx6g6] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-kof8zyx6g6]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-kof8zyx6g6] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-kof8zyx6g6] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-kof8zyx6g6] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-kof8zyx6g6] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-kof8zyx6g6] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-kof8zyx6g6] {
        transform: scale(0.98);
    }

.card-header-section[b-kof8zyx6g6] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-kof8zyx6g6] {
    width: 100%;
}

.card-title-row[b-kof8zyx6g6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-kof8zyx6g6] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-kof8zyx6g6] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-kof8zyx6g6] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-kof8zyx6g6] {
        transform: rotate(0deg);
    }

.card-meta-row[b-kof8zyx6g6] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-kof8zyx6g6] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-kof8zyx6g6] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-kof8zyx6g6] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-kof8zyx6g6] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-kof8zyx6g6] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-kof8zyx6g6] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-kof8zyx6g6] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-kof8zyx6g6] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-kof8zyx6g6] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-kof8zyx6g6] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-kof8zyx6g6] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-kof8zyx6g6] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-kof8zyx6g6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-kof8zyx6g6] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-kof8zyx6g6] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-kof8zyx6g6] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-kof8zyx6g6] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-kof8zyx6g6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-kof8zyx6g6] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

.btn-primary[b-kof8zyx6g6] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-kof8zyx6g6] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-kof8zyx6g6] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-kof8zyx6g6] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-kof8zyx6g6] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-kof8zyx6g6] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-kof8zyx6g6] {
        font-size: 14px;
    }

    .card-quick-info[b-kof8zyx6g6] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-kof8zyx6g6] {
        padding: 10px;
    }

    .stok-card[b-kof8zyx6g6] {
        margin: 6px 10px;
    }

    .quick-value[b-kof8zyx6g6] {
        font-size: 15px;
    }

    .card-header-section[b-kof8zyx6g6] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-kof8zyx6g6],
    .stok-card[b-kof8zyx6g6] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-kof8zyx6g6 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-kof8zyx6g6] {
    animation: fadeIn-b-kof8zyx6g6 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-kof8zyx6g6]::-webkit-scrollbar {
        width: 6px;
    }

    [b-kof8zyx6g6]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-kof8zyx6g6]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-kof8zyx6g6]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-kof8zyx6g6],
    .custom-grid[b-kof8zyx6g6] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-kof8zyx6g6],
    [data-bs-theme="dark"] .custom-grid[b-kof8zyx6g6] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-kof8zyx6g6],
    .dxbs-grid-header-content[b-kof8zyx6g6],
    .dxbs-grid-header-panel[b-kof8zyx6g6],
    .dxbs-grid-filter-row[b-kof8zyx6g6],
    .dxbs-grid-command-column[b-kof8zyx6g6],
    .dxbs-grid-selection-column[b-kof8zyx6g6],
    .dxbs-grid-data-column[b-kof8zyx6g6],
    .dxbs-grid-table thead[b-kof8zyx6g6],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-kof8zyx6g6],
    .dxbs-grid-table > tbody > tr > th[b-kof8zyx6g6],
    .dxbs-grid-pager[b-kof8zyx6g6],
    .dxbs-grid-empty-data[b-kof8zyx6g6],
    .dxbs-grid-toolbar[b-kof8zyx6g6],
    .dxbs-grid-statusbar[b-kof8zyx6g6] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-kof8zyx6g6],
    .dxbs-grid-table > tbody[b-kof8zyx6g6],
    .dxbs-grid-table > tbody > tr[b-kof8zyx6g6] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-kof8zyx6g6] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-kof8zyx6g6],
        .dxbs-grid-detail-cell > *[b-kof8zyx6g6] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-kof8zyx6g6] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-kof8zyx6g6],
    .dxbs-grid-header-content[b-kof8zyx6g6],
    .dxbs-grid-filter-row[b-kof8zyx6g6],
    .dxbs-grid-command-column[b-kof8zyx6g6],
    .dxbs-grid-selection-column[b-kof8zyx6g6],
    .dxbs-grid-data-column[b-kof8zyx6g6],
    .dxbs-grid-table thead[b-kof8zyx6g6],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-kof8zyx6g6] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-kof8zyx6g6],
    .dxbs-grid-table > tbody[b-kof8zyx6g6],
    .dxbs-grid-table > tbody > tr[b-kof8zyx6g6] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-kof8zyx6g6] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-kof8zyx6g6] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-kof8zyx6g6] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-kof8zyx6g6] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-kof8zyx6g6] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-kof8zyx6g6] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-kof8zyx6g6] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-kof8zyx6g6] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-kof8zyx6g6]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-kof8zyx6g6] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-kof8zyx6g6] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-kof8zyx6g6] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-kof8zyx6g6] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-kof8zyx6g6] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-kof8zyx6g6] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-kof8zyx6g6] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-kof8zyx6g6] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-kof8zyx6g6] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-kof8zyx6g6] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-kof8zyx6g6] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-kof8zyx6g6] {
    color: #667eea;
}

.separator[b-kof8zyx6g6] {
    color: var(--text-muted);
}

.total-pages[b-kof8zyx6g6] {
    color: var(--text-secondary);
}




.page-size-selector[b-kof8zyx6g6] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-kof8zyx6g6] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-kof8zyx6g6] {
        border-color: #667eea;
    }

.pagination-text[b-kof8zyx6g6] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-kof8zyx6g6] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-kof8zyx6g6] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-kof8zyx6g6] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-kof8zyx6g6] {
        transform: scale(0.98);
    }

.card-header-section[b-kof8zyx6g6] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-kof8zyx6g6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-kof8zyx6g6] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-kof8zyx6g6] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-kof8zyx6g6] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-kof8zyx6g6] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-kof8zyx6g6] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-kof8zyx6g6] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-kof8zyx6g6] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-kof8zyx6g6] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-kof8zyx6g6] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-kof8zyx6g6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-kof8zyx6g6] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-kof8zyx6g6] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-kof8zyx6g6] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-kof8zyx6g6] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-kof8zyx6g6] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-kof8zyx6g6] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-kof8zyx6g6] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-kof8zyx6g6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-kof8zyx6g6] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-kof8zyx6g6] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-kof8zyx6g6] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-kof8zyx6g6] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-kof8zyx6g6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-kof8zyx6g6] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

.btn-primary[b-kof8zyx6g6] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-kof8zyx6g6] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-kof8zyx6g6] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-kof8zyx6g6] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-kof8zyx6g6] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-kof8zyx6g6] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-kof8zyx6g6] {
        font-size: 14px;
    }

    .card-quick-info[b-kof8zyx6g6] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-kof8zyx6g6] {
        padding: 10px;
    }

    .stok-card[b-kof8zyx6g6] {
        margin: 6px 10px;
    }

    .quick-value[b-kof8zyx6g6] {
        font-size: 15px;
    }

    .card-header-section[b-kof8zyx6g6] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-kof8zyx6g6],
    .stok-card[b-kof8zyx6g6],
    .mobile-pagination[b-kof8zyx6g6],
    .pagination-details[b-kof8zyx6g6] {
        display: none !important;
    }
}

@keyframes fadeIn-b-kof8zyx6g6 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-kof8zyx6g6] {
    animation: fadeIn-b-kof8zyx6g6 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-kof8zyx6g6]::-webkit-scrollbar {
        width: 6px;
    }

    [b-kof8zyx6g6]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-kof8zyx6g6]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-kof8zyx6g6]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-kof8zyx6g6] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-kof8zyx6g6] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-kof8zyx6g6] {
    background: #0f172a;
}

.pagination-btn[b-kof8zyx6g6] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-kof8zyx6g6] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-kof8zyx6g6] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-kof8zyx6g6] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-kof8zyx6g6] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-kof8zyx6g6] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-kof8zyx6g6] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-kof8zyx6g6] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-kof8zyx6g6] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-kof8zyx6g6] {
        border-color: #667eea;
    }

.pagination-text[b-kof8zyx6g6] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-kof8zyx6g6] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-kof8zyx6g6] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-kof8zyx6g6] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-kof8zyx6g6]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-kof8zyx6g6] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-kof8zyx6g6] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-kof8zyx6g6] {
        transform: scale(0.95);
    }

#faturaContainer[b-kof8zyx6g6] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/FinansYonetimi/Kasa/Okc/OkcMobil/OkcMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-o76phh22xo] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-o76phh22xo] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-o76phh22xo] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-o76phh22xo] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-o76phh22xo] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-o76phh22xo] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-o76phh22xo]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-o76phh22xo] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-o76phh22xo] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-o76phh22xo] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-o76phh22xo] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-o76phh22xo] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-o76phh22xo] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-o76phh22xo] {
        transform: scale(0.98);
    }

.card-header-section[b-o76phh22xo] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-o76phh22xo] {
    width: 100%;
}

.card-title-row[b-o76phh22xo] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-o76phh22xo] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-o76phh22xo] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-o76phh22xo] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-o76phh22xo] {
        transform: rotate(0deg);
    }

.card-meta-row[b-o76phh22xo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-o76phh22xo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-o76phh22xo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-o76phh22xo] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-o76phh22xo] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-o76phh22xo] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-o76phh22xo] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-o76phh22xo] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-o76phh22xo] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-o76phh22xo] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-o76phh22xo] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-o76phh22xo] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-o76phh22xo] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-o76phh22xo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-o76phh22xo] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-o76phh22xo] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-o76phh22xo] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-o76phh22xo] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-o76phh22xo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-o76phh22xo] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-o76phh22xo] {
        transform: scale(0.95);
    }

.btn-primary[b-o76phh22xo] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-o76phh22xo] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-o76phh22xo] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-o76phh22xo] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-o76phh22xo] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-o76phh22xo] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-o76phh22xo] {
        font-size: 14px;
    }

    .card-quick-info[b-o76phh22xo] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-o76phh22xo] {
        padding: 10px;
    }

    .stok-card[b-o76phh22xo] {
        margin: 6px 10px;
    }

    .quick-value[b-o76phh22xo] {
        font-size: 15px;
    }

    .card-header-section[b-o76phh22xo] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-o76phh22xo],
    .stok-card[b-o76phh22xo] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-o76phh22xo {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-o76phh22xo] {
    animation: fadeIn-b-o76phh22xo 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-o76phh22xo]::-webkit-scrollbar {
        width: 6px;
    }

    [b-o76phh22xo]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-o76phh22xo]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-o76phh22xo]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-o76phh22xo],
    .custom-grid[b-o76phh22xo] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-o76phh22xo],
    [data-bs-theme="dark"] .custom-grid[b-o76phh22xo] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-o76phh22xo],
    .dxbs-grid-header-content[b-o76phh22xo],
    .dxbs-grid-header-panel[b-o76phh22xo],
    .dxbs-grid-filter-row[b-o76phh22xo],
    .dxbs-grid-command-column[b-o76phh22xo],
    .dxbs-grid-selection-column[b-o76phh22xo],
    .dxbs-grid-data-column[b-o76phh22xo],
    .dxbs-grid-table thead[b-o76phh22xo],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-o76phh22xo],
    .dxbs-grid-table > tbody > tr > th[b-o76phh22xo],
    .dxbs-grid-pager[b-o76phh22xo],
    .dxbs-grid-empty-data[b-o76phh22xo],
    .dxbs-grid-toolbar[b-o76phh22xo],
    .dxbs-grid-statusbar[b-o76phh22xo] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-o76phh22xo],
    .dxbs-grid-table > tbody[b-o76phh22xo],
    .dxbs-grid-table > tbody > tr[b-o76phh22xo] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-o76phh22xo] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-o76phh22xo],
        .dxbs-grid-detail-cell > *[b-o76phh22xo] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-o76phh22xo] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-o76phh22xo],
    .dxbs-grid-header-content[b-o76phh22xo],
    .dxbs-grid-filter-row[b-o76phh22xo],
    .dxbs-grid-command-column[b-o76phh22xo],
    .dxbs-grid-selection-column[b-o76phh22xo],
    .dxbs-grid-data-column[b-o76phh22xo],
    .dxbs-grid-table thead[b-o76phh22xo],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-o76phh22xo] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-o76phh22xo],
    .dxbs-grid-table > tbody[b-o76phh22xo],
    .dxbs-grid-table > tbody > tr[b-o76phh22xo] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-o76phh22xo] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-o76phh22xo] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-o76phh22xo] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-o76phh22xo] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-o76phh22xo] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-o76phh22xo] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-o76phh22xo] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-o76phh22xo] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-o76phh22xo]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-o76phh22xo] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-o76phh22xo] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-o76phh22xo] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-o76phh22xo] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-o76phh22xo] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-o76phh22xo] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-o76phh22xo] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-o76phh22xo] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-o76phh22xo] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-o76phh22xo] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-o76phh22xo] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-o76phh22xo] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-o76phh22xo] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-o76phh22xo] {
    color: #667eea;
}

.separator[b-o76phh22xo] {
    color: var(--text-muted);
}

.total-pages[b-o76phh22xo] {
    color: var(--text-secondary);
}




.page-size-selector[b-o76phh22xo] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-o76phh22xo] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-o76phh22xo] {
        border-color: #667eea;
    }

.pagination-text[b-o76phh22xo] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-o76phh22xo] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-o76phh22xo] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-o76phh22xo] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-o76phh22xo] {
        transform: scale(0.98);
    }

.card-header-section[b-o76phh22xo] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-o76phh22xo] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-o76phh22xo] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-o76phh22xo] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-o76phh22xo] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-o76phh22xo] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-o76phh22xo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-o76phh22xo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-o76phh22xo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-o76phh22xo] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-o76phh22xo] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-o76phh22xo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-o76phh22xo] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-o76phh22xo] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-o76phh22xo] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-o76phh22xo] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-o76phh22xo] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-o76phh22xo] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-o76phh22xo] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-o76phh22xo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-o76phh22xo] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-o76phh22xo] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-o76phh22xo] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-o76phh22xo] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-o76phh22xo] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-o76phh22xo] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-o76phh22xo] {
        transform: scale(0.95);
    }

.btn-primary[b-o76phh22xo] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-o76phh22xo] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-o76phh22xo] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-o76phh22xo] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-o76phh22xo] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-o76phh22xo] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-o76phh22xo] {
        font-size: 14px;
    }

    .card-quick-info[b-o76phh22xo] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-o76phh22xo] {
        padding: 10px;
    }

    .stok-card[b-o76phh22xo] {
        margin: 6px 10px;
    }

    .quick-value[b-o76phh22xo] {
        font-size: 15px;
    }

    .card-header-section[b-o76phh22xo] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-o76phh22xo],
    .stok-card[b-o76phh22xo],
    .mobile-pagination[b-o76phh22xo],
    .pagination-details[b-o76phh22xo] {
        display: none !important;
    }
}

@keyframes fadeIn-b-o76phh22xo {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-o76phh22xo] {
    animation: fadeIn-b-o76phh22xo 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-o76phh22xo]::-webkit-scrollbar {
        width: 6px;
    }

    [b-o76phh22xo]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-o76phh22xo]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-o76phh22xo]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-o76phh22xo] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-o76phh22xo] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-o76phh22xo] {
    background: #0f172a;
}

.pagination-btn[b-o76phh22xo] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-o76phh22xo] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-o76phh22xo] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-o76phh22xo] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-o76phh22xo] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-o76phh22xo] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-o76phh22xo] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-o76phh22xo] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-o76phh22xo] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-o76phh22xo] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-o76phh22xo] {
        border-color: #667eea;
    }

.pagination-text[b-o76phh22xo] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-o76phh22xo] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-o76phh22xo] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-o76phh22xo] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-o76phh22xo]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-o76phh22xo] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-o76phh22xo] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-o76phh22xo] {
        transform: scale(0.95);
    }

#faturaContainer[b-o76phh22xo] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/Index.razor.rz.scp.css */
/*:root {
    --primary-color: #4361ee;
    --primary-light: #4895ef;
    --secondary-color: #3f37c9;
    --success-color: #4cc9f0;
    --danger-color: #f72585;
    --warning-color: #f8961e;
    --info-color: #4895ef;
    --dark-color: #12124a;
    --light-color: #f8f9fa;
    --gray-color: #e9ecef;
    --gradient-primary: linear-gradient(135deg, #4361ee 0%, #3a0ca3 100%);
    --gradient-success: linear-gradient(135deg, #4cc9f0 0%, #4895ef 100%);
    --gradient-danger: linear-gradient(135deg, #f72585 0%, #b51d81 100%);
    --gradient-warning: linear-gradient(135deg, #f8961e 0%, #f3722c 100%);
    --shadow-sm: 0 .125rem .25rem rgba(0,0,0,.075);
    --shadow: 0 .5rem 1rem rgba(0,0,0,.15);
    --shadow-lg: 0 1rem 3rem rgba(0,0,0,.175);
    --card-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(0,0,0,.1);
    --dashboard-shadow: 0 8px 30px rgba(0,0,0,.1);
}*/

body[b-8r8lpzj5m7] {
    font-family: 'Poppins', sans-serif;
    background-color: #f5f7fa;
    color: #495057;
}

/* Dashboard Header */
.dashboard-header[b-8r8lpzj5m7] {
    background: linear-gradient(135deg, #cfdeea 0%, #a2c8dd 100%);
    border-radius: 12px;
    padding: 1.5rem;
    color: white; /* Lacivertimsi koyu gri */
    margin-bottom: 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: var(--dashboard-shadow);
}

    .dashboard-header h5[b-8r8lpzj5m7] {
        font-size: 1.5rem;
        font-weight: 600;
        margin: 0;
    }

/* Cards */
.card[b-8r8lpzj5m7] {
    border-radius: 12px;
    border: none;
    box-shadow: var(--card-shadow);
    transition: all 0.3s ease;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

    .card:hover[b-8r8lpzj5m7] {
        transform: translateY(-5px);
        box-shadow: 0 8px 25px rgba(0,0,0,.18);
    }

.card-header[b-8r8lpzj5m7] {
    background-color: white;
    border-bottom: 1px solid rgba(0,0,0,.05);
    font-weight: 600;
    padding: 1rem 1.5rem;
}

.card-body[b-8r8lpzj5m7] {
    padding: 1.5rem;
}

/* Metric Cards */
.metric-card[b-8r8lpzj5m7] {
    height: 100%;
}

    .metric-card .card-header[b-8r8lpzj5m7] {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .metric-card .card-header h5[b-8r8lpzj5m7] {
            font-size: 1rem;
            font-weight: 600;
        }

.finance-card[b-8r8lpzj5m7] {
    border-radius: 12px;
    overflow: hidden;
}

    .finance-card .card-header[b-8r8lpzj5m7] {
        padding: 1rem 1.5rem;
    }

/* Charts */
.chart-container[b-8r8lpzj5m7] {
    min-height: 250px;
    width: 100%;
}

.trends-chart-container[b-8r8lpzj5m7] {
    min-height: 300px;
    width: 100%;
}

.mini-chart-container[b-8r8lpzj5m7] {
    min-height: 150px;
    width: 100%;
}

/* Progress Bar */
.progress-container[b-8r8lpzj5m7] {
    padding: 0.5rem 1.5rem 1.5rem;
}

.progress[b-8r8lpzj5m7] {
    height: 10px;
    border-radius: 5px;
    overflow: hidden;
    background-color: #eaecf0;
}

.progress-bar[b-8r8lpzj5m7] {
    background: var(--gradient-success);
}

/* Badges */
.badge[b-8r8lpzj5m7] {
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-weight: 500;
    font-size: 0.8rem;
}

.bg-blue-2[b-8r8lpzj5m7] {
    background-color: var(--primary-light);
}

.bg-blue-3[b-8r8lpzj5m7] {
    background-color: var(--primary-color);
}

.bg-red-1[b-8r8lpzj5m7] {
    background: var(--danger-color);
}

.bg-green-1[b-8r8lpzj5m7] {
    background-color: var(--success-color);
}

/* Tabs */
.nav-pills[b-8r8lpzj5m7] {
    border-radius: 50px;
    background-color: #eaecf0;
    padding: 0.3rem;
    margin-bottom: 2rem;
    display: inline-flex;
}

    .nav-pills .nav-link[b-8r8lpzj5m7] {
        border-radius: 50px;
        padding: 0.75rem 1.5rem;
        font-weight: 500;
        color: #495057;
        margin: 0 0.2rem;
        transition: all 0.3s ease;
    }

        .nav-pills .nav-link:hover[b-8r8lpzj5m7] {
            color: var(--primary-color);
        }

        .nav-pills .nav-link.active[b-8r8lpzj5m7] {
            background-color: var(--primary-color);
            color: white;
            box-shadow: 0 4px 8px rgba(67, 97, 238, 0.3);
        }

/* Tables */
.table-detailed[b-8r8lpzj5m7] {
    border-collapse: separate;
    border-spacing: 0 0.5rem;
}

    .table-detailed thead th[b-8r8lpzj5m7] {
        border: none;
        font-weight: 600;
        padding: 1rem;
        background-color: #f8f9fa;
        color: #495057;
    }

    .table-detailed tbody td[b-8r8lpzj5m7] {
        padding: 1rem;
        border: none;
        background-color: white;
        vertical-align: middle;
    }

    .table-detailed tbody tr[b-8r8lpzj5m7] {
        box-shadow: var(--shadow-sm);
        border-radius: 8px;
        transition: all 0.3s ease;
    }

        .table-detailed tbody tr:hover[b-8r8lpzj5m7] {
            transform: translateY(-2px);
            box-shadow: var(--shadow);
        }

    .table-detailed tfoot tr[b-8r8lpzj5m7] {
        font-weight: 600;
    }

/* Custom Card Navigation */
.nav-tabs[b-8r8lpzj5m7] {
    border: none;
    gap: 1rem;
}

    .nav-tabs .nav-item .nav-link[b-8r8lpzj5m7] {
        border: none;
        background-color: transparent;
        transition: all 0.3s ease;
    }

        .nav-tabs .nav-item .nav-link:hover[b-8r8lpzj5m7] {
            transform: translateY(-5px);
        }

        .nav-tabs .nav-item .nav-link.active[b-8r8lpzj5m7] {
            border: none;
            transform: translateY(-8px);
        }

/* Card title for summary cards */
.summary-card h3[b-8r8lpzj5m7] {
    font-size: 1rem;
    font-weight: 600;
    color: #6c757d;
}

.summary-card h1[b-8r8lpzj5m7] {
    font-size: 1.8rem;
    font-weight: 700;
    margin: 1rem 0;
}

/* Accordion */
.accordion-button:not(.collapsed)[b-8r8lpzj5m7] {
    background-color: white;
    color: var(--primary-color);
    box-shadow: none;
}

.accordion-button:focus[b-8r8lpzj5m7] {
    box-shadow: none;
}

.accordion-button[b-8r8lpzj5m7]::after {
    background-color: var(--primary-light);
    border-radius: 50%;
    background-position: center;
    width: 1.5rem;
    height: 1.5rem;
    background-size: 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Equal height row */
.equal-height-row[b-8r8lpzj5m7] {
    display: flex;
    flex-wrap: wrap;
}

    .equal-height-row > [class*='col-'][b-8r8lpzj5m7] {
        display: flex;
        flex-direction: column;
    }

    .equal-height-row .card[b-8r8lpzj5m7] {
        flex: 1;
    }

/* Chart placeholders */
.chart-placeholder[b-8r8lpzj5m7] {
    min-height: 200px;
    width: 100%;
    background-color: #f8f9fa;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Custom Section Styles */
.section-header[b-8r8lpzj5m7] {
    padding: 1.5rem;
    margin-bottom: 2rem;
    text-align: center;
    border-radius: 12px;
    background: var(--gradient-primary);
    color: white;
    box-shadow: var(--shadow);
}

/* Animation for progress bars */
.progress-bar-animated[b-8r8lpzj5m7] {
    animation: progress-bar-stripes 1s linear infinite;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .dashboard-header[b-8r8lpzj5m7] {
        flex-direction: column;
        text-align: center;
    }

    .nav-pills[b-8r8lpzj5m7] {
        display: flex;
        justify-content: center;
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
    }
}
/* _content/Client/Pages/Menu.razor.rz.scp.css */
@media (max-width: 768px) {
    .mobileMenu[b-i0qo95li0y] {
        font-size: 2rem !important;
        font-weight: bold !important;
    }

        .mobileMenu .menu-link[b-i0qo95li0y] {
            font-size: 2rem !important;
            font-weight: bold !important;
        }
    .menu-item .menu-icon i[b-i0qo95li0y] {
        font-size: 2rem; 
    }
}
/* _content/Client/Pages/SatinAlma/Fatura/AlisFaturasiMobil/AlisFaturasiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-he7zzx3d5l] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-he7zzx3d5l] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-he7zzx3d5l] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-he7zzx3d5l] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-he7zzx3d5l] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-he7zzx3d5l] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-he7zzx3d5l]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-he7zzx3d5l] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-he7zzx3d5l] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-he7zzx3d5l] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-he7zzx3d5l] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-he7zzx3d5l] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-he7zzx3d5l] {
        transform: scale(0.98);
    }

.card-header-section[b-he7zzx3d5l] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-he7zzx3d5l] {
    width: 100%;
}

.card-title-row[b-he7zzx3d5l] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-he7zzx3d5l] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-he7zzx3d5l] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-he7zzx3d5l] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-he7zzx3d5l] {
        transform: rotate(0deg);
    }

.card-meta-row[b-he7zzx3d5l] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-he7zzx3d5l] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-he7zzx3d5l] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-he7zzx3d5l] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-he7zzx3d5l] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-he7zzx3d5l] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-he7zzx3d5l] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-he7zzx3d5l] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-he7zzx3d5l] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-he7zzx3d5l] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-he7zzx3d5l] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-he7zzx3d5l] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-he7zzx3d5l] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-he7zzx3d5l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-he7zzx3d5l] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-he7zzx3d5l] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-he7zzx3d5l] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-he7zzx3d5l] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-he7zzx3d5l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-he7zzx3d5l] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

.btn-primary[b-he7zzx3d5l] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-he7zzx3d5l] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-he7zzx3d5l] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-he7zzx3d5l] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-he7zzx3d5l] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-he7zzx3d5l] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-he7zzx3d5l] {
        font-size: 14px;
    }

    .card-quick-info[b-he7zzx3d5l] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-he7zzx3d5l] {
        padding: 10px;
    }

    .stok-card[b-he7zzx3d5l] {
        margin: 6px 10px;
    }

    .quick-value[b-he7zzx3d5l] {
        font-size: 15px;
    }

    .card-header-section[b-he7zzx3d5l] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-he7zzx3d5l],
    .stok-card[b-he7zzx3d5l] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-he7zzx3d5l {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-he7zzx3d5l] {
    animation: fadeIn-b-he7zzx3d5l 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-he7zzx3d5l]::-webkit-scrollbar {
        width: 6px;
    }

    [b-he7zzx3d5l]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-he7zzx3d5l]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-he7zzx3d5l]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-he7zzx3d5l],
    .custom-grid[b-he7zzx3d5l] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-he7zzx3d5l],
    [data-bs-theme="dark"] .custom-grid[b-he7zzx3d5l] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-he7zzx3d5l],
    .dxbs-grid-header-content[b-he7zzx3d5l],
    .dxbs-grid-header-panel[b-he7zzx3d5l],
    .dxbs-grid-filter-row[b-he7zzx3d5l],
    .dxbs-grid-command-column[b-he7zzx3d5l],
    .dxbs-grid-selection-column[b-he7zzx3d5l],
    .dxbs-grid-data-column[b-he7zzx3d5l],
    .dxbs-grid-table thead[b-he7zzx3d5l],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-he7zzx3d5l],
    .dxbs-grid-table > tbody > tr > th[b-he7zzx3d5l],
    .dxbs-grid-pager[b-he7zzx3d5l],
    .dxbs-grid-empty-data[b-he7zzx3d5l],
    .dxbs-grid-toolbar[b-he7zzx3d5l],
    .dxbs-grid-statusbar[b-he7zzx3d5l] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-he7zzx3d5l],
    .dxbs-grid-table > tbody[b-he7zzx3d5l],
    .dxbs-grid-table > tbody > tr[b-he7zzx3d5l] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-he7zzx3d5l] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-he7zzx3d5l],
        .dxbs-grid-detail-cell > *[b-he7zzx3d5l] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-he7zzx3d5l] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-he7zzx3d5l],
    .dxbs-grid-header-content[b-he7zzx3d5l],
    .dxbs-grid-filter-row[b-he7zzx3d5l],
    .dxbs-grid-command-column[b-he7zzx3d5l],
    .dxbs-grid-selection-column[b-he7zzx3d5l],
    .dxbs-grid-data-column[b-he7zzx3d5l],
    .dxbs-grid-table thead[b-he7zzx3d5l],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-he7zzx3d5l] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-he7zzx3d5l],
    .dxbs-grid-table > tbody[b-he7zzx3d5l],
    .dxbs-grid-table > tbody > tr[b-he7zzx3d5l] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-he7zzx3d5l] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-he7zzx3d5l] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-he7zzx3d5l] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-he7zzx3d5l] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-he7zzx3d5l] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-he7zzx3d5l] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-he7zzx3d5l] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-he7zzx3d5l] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-he7zzx3d5l]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-he7zzx3d5l] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-he7zzx3d5l] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-he7zzx3d5l] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-he7zzx3d5l] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-he7zzx3d5l] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-he7zzx3d5l] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-he7zzx3d5l] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-he7zzx3d5l] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-he7zzx3d5l] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-he7zzx3d5l] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-he7zzx3d5l] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-he7zzx3d5l] {
    color: #667eea;
}

.separator[b-he7zzx3d5l] {
    color: var(--text-muted);
}

.total-pages[b-he7zzx3d5l] {
    color: var(--text-secondary);
}




.page-size-selector[b-he7zzx3d5l] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-he7zzx3d5l] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-he7zzx3d5l] {
        border-color: #667eea;
    }

.pagination-text[b-he7zzx3d5l] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-he7zzx3d5l] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-he7zzx3d5l] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-he7zzx3d5l] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-he7zzx3d5l] {
        transform: scale(0.98);
    }

.card-header-section[b-he7zzx3d5l] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-he7zzx3d5l] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-he7zzx3d5l] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-he7zzx3d5l] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-he7zzx3d5l] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-he7zzx3d5l] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-he7zzx3d5l] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-he7zzx3d5l] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-he7zzx3d5l] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-he7zzx3d5l] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-he7zzx3d5l] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-he7zzx3d5l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-he7zzx3d5l] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-he7zzx3d5l] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-he7zzx3d5l] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-he7zzx3d5l] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-he7zzx3d5l] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-he7zzx3d5l] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-he7zzx3d5l] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-he7zzx3d5l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-he7zzx3d5l] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-he7zzx3d5l] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-he7zzx3d5l] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-he7zzx3d5l] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-he7zzx3d5l] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-he7zzx3d5l] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

.btn-primary[b-he7zzx3d5l] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-he7zzx3d5l] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-he7zzx3d5l] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-he7zzx3d5l] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-he7zzx3d5l] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-he7zzx3d5l] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-he7zzx3d5l] {
        font-size: 14px;
    }

    .card-quick-info[b-he7zzx3d5l] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-he7zzx3d5l] {
        padding: 10px;
    }

    .stok-card[b-he7zzx3d5l] {
        margin: 6px 10px;
    }

    .quick-value[b-he7zzx3d5l] {
        font-size: 15px;
    }

    .card-header-section[b-he7zzx3d5l] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-he7zzx3d5l],
    .stok-card[b-he7zzx3d5l],
    .mobile-pagination[b-he7zzx3d5l],
    .pagination-details[b-he7zzx3d5l] {
        display: none !important;
    }
}

@keyframes fadeIn-b-he7zzx3d5l {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-he7zzx3d5l] {
    animation: fadeIn-b-he7zzx3d5l 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-he7zzx3d5l]::-webkit-scrollbar {
        width: 6px;
    }

    [b-he7zzx3d5l]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-he7zzx3d5l]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-he7zzx3d5l]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-he7zzx3d5l] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-he7zzx3d5l] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-he7zzx3d5l] {
    background: #0f172a;
}

.pagination-btn[b-he7zzx3d5l] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-he7zzx3d5l] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-he7zzx3d5l] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-he7zzx3d5l] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-he7zzx3d5l] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-he7zzx3d5l] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-he7zzx3d5l] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-he7zzx3d5l] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-he7zzx3d5l] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-he7zzx3d5l] {
        border-color: #667eea;
    }

.pagination-text[b-he7zzx3d5l] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-he7zzx3d5l] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-he7zzx3d5l] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-he7zzx3d5l] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-he7zzx3d5l]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-he7zzx3d5l] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-he7zzx3d5l] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-he7zzx3d5l] {
        transform: scale(0.95);
    }

#faturaContainer[b-he7zzx3d5l] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/SatinAlma/Siparis/VerilenSiparisMobil/VerilenSiparisMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-gmxk30l8bc] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-gmxk30l8bc] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-gmxk30l8bc] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-gmxk30l8bc] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-gmxk30l8bc] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-gmxk30l8bc] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-gmxk30l8bc]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-gmxk30l8bc] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-gmxk30l8bc] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-gmxk30l8bc] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-gmxk30l8bc] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-gmxk30l8bc] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-gmxk30l8bc] {
        transform: scale(0.98);
    }

.card-header-section[b-gmxk30l8bc] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-gmxk30l8bc] {
    width: 100%;
}

.card-title-row[b-gmxk30l8bc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-gmxk30l8bc] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-gmxk30l8bc] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-gmxk30l8bc] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-gmxk30l8bc] {
        transform: rotate(0deg);
    }

.card-meta-row[b-gmxk30l8bc] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-gmxk30l8bc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-gmxk30l8bc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-gmxk30l8bc] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-gmxk30l8bc] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-gmxk30l8bc] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-gmxk30l8bc] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-gmxk30l8bc] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-gmxk30l8bc] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-gmxk30l8bc] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-gmxk30l8bc] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-gmxk30l8bc] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-gmxk30l8bc] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-gmxk30l8bc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-gmxk30l8bc] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-gmxk30l8bc] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-gmxk30l8bc] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-gmxk30l8bc] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-gmxk30l8bc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-gmxk30l8bc] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

.btn-primary[b-gmxk30l8bc] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-gmxk30l8bc] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-gmxk30l8bc] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-gmxk30l8bc] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-gmxk30l8bc] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-gmxk30l8bc] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-gmxk30l8bc] {
        font-size: 14px;
    }

    .card-quick-info[b-gmxk30l8bc] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-gmxk30l8bc] {
        padding: 10px;
    }

    .stok-card[b-gmxk30l8bc] {
        margin: 6px 10px;
    }

    .quick-value[b-gmxk30l8bc] {
        font-size: 15px;
    }

    .card-header-section[b-gmxk30l8bc] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-gmxk30l8bc],
    .stok-card[b-gmxk30l8bc] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-gmxk30l8bc {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-gmxk30l8bc] {
    animation: fadeIn-b-gmxk30l8bc 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-gmxk30l8bc]::-webkit-scrollbar {
        width: 6px;
    }

    [b-gmxk30l8bc]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-gmxk30l8bc]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-gmxk30l8bc]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-gmxk30l8bc],
    .custom-grid[b-gmxk30l8bc] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-gmxk30l8bc],
    [data-bs-theme="dark"] .custom-grid[b-gmxk30l8bc] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-gmxk30l8bc],
    .dxbs-grid-header-content[b-gmxk30l8bc],
    .dxbs-grid-header-panel[b-gmxk30l8bc],
    .dxbs-grid-filter-row[b-gmxk30l8bc],
    .dxbs-grid-command-column[b-gmxk30l8bc],
    .dxbs-grid-selection-column[b-gmxk30l8bc],
    .dxbs-grid-data-column[b-gmxk30l8bc],
    .dxbs-grid-table thead[b-gmxk30l8bc],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-gmxk30l8bc],
    .dxbs-grid-table > tbody > tr > th[b-gmxk30l8bc],
    .dxbs-grid-pager[b-gmxk30l8bc],
    .dxbs-grid-empty-data[b-gmxk30l8bc],
    .dxbs-grid-toolbar[b-gmxk30l8bc],
    .dxbs-grid-statusbar[b-gmxk30l8bc] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-gmxk30l8bc],
    .dxbs-grid-table > tbody[b-gmxk30l8bc],
    .dxbs-grid-table > tbody > tr[b-gmxk30l8bc] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-gmxk30l8bc] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-gmxk30l8bc],
        .dxbs-grid-detail-cell > *[b-gmxk30l8bc] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-gmxk30l8bc] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-gmxk30l8bc],
    .dxbs-grid-header-content[b-gmxk30l8bc],
    .dxbs-grid-filter-row[b-gmxk30l8bc],
    .dxbs-grid-command-column[b-gmxk30l8bc],
    .dxbs-grid-selection-column[b-gmxk30l8bc],
    .dxbs-grid-data-column[b-gmxk30l8bc],
    .dxbs-grid-table thead[b-gmxk30l8bc],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-gmxk30l8bc] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-gmxk30l8bc],
    .dxbs-grid-table > tbody[b-gmxk30l8bc],
    .dxbs-grid-table > tbody > tr[b-gmxk30l8bc] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-gmxk30l8bc] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-gmxk30l8bc] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-gmxk30l8bc] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-gmxk30l8bc] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-gmxk30l8bc] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-gmxk30l8bc] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-gmxk30l8bc] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-gmxk30l8bc] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-gmxk30l8bc]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-gmxk30l8bc] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-gmxk30l8bc] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-gmxk30l8bc] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-gmxk30l8bc] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-gmxk30l8bc] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-gmxk30l8bc] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-gmxk30l8bc] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-gmxk30l8bc] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-gmxk30l8bc] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-gmxk30l8bc] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-gmxk30l8bc] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-gmxk30l8bc] {
    color: #667eea;
}

.separator[b-gmxk30l8bc] {
    color: var(--text-muted);
}

.total-pages[b-gmxk30l8bc] {
    color: var(--text-secondary);
}




.page-size-selector[b-gmxk30l8bc] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-gmxk30l8bc] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-gmxk30l8bc] {
        border-color: #667eea;
    }

.pagination-text[b-gmxk30l8bc] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-gmxk30l8bc] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-gmxk30l8bc] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-gmxk30l8bc] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-gmxk30l8bc] {
        transform: scale(0.98);
    }

.card-header-section[b-gmxk30l8bc] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-gmxk30l8bc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-gmxk30l8bc] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-gmxk30l8bc] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-gmxk30l8bc] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-gmxk30l8bc] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-gmxk30l8bc] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-gmxk30l8bc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-gmxk30l8bc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-gmxk30l8bc] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-gmxk30l8bc] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-gmxk30l8bc] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-gmxk30l8bc] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-gmxk30l8bc] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-gmxk30l8bc] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-gmxk30l8bc] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-gmxk30l8bc] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-gmxk30l8bc] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-gmxk30l8bc] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-gmxk30l8bc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-gmxk30l8bc] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-gmxk30l8bc] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-gmxk30l8bc] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-gmxk30l8bc] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-gmxk30l8bc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-gmxk30l8bc] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

.btn-primary[b-gmxk30l8bc] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-gmxk30l8bc] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-gmxk30l8bc] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-gmxk30l8bc] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-gmxk30l8bc] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-gmxk30l8bc] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-gmxk30l8bc] {
        font-size: 14px;
    }

    .card-quick-info[b-gmxk30l8bc] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-gmxk30l8bc] {
        padding: 10px;
    }

    .stok-card[b-gmxk30l8bc] {
        margin: 6px 10px;
    }

    .quick-value[b-gmxk30l8bc] {
        font-size: 15px;
    }

    .card-header-section[b-gmxk30l8bc] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-gmxk30l8bc],
    .stok-card[b-gmxk30l8bc],
    .mobile-pagination[b-gmxk30l8bc],
    .pagination-details[b-gmxk30l8bc] {
        display: none !important;
    }
}

@keyframes fadeIn-b-gmxk30l8bc {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-gmxk30l8bc] {
    animation: fadeIn-b-gmxk30l8bc 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-gmxk30l8bc]::-webkit-scrollbar {
        width: 6px;
    }

    [b-gmxk30l8bc]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-gmxk30l8bc]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-gmxk30l8bc]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-gmxk30l8bc] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-gmxk30l8bc] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-gmxk30l8bc] {
    background: #0f172a;
}

.pagination-btn[b-gmxk30l8bc] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-gmxk30l8bc] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-gmxk30l8bc] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-gmxk30l8bc] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-gmxk30l8bc] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-gmxk30l8bc] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-gmxk30l8bc] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-gmxk30l8bc] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-gmxk30l8bc] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-gmxk30l8bc] {
        border-color: #667eea;
    }

.pagination-text[b-gmxk30l8bc] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-gmxk30l8bc] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-gmxk30l8bc] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-gmxk30l8bc] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-gmxk30l8bc]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-gmxk30l8bc] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-gmxk30l8bc] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-gmxk30l8bc] {
        transform: scale(0.95);
    }

#faturaContainer[b-gmxk30l8bc] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/SatinAlma/Teklifler/AlinanTekliflerMobil/AlinanTekliflerMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-w6maij1vku] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-w6maij1vku] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-w6maij1vku] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-w6maij1vku] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-w6maij1vku] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-w6maij1vku] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-w6maij1vku]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-w6maij1vku] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-w6maij1vku] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-w6maij1vku] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-w6maij1vku] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-w6maij1vku] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-w6maij1vku] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-w6maij1vku] {
        transform: scale(0.98);
    }

.card-header-section[b-w6maij1vku] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-w6maij1vku] {
    width: 100%;
}

.card-title-row[b-w6maij1vku] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-w6maij1vku] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-w6maij1vku] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-w6maij1vku] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-w6maij1vku] {
        transform: rotate(0deg);
    }

.card-meta-row[b-w6maij1vku] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-w6maij1vku] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-w6maij1vku] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-w6maij1vku] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-w6maij1vku] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-w6maij1vku] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-w6maij1vku] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-w6maij1vku] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-w6maij1vku] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-w6maij1vku] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-w6maij1vku] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-w6maij1vku] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-w6maij1vku] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-w6maij1vku] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-w6maij1vku] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-w6maij1vku] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-w6maij1vku] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-w6maij1vku] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-w6maij1vku] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-w6maij1vku] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-w6maij1vku] {
        transform: scale(0.95);
    }

.btn-primary[b-w6maij1vku] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-w6maij1vku] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-w6maij1vku] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-w6maij1vku] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-w6maij1vku] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-w6maij1vku] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-w6maij1vku] {
        font-size: 14px;
    }

    .card-quick-info[b-w6maij1vku] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-w6maij1vku] {
        padding: 10px;
    }

    .stok-card[b-w6maij1vku] {
        margin: 6px 10px;
    }

    .quick-value[b-w6maij1vku] {
        font-size: 15px;
    }

    .card-header-section[b-w6maij1vku] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-w6maij1vku],
    .stok-card[b-w6maij1vku] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-w6maij1vku {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-w6maij1vku] {
    animation: fadeIn-b-w6maij1vku 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-w6maij1vku]::-webkit-scrollbar {
        width: 6px;
    }

    [b-w6maij1vku]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-w6maij1vku]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-w6maij1vku]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-w6maij1vku],
    .custom-grid[b-w6maij1vku] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-w6maij1vku],
    [data-bs-theme="dark"] .custom-grid[b-w6maij1vku] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-w6maij1vku],
    .dxbs-grid-header-content[b-w6maij1vku],
    .dxbs-grid-header-panel[b-w6maij1vku],
    .dxbs-grid-filter-row[b-w6maij1vku],
    .dxbs-grid-command-column[b-w6maij1vku],
    .dxbs-grid-selection-column[b-w6maij1vku],
    .dxbs-grid-data-column[b-w6maij1vku],
    .dxbs-grid-table thead[b-w6maij1vku],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-w6maij1vku],
    .dxbs-grid-table > tbody > tr > th[b-w6maij1vku],
    .dxbs-grid-pager[b-w6maij1vku],
    .dxbs-grid-empty-data[b-w6maij1vku],
    .dxbs-grid-toolbar[b-w6maij1vku],
    .dxbs-grid-statusbar[b-w6maij1vku] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-w6maij1vku],
    .dxbs-grid-table > tbody[b-w6maij1vku],
    .dxbs-grid-table > tbody > tr[b-w6maij1vku] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-w6maij1vku] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-w6maij1vku],
        .dxbs-grid-detail-cell > *[b-w6maij1vku] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-w6maij1vku] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-w6maij1vku],
    .dxbs-grid-header-content[b-w6maij1vku],
    .dxbs-grid-filter-row[b-w6maij1vku],
    .dxbs-grid-command-column[b-w6maij1vku],
    .dxbs-grid-selection-column[b-w6maij1vku],
    .dxbs-grid-data-column[b-w6maij1vku],
    .dxbs-grid-table thead[b-w6maij1vku],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-w6maij1vku] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-w6maij1vku],
    .dxbs-grid-table > tbody[b-w6maij1vku],
    .dxbs-grid-table > tbody > tr[b-w6maij1vku] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-w6maij1vku] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-w6maij1vku] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-w6maij1vku] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-w6maij1vku] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-w6maij1vku] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-w6maij1vku] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-w6maij1vku] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-w6maij1vku] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-w6maij1vku]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-w6maij1vku] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-w6maij1vku] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-w6maij1vku] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-w6maij1vku] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-w6maij1vku] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-w6maij1vku] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-w6maij1vku] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-w6maij1vku] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-w6maij1vku] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-w6maij1vku] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-w6maij1vku] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-w6maij1vku] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-w6maij1vku] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-w6maij1vku] {
    color: #667eea;
}

.separator[b-w6maij1vku] {
    color: var(--text-muted);
}

.total-pages[b-w6maij1vku] {
    color: var(--text-secondary);
}




.page-size-selector[b-w6maij1vku] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-w6maij1vku] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-w6maij1vku] {
        border-color: #667eea;
    }

.pagination-text[b-w6maij1vku] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-w6maij1vku] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-w6maij1vku] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-w6maij1vku] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-w6maij1vku] {
        transform: scale(0.98);
    }

.card-header-section[b-w6maij1vku] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-w6maij1vku] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-w6maij1vku] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-w6maij1vku] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-w6maij1vku] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-w6maij1vku] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-w6maij1vku] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-w6maij1vku] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-w6maij1vku] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-w6maij1vku] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-w6maij1vku] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-w6maij1vku] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-w6maij1vku] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-w6maij1vku] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-w6maij1vku] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-w6maij1vku] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-w6maij1vku] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-w6maij1vku] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-w6maij1vku] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-w6maij1vku] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-w6maij1vku] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-w6maij1vku] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-w6maij1vku] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-w6maij1vku] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-w6maij1vku] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-w6maij1vku] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-w6maij1vku] {
        transform: scale(0.95);
    }

.btn-primary[b-w6maij1vku] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-w6maij1vku] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-w6maij1vku] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-w6maij1vku] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-w6maij1vku] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-w6maij1vku] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-w6maij1vku] {
        font-size: 14px;
    }

    .card-quick-info[b-w6maij1vku] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-w6maij1vku] {
        padding: 10px;
    }

    .stok-card[b-w6maij1vku] {
        margin: 6px 10px;
    }

    .quick-value[b-w6maij1vku] {
        font-size: 15px;
    }

    .card-header-section[b-w6maij1vku] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-w6maij1vku],
    .stok-card[b-w6maij1vku],
    .mobile-pagination[b-w6maij1vku],
    .pagination-details[b-w6maij1vku] {
        display: none !important;
    }
}

@keyframes fadeIn-b-w6maij1vku {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-w6maij1vku] {
    animation: fadeIn-b-w6maij1vku 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-w6maij1vku]::-webkit-scrollbar {
        width: 6px;
    }

    [b-w6maij1vku]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-w6maij1vku]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-w6maij1vku]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-w6maij1vku] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-w6maij1vku] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-w6maij1vku] {
    background: #0f172a;
}

.pagination-btn[b-w6maij1vku] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-w6maij1vku] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-w6maij1vku] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-w6maij1vku] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-w6maij1vku] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-w6maij1vku] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-w6maij1vku] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-w6maij1vku] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-w6maij1vku] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-w6maij1vku] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-w6maij1vku] {
        border-color: #667eea;
    }

.pagination-text[b-w6maij1vku] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-w6maij1vku] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-w6maij1vku] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-w6maij1vku] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-w6maij1vku]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-w6maij1vku] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-w6maij1vku] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-w6maij1vku] {
        transform: scale(0.95);
    }

#faturaContainer[b-w6maij1vku] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/SatinAlma/İrsaliye/AlisIrsaliyesiMobil/AlisIrsaliyesiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-20qy2zp25p] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-20qy2zp25p] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-20qy2zp25p] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-20qy2zp25p] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-20qy2zp25p] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-20qy2zp25p] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-20qy2zp25p]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-20qy2zp25p] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-20qy2zp25p] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-20qy2zp25p] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-20qy2zp25p] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-20qy2zp25p] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-20qy2zp25p] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-20qy2zp25p] {
        transform: scale(0.98);
    }

.card-header-section[b-20qy2zp25p] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-20qy2zp25p] {
    width: 100%;
}

.card-title-row[b-20qy2zp25p] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-20qy2zp25p] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-20qy2zp25p] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-20qy2zp25p] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-20qy2zp25p] {
        transform: rotate(0deg);
    }

.card-meta-row[b-20qy2zp25p] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-20qy2zp25p] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-20qy2zp25p] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-20qy2zp25p] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-20qy2zp25p] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-20qy2zp25p] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-20qy2zp25p] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-20qy2zp25p] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-20qy2zp25p] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-20qy2zp25p] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-20qy2zp25p] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-20qy2zp25p] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-20qy2zp25p] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-20qy2zp25p] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-20qy2zp25p] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-20qy2zp25p] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-20qy2zp25p] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-20qy2zp25p] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-20qy2zp25p] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-20qy2zp25p] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-20qy2zp25p] {
        transform: scale(0.95);
    }

.btn-primary[b-20qy2zp25p] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-20qy2zp25p] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-20qy2zp25p] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-20qy2zp25p] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-20qy2zp25p] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-20qy2zp25p] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-20qy2zp25p] {
        font-size: 14px;
    }

    .card-quick-info[b-20qy2zp25p] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-20qy2zp25p] {
        padding: 10px;
    }

    .stok-card[b-20qy2zp25p] {
        margin: 6px 10px;
    }

    .quick-value[b-20qy2zp25p] {
        font-size: 15px;
    }

    .card-header-section[b-20qy2zp25p] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-20qy2zp25p],
    .stok-card[b-20qy2zp25p] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-20qy2zp25p {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-20qy2zp25p] {
    animation: fadeIn-b-20qy2zp25p 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-20qy2zp25p]::-webkit-scrollbar {
        width: 6px;
    }

    [b-20qy2zp25p]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-20qy2zp25p]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-20qy2zp25p]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-20qy2zp25p],
    .custom-grid[b-20qy2zp25p] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-20qy2zp25p],
    [data-bs-theme="dark"] .custom-grid[b-20qy2zp25p] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-20qy2zp25p],
    .dxbs-grid-header-content[b-20qy2zp25p],
    .dxbs-grid-header-panel[b-20qy2zp25p],
    .dxbs-grid-filter-row[b-20qy2zp25p],
    .dxbs-grid-command-column[b-20qy2zp25p],
    .dxbs-grid-selection-column[b-20qy2zp25p],
    .dxbs-grid-data-column[b-20qy2zp25p],
    .dxbs-grid-table thead[b-20qy2zp25p],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-20qy2zp25p],
    .dxbs-grid-table > tbody > tr > th[b-20qy2zp25p],
    .dxbs-grid-pager[b-20qy2zp25p],
    .dxbs-grid-empty-data[b-20qy2zp25p],
    .dxbs-grid-toolbar[b-20qy2zp25p],
    .dxbs-grid-statusbar[b-20qy2zp25p] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-20qy2zp25p],
    .dxbs-grid-table > tbody[b-20qy2zp25p],
    .dxbs-grid-table > tbody > tr[b-20qy2zp25p] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-20qy2zp25p] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-20qy2zp25p],
        .dxbs-grid-detail-cell > *[b-20qy2zp25p] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-20qy2zp25p] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-20qy2zp25p],
    .dxbs-grid-header-content[b-20qy2zp25p],
    .dxbs-grid-filter-row[b-20qy2zp25p],
    .dxbs-grid-command-column[b-20qy2zp25p],
    .dxbs-grid-selection-column[b-20qy2zp25p],
    .dxbs-grid-data-column[b-20qy2zp25p],
    .dxbs-grid-table thead[b-20qy2zp25p],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-20qy2zp25p] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-20qy2zp25p],
    .dxbs-grid-table > tbody[b-20qy2zp25p],
    .dxbs-grid-table > tbody > tr[b-20qy2zp25p] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-20qy2zp25p] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-20qy2zp25p] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-20qy2zp25p] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-20qy2zp25p] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-20qy2zp25p] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-20qy2zp25p] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-20qy2zp25p] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-20qy2zp25p] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-20qy2zp25p]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-20qy2zp25p] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-20qy2zp25p] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-20qy2zp25p] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-20qy2zp25p] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-20qy2zp25p] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-20qy2zp25p] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-20qy2zp25p] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-20qy2zp25p] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-20qy2zp25p] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-20qy2zp25p] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-20qy2zp25p] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-20qy2zp25p] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-20qy2zp25p] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-20qy2zp25p] {
    color: #667eea;
}

.separator[b-20qy2zp25p] {
    color: var(--text-muted);
}

.total-pages[b-20qy2zp25p] {
    color: var(--text-secondary);
}




.page-size-selector[b-20qy2zp25p] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-20qy2zp25p] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-20qy2zp25p] {
        border-color: #667eea;
    }

.pagination-text[b-20qy2zp25p] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-20qy2zp25p] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-20qy2zp25p] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-20qy2zp25p] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-20qy2zp25p] {
        transform: scale(0.98);
    }

.card-header-section[b-20qy2zp25p] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-20qy2zp25p] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-20qy2zp25p] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-20qy2zp25p] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-20qy2zp25p] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-20qy2zp25p] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-20qy2zp25p] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-20qy2zp25p] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-20qy2zp25p] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-20qy2zp25p] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-20qy2zp25p] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-20qy2zp25p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-20qy2zp25p] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-20qy2zp25p] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-20qy2zp25p] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-20qy2zp25p] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-20qy2zp25p] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-20qy2zp25p] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-20qy2zp25p] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-20qy2zp25p] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-20qy2zp25p] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-20qy2zp25p] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-20qy2zp25p] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-20qy2zp25p] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-20qy2zp25p] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-20qy2zp25p] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-20qy2zp25p] {
        transform: scale(0.95);
    }

.btn-primary[b-20qy2zp25p] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-20qy2zp25p] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-20qy2zp25p] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-20qy2zp25p] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-20qy2zp25p] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-20qy2zp25p] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-20qy2zp25p] {
        font-size: 14px;
    }

    .card-quick-info[b-20qy2zp25p] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-20qy2zp25p] {
        padding: 10px;
    }

    .stok-card[b-20qy2zp25p] {
        margin: 6px 10px;
    }

    .quick-value[b-20qy2zp25p] {
        font-size: 15px;
    }

    .card-header-section[b-20qy2zp25p] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-20qy2zp25p],
    .stok-card[b-20qy2zp25p],
    .mobile-pagination[b-20qy2zp25p],
    .pagination-details[b-20qy2zp25p] {
        display: none !important;
    }
}

@keyframes fadeIn-b-20qy2zp25p {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-20qy2zp25p] {
    animation: fadeIn-b-20qy2zp25p 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-20qy2zp25p]::-webkit-scrollbar {
        width: 6px;
    }

    [b-20qy2zp25p]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-20qy2zp25p]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-20qy2zp25p]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-20qy2zp25p] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-20qy2zp25p] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-20qy2zp25p] {
    background: #0f172a;
}

.pagination-btn[b-20qy2zp25p] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-20qy2zp25p] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-20qy2zp25p] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-20qy2zp25p] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-20qy2zp25p] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-20qy2zp25p] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-20qy2zp25p] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-20qy2zp25p] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-20qy2zp25p] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-20qy2zp25p] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-20qy2zp25p] {
        border-color: #667eea;
    }

.pagination-text[b-20qy2zp25p] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-20qy2zp25p] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-20qy2zp25p] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-20qy2zp25p] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-20qy2zp25p]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-20qy2zp25p] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-20qy2zp25p] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-20qy2zp25p] {
        transform: scale(0.95);
    }

#faturaContainer[b-20qy2zp25p] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/SatisDagitim/Components/FaturaKapat.razor.rz.scp.css */
.inputs-container > div[b-sekjqj1x81] {
    flex: 1 1 calc(33.333% - 1rem);
    min-width: 250px;
}
/* _content/Client/Pages/SatisDagitim/Fatura/FaturaMobil/SatisFaturasiMobil/SatisFaturasiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-62v36qbk3z] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-62v36qbk3z] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-62v36qbk3z] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-62v36qbk3z] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-62v36qbk3z] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-62v36qbk3z] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-62v36qbk3z]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-62v36qbk3z] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-62v36qbk3z] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-62v36qbk3z] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-62v36qbk3z] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-62v36qbk3z] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-62v36qbk3z] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-62v36qbk3z] {
        transform: scale(0.98);
    }

.card-header-section[b-62v36qbk3z] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-62v36qbk3z] {
    width: 100%;
}

.card-title-row[b-62v36qbk3z] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-62v36qbk3z] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-62v36qbk3z] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-62v36qbk3z] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-62v36qbk3z] {
        transform: rotate(0deg);
    }

.card-meta-row[b-62v36qbk3z] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-62v36qbk3z] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-62v36qbk3z] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-62v36qbk3z] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-62v36qbk3z] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-62v36qbk3z] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-62v36qbk3z] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-62v36qbk3z] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-62v36qbk3z] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-62v36qbk3z] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-62v36qbk3z] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-62v36qbk3z] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-62v36qbk3z] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-62v36qbk3z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-62v36qbk3z] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-62v36qbk3z] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-62v36qbk3z] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-62v36qbk3z] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-62v36qbk3z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-62v36qbk3z] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-62v36qbk3z] {
        transform: scale(0.95);
    }

.btn-primary[b-62v36qbk3z] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-62v36qbk3z] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-62v36qbk3z] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-62v36qbk3z] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-62v36qbk3z] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-62v36qbk3z] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-62v36qbk3z] {
        font-size: 14px;
    }

    .card-quick-info[b-62v36qbk3z] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-62v36qbk3z] {
        padding: 10px;
    }

    .stok-card[b-62v36qbk3z] {
        margin: 6px 10px;
    }

    .quick-value[b-62v36qbk3z] {
        font-size: 15px;
    }

    .card-header-section[b-62v36qbk3z] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-62v36qbk3z],
    .stok-card[b-62v36qbk3z] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-62v36qbk3z {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-62v36qbk3z] {
    animation: fadeIn-b-62v36qbk3z 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-62v36qbk3z]::-webkit-scrollbar {
        width: 6px;
    }

    [b-62v36qbk3z]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-62v36qbk3z]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-62v36qbk3z]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-62v36qbk3z],
    .custom-grid[b-62v36qbk3z] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-62v36qbk3z],
    [data-bs-theme="dark"] .custom-grid[b-62v36qbk3z] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-62v36qbk3z],
    .dxbs-grid-header-content[b-62v36qbk3z],
    .dxbs-grid-header-panel[b-62v36qbk3z],
    .dxbs-grid-filter-row[b-62v36qbk3z],
    .dxbs-grid-command-column[b-62v36qbk3z],
    .dxbs-grid-selection-column[b-62v36qbk3z],
    .dxbs-grid-data-column[b-62v36qbk3z],
    .dxbs-grid-table thead[b-62v36qbk3z],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-62v36qbk3z],
    .dxbs-grid-table > tbody > tr > th[b-62v36qbk3z],
    .dxbs-grid-pager[b-62v36qbk3z],
    .dxbs-grid-empty-data[b-62v36qbk3z],
    .dxbs-grid-toolbar[b-62v36qbk3z],
    .dxbs-grid-statusbar[b-62v36qbk3z] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-62v36qbk3z],
    .dxbs-grid-table > tbody[b-62v36qbk3z],
    .dxbs-grid-table > tbody > tr[b-62v36qbk3z] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-62v36qbk3z] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-62v36qbk3z],
        .dxbs-grid-detail-cell > *[b-62v36qbk3z] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-62v36qbk3z] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-62v36qbk3z],
    .dxbs-grid-header-content[b-62v36qbk3z],
    .dxbs-grid-filter-row[b-62v36qbk3z],
    .dxbs-grid-command-column[b-62v36qbk3z],
    .dxbs-grid-selection-column[b-62v36qbk3z],
    .dxbs-grid-data-column[b-62v36qbk3z],
    .dxbs-grid-table thead[b-62v36qbk3z],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-62v36qbk3z] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-62v36qbk3z],
    .dxbs-grid-table > tbody[b-62v36qbk3z],
    .dxbs-grid-table > tbody > tr[b-62v36qbk3z] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-62v36qbk3z] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-62v36qbk3z] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-62v36qbk3z] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-62v36qbk3z] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-62v36qbk3z] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-62v36qbk3z] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-62v36qbk3z] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-62v36qbk3z] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-62v36qbk3z]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-62v36qbk3z] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-62v36qbk3z] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-62v36qbk3z] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-62v36qbk3z] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}
.fatura-list-container[b-62v36qbk3z] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-62v36qbk3z] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-62v36qbk3z] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-62v36qbk3z] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-62v36qbk3z] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-62v36qbk3z] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-62v36qbk3z] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-62v36qbk3z] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-62v36qbk3z] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-62v36qbk3z] {
    color: #667eea;
}

.separator[b-62v36qbk3z] {
    color: var(--text-muted);
}

.total-pages[b-62v36qbk3z] {
    color: var(--text-secondary);
}




.page-size-selector[b-62v36qbk3z] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-62v36qbk3z] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-62v36qbk3z] {
        border-color: #667eea;
    }

.pagination-text[b-62v36qbk3z] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-62v36qbk3z] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index:1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-62v36qbk3z] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-62v36qbk3z] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-62v36qbk3z] {
        transform: scale(0.98);
    }

.card-header-section[b-62v36qbk3z] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-62v36qbk3z] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-62v36qbk3z] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}
.card-subtitle[b-62v36qbk3z] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-62v36qbk3z] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-62v36qbk3z] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-62v36qbk3z] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-62v36qbk3z] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-62v36qbk3z] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-62v36qbk3z] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-62v36qbk3z] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-62v36qbk3z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-62v36qbk3z] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-62v36qbk3z] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-62v36qbk3z] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-62v36qbk3z] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-62v36qbk3z] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-62v36qbk3z] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-62v36qbk3z] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom:10px;
}

.info-row[b-62v36qbk3z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-62v36qbk3z] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-62v36qbk3z] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-62v36qbk3z] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-62v36qbk3z] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-62v36qbk3z] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-62v36qbk3z] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-62v36qbk3z] {
        transform: scale(0.95);
    }

.btn-primary[b-62v36qbk3z] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-62v36qbk3z] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-62v36qbk3z] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-62v36qbk3z] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-62v36qbk3z] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-62v36qbk3z] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-62v36qbk3z] {
        font-size: 14px;
    }

    .card-quick-info[b-62v36qbk3z] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-62v36qbk3z] {
        padding: 10px;
    }

    .stok-card[b-62v36qbk3z] {
        margin: 6px 10px;
    }

    .quick-value[b-62v36qbk3z] {
        font-size: 15px;
    }

    .card-header-section[b-62v36qbk3z] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-62v36qbk3z],
    .stok-card[b-62v36qbk3z],
    .mobile-pagination[b-62v36qbk3z],
    .pagination-details[b-62v36qbk3z] {
        display: none !important;
    }
}

@keyframes fadeIn-b-62v36qbk3z {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-62v36qbk3z] {
    animation: fadeIn-b-62v36qbk3z 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-62v36qbk3z]::-webkit-scrollbar {
        width: 6px;
    }

    [b-62v36qbk3z]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-62v36qbk3z]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-62v36qbk3z]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}
.mobile-footer-fixed[b-62v36qbk3z] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-62v36qbk3z] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-62v36qbk3z] {
    background: #0f172a;
}

.pagination-btn[b-62v36qbk3z] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-62v36qbk3z] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-62v36qbk3z] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-62v36qbk3z] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-62v36qbk3z] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-62v36qbk3z] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-62v36qbk3z] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-62v36qbk3z] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-62v36qbk3z] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-62v36qbk3z] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-62v36qbk3z] {
        border-color: #667eea;
    }

.pagination-text[b-62v36qbk3z] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-62v36qbk3z] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-62v36qbk3z] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-62v36qbk3z] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-62v36qbk3z]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-62v36qbk3z] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-62v36qbk3z] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-62v36qbk3z] {
        transform: scale(0.95);
    }
/* _content/Client/Pages/SatisDagitim/Fatura/Raporlar/FaturaGrafikSatisRaporu.razor.rz.scp.css */
/* Filter Section Specific Styles */
.filter-section[b-b83es9rxat] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 1px solid #dee2e6;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 5px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: visible;
}

    .filter-section[b-b83es9rxat]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, #007bff, #6610f2, #e83e8c);
        border-radius: 12px 12px 0 0;
    }

    /* Filter Grid Layout */
    .filter-section .filter-grid[b-b83es9rxat] {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 16px;
        align-items: start;
        position: relative;
    }

    /* Individual Filter Item */
    .filter-section .filter-item[b-b83es9rxat] {
        position: relative;
        background: #ffffff;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        padding: 16px;
        transition: all 0.3s ease;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
        overflow: visible;
        z-index: 1;
    }

        .filter-section .filter-item:hover[b-b83es9rxat] {
            border-color: #007bff;
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0, 123, 255, 0.15);
        }

         Active/Open state for filter items 
        .filter-section .filter-item.active[b-b83es9rxat],
        .filter-section .filter-item.dropdown-open[b-b83es9rxat],
        .filter-section .filter-item:has(.dx-state-focused)[b-b83es9rxat],
        .filter-section .filter-item:has(.show)[b-b83es9rxat],
        .filter-section .filter-item:has(.open)[b-b83es9rxat] {
            z-index: 1000;
            position: relative;
            border-color: #007bff;
            box-shadow: 0 4px 12px rgba(0, 123, 255, 0.25);
        }

        .filter-section .filter-item[b-b83es9rxat]::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 2px;
            background: linear-gradient(90deg, transparent, #007bff, transparent);
        }

        .filter-section .filter-item:hover[b-b83es9rxat]::before {
            transform: translateX(100%);
        }

    /* Filter Labels */
    .filter-section .filter-label[b-b83es9rxat] {
        font-weight: 600;
        color: #495057;
        font-size: 0.875rem;
        margin-bottom: 8px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        position: relative;
        padding-left: 12px;
    }

        .filter-section .filter-label[b-b83es9rxat]::before {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 4px;
            height: 16px;
            background: #007bff;
            border-radius: 2px;
        }

    /* Filter Header Text */
    .filter-section .filter-header-text[b-b83es9rxat] {
        background: #f8f9fa;
        border: 1px solid #e9ecef;
        border-radius: 4px;
        padding: 8px 12px;
        font-size: 0.875rem;
        color: #495057;
        min-height: 38px;
        display: flex;
        align-items: center;
        margin-bottom: 8px;
        font-weight: 500;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        user-select: none;
        cursor: pointer;
        transition: all 0.3s ease;
    }

        .filter-section .filter-header-text:hover[b-b83es9rxat] {
            background: #e9ecef;
            border-color: #007bff;
        }

        .filter-section .filter-header-text.active[b-b83es9rxat] {
            background: #007bff;
            color: white;
            border-color: #007bff;
        }

    /* Form Control Overrides for Filter Section */
    .filter-section .form-control[b-b83es9rxat] {
        border: 1px solid #ced4da !important;
        border-radius: 6px !important;
        padding: 12px 16px !important;
        font-size: 0.925rem !important;
        transition: all 0.3s ease !important;
        background: #ffffff !important;
        width: 100% !important;
    }

        .filter-section .form-control:focus[b-b83es9rxat] {
            border-color: #007bff !important;
            box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
            background: #ffffff !important;
        }

    /* Date Input Specific Styling */
    .filter-section input[type="date"].form-control[b-b83es9rxat] {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23007bff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 1v3m6-3v3M1 7h14M3 5h10a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2z'/%3e%3c/svg%3e") !important;
        background-repeat: no-repeat !important;
        background-position: right 12px center !important;
        background-size: 16px !important;
        padding-right: 40px !important;
    }

    /* Dropdown Box Styling */
    .filter-section .dropdown-box-container[b-b83es9rxat] {
        position: relative;
        width: 100%;
    }

        .filter-section .dropdown-box-container .form-control[b-b83es9rxat] {
            position: relative;
            background: #ffffff !important;
            cursor: pointer !important;
        }

        /* BYM Dropdown Box Specific Overrides */
        .filter-section .dropdown-box-container [class*="bym-dropdown"][b-b83es9rxat],
        .filter-section .dropdown-box-container [class*="BymDropdownBox"][b-b83es9rxat] {
            width: 100% !important;
            position: relative;
        }

            .filter-section .dropdown-box-container [class*="bym-dropdown"] .form-control[b-b83es9rxat],
            .filter-section .dropdown-box-container [class*="BymDropdownBox"] .form-control[b-b83es9rxat] {
                width: 100% !important;
                min-width: 100% !important;
            }

        /* Dropdown menu positioning and styling */
        .filter-section .dropdown-box-container .dropdown-menu[b-b83es9rxat],
        .filter-section .dropdown-box-container [class*="listbox"][b-b83es9rxat],
        .filter-section .dropdown-box-container [class*="dropdown-list"][b-b83es9rxat] {
            position: absolute !important;
            top: 100% !important;
            left: 0 !important;
            right: 0 !important;
            z-index: 1050 !important;
            margin-top: 2px !important;
            background: white !important;
            border: 1px solid #ced4da !important;
            border-radius: 6px !important;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
            max-height: 300px !important;
            overflow-y: auto !important;
            opacity: 0;
            transform: translateY(-10px);
            transition: all 0.3s ease;
            pointer-events: none;
        }

            /* Show dropdown animation */
            .filter-section .dropdown-box-container .dropdown-menu.show[b-b83es9rxat],
            .filter-section .dropdown-box-container [class*="listbox"].show[b-b83es9rxat],
            .filter-section .dropdown-box-container [class*="dropdown-list"].show[b-b83es9rxat],
            .filter-section .dropdown-box-container .dropdown-menu.open[b-b83es9rxat],
            .filter-section .dropdown-box-container [class*="listbox"].open[b-b83es9rxat],
            .filter-section .dropdown-box-container [class*="dropdown-list"].open[b-b83es9rxat] {
                opacity: 1;
                transform: translateY(0);
                pointer-events: auto;
            }

    /* DevExpress Component Overrides for Filter Section */
    .filter-section .dx-textbox[b-b83es9rxat],
    .filter-section .dx-dropdownlist[b-b83es9rxat],
    .filter-section .dx-selectbox[b-b83es9rxat] {
        border-radius: 6px !important;
        width: 100% !important;
        position: relative;
    }

        .filter-section .dx-textbox-container[b-b83es9rxat],
        .filter-section .dx-dropdownlist .dx-textbox-container[b-b83es9rxat],
        .filter-section .dx-selectbox .dx-textbox-container[b-b83es9rxat] {
            border: 1px solid #ced4da !important;
            border-radius: 6px !important;
            transition: all 0.3s ease !important;
            background: #ffffff !important;
        }

            .filter-section .dx-textbox-container:hover[b-b83es9rxat],
            .filter-section .dx-dropdownlist:hover .dx-textbox-container[b-b83es9rxat],
            .filter-section .dx-selectbox:hover .dx-textbox-container[b-b83es9rxat] {
                border-color: #007bff !important;
            }

    .filter-section .dx-state-focused .dx-textbox-container[b-b83es9rxat] {
        border-color: #007bff !important;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
    }

    /* DevExpress Dropdown Positioning */
    .filter-section .dx-overlay-wrapper[b-b83es9rxat] {
        z-index: 1050 !important;
    }

    .filter-section .dx-popup-wrapper[b-b83es9rxat] {
        z-index: 1050 !important;
    }

    /* Custom Filter Component Positioning */
    .filter-section .custom-filter-dropdown[b-b83es9rxat] {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 1050 !important;
        margin-top: 2px !important;
        background: white !important;
        border: 1px solid #ced4da !important;
        border-radius: 6px !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
        max-height: 300px !important;
        overflow-y: auto !important;
        opacity: 0;
        transform: translateY(-10px);
        transition: all 0.3s ease;
        pointer-events: none;
    }

        .filter-section .custom-filter-dropdown.show[b-b83es9rxat],
        .filter-section .custom-filter-dropdown.open[b-b83es9rxat] {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }

    /* Input Group Overrides */
    .filter-section .w-100[b-b83es9rxat] {
        width: 100% !important;
    }

    /* Filter Actions */
    .filter-section .filter-actions[b-b83es9rxat] {
        display: flex;
        gap: 12px;
        justify-content: flex-end;
        margin-top: 20px;
        padding-top: 16px;
        border-top: 1px solid #e9ecef;
        flex-wrap: wrap;
    }

    .filter-section .filter-btn[b-b83es9rxat] {
        padding: 8px 20px;
        border-radius: 6px;
        font-weight: 500;
        font-size: 0.875rem;
        transition: all 0.3s ease;
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .filter-section .filter-btn-primary[b-b83es9rxat] {
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
    }

        .filter-section .filter-btn-primary:hover[b-b83es9rxat] {
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3);
        }

    .filter-section .filter-btn-secondary[b-b83es9rxat] {
        background: #6c757d;
        color: white;
    }

        .filter-section .filter-btn-secondary:hover[b-b83es9rxat] {
            background: #545b62;
            transform: translateY(-1px);
        }

    .filter-section .filter-btn-success[b-b83es9rxat] {
        background: #28a745;
        color: white;
    }

        .filter-section .filter-btn-success:hover[b-b83es9rxat] {
            background: #218838;
            transform: translateY(-1px);
        }

    /* Animation */
    .filter-section.filter-animate-in[b-b83es9rxat] {
        animation: filterSlideIn-b-b83es9rxat 0.5s ease-out;
    }

@keyframes filterSlideIn-b-b83es9rxat {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive Design */
@media (max-width: 1200px) {
    .filter-section .filter-grid[b-b83es9rxat] {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 14px;
    }
}

@media (max-width: 992px) {
    .filter-section .filter-grid[b-b83es9rxat] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 12px;
    }

    .filter-section[b-b83es9rxat] {
        padding: 20px;
    }

        .filter-section .filter-item[b-b83es9rxat] {
            padding: 14px;
        }
}

@media (max-width: 768px) {
    .filter-section[b-b83es9rxat] {
        padding: 16px;
        margin-bottom: 16px;
    }

        .filter-section .filter-grid[b-b83es9rxat] {
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
            gap: 10px;
        }

        .filter-section .filter-item[b-b83es9rxat] {
            padding: 12px;
        }

        .filter-section .filter-actions[b-b83es9rxat] {
            justify-content: center;
            margin-top: 16px;
        }
}

@media (max-width: 576px) {
    .filter-section .filter-grid[b-b83es9rxat] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .filter-section .filter-label[b-b83es9rxat] {
        font-size: 0.8rem;
    }

    .filter-section .form-control[b-b83es9rxat] {
        font-size: 0.875rem !important;
        padding: 10px 12px !important;
    }

    .filter-section .filter-actions[b-b83es9rxat] {
        flex-direction: column;
        align-items: stretch;
    }

    .filter-section .filter-btn[b-b83es9rxat] {
        justify-content: center;
    }
}

@media (max-width: 400px) {
    .filter-section[b-b83es9rxat] {
        padding: 12px;
    }

        .filter-section .filter-item[b-b83es9rxat] {
            padding: 10px;
        }

        .filter-section .filter-header-text[b-b83es9rxat] {
            font-size: 0.8rem;
            padding: 6px 10px;
        }
}

/* Loading State */
.filter-section.loading[b-b83es9rxat] {
    position: relative;
    pointer-events: none;
}

    .filter-section.loading[b-b83es9rxat]::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.8);
        z-index: 10;
    }

/* Success/Error States */
.filter-section .filter-success[b-b83es9rxat] {
    border-color: #28a745 !important;
}

    .filter-section .filter-success:focus[b-b83es9rxat] {
        box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25) !important;
    }

.filter-section .filter-error[b-b83es9rxat] {
    border-color: #dc3545 !important;
}

    .filter-section .filter-error:focus[b-b83es9rxat] {
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
    }
/* _content/Client/Pages/SatisDagitim/Siparis/AlinanSiparisMobil/AlinanSiparisMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-ib1b52yzwm] {
    position: sticky;
    top: 0;
    z-index: 105;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-ib1b52yzwm] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-ib1b52yzwm] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-ib1b52yzwm] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-ib1b52yzwm] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-ib1b52yzwm] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-ib1b52yzwm]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-ib1b52yzwm] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-ib1b52yzwm] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-ib1b52yzwm] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-ib1b52yzwm] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-ib1b52yzwm] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-ib1b52yzwm] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-ib1b52yzwm] {
        transform: scale(0.98);
    }

.card-header-section[b-ib1b52yzwm] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-ib1b52yzwm] {
    width: 100%;
}

.card-title-row[b-ib1b52yzwm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-ib1b52yzwm] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-ib1b52yzwm] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-ib1b52yzwm] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-ib1b52yzwm] {
        transform: rotate(0deg);
    }

.card-meta-row[b-ib1b52yzwm] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-ib1b52yzwm] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-ib1b52yzwm] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-ib1b52yzwm] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-ib1b52yzwm] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-ib1b52yzwm] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-ib1b52yzwm] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-ib1b52yzwm] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-ib1b52yzwm] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-ib1b52yzwm] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-ib1b52yzwm] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-ib1b52yzwm] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-ib1b52yzwm] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-ib1b52yzwm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-ib1b52yzwm] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-ib1b52yzwm] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-ib1b52yzwm] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-ib1b52yzwm] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-ib1b52yzwm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-ib1b52yzwm] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-ib1b52yzwm] {
        transform: scale(0.95);
    }

.btn-primary[b-ib1b52yzwm] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-ib1b52yzwm] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-ib1b52yzwm] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-ib1b52yzwm] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-ib1b52yzwm] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-ib1b52yzwm] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-ib1b52yzwm] {
        font-size: 14px;
    }

    .card-quick-info[b-ib1b52yzwm] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-ib1b52yzwm] {
        padding: 10px;
    }

    .stok-card[b-ib1b52yzwm] {
        margin: 6px 10px;
    }

    .quick-value[b-ib1b52yzwm] {
        font-size: 15px;
    }

    .card-header-section[b-ib1b52yzwm] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-ib1b52yzwm],
    .stok-card[b-ib1b52yzwm] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-ib1b52yzwm {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-ib1b52yzwm] {
    animation: fadeIn-b-ib1b52yzwm 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-ib1b52yzwm]::-webkit-scrollbar {
        width: 6px;
    }

    [b-ib1b52yzwm]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-ib1b52yzwm]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-ib1b52yzwm]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-ib1b52yzwm],
    .custom-grid[b-ib1b52yzwm] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-ib1b52yzwm],
    [data-bs-theme="dark"] .custom-grid[b-ib1b52yzwm] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-ib1b52yzwm],
    .dxbs-grid-header-content[b-ib1b52yzwm],
    .dxbs-grid-header-panel[b-ib1b52yzwm],
    .dxbs-grid-filter-row[b-ib1b52yzwm],
    .dxbs-grid-command-column[b-ib1b52yzwm],
    .dxbs-grid-selection-column[b-ib1b52yzwm],
    .dxbs-grid-data-column[b-ib1b52yzwm],
    .dxbs-grid-table thead[b-ib1b52yzwm],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-ib1b52yzwm],
    .dxbs-grid-table > tbody > tr > th[b-ib1b52yzwm],
    .dxbs-grid-pager[b-ib1b52yzwm],
    .dxbs-grid-empty-data[b-ib1b52yzwm],
    .dxbs-grid-toolbar[b-ib1b52yzwm],
    .dxbs-grid-statusbar[b-ib1b52yzwm] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-ib1b52yzwm],
    .dxbs-grid-table > tbody[b-ib1b52yzwm],
    .dxbs-grid-table > tbody > tr[b-ib1b52yzwm] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-ib1b52yzwm] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-ib1b52yzwm],
        .dxbs-grid-detail-cell > *[b-ib1b52yzwm] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-ib1b52yzwm] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-ib1b52yzwm],
    .dxbs-grid-header-content[b-ib1b52yzwm],
    .dxbs-grid-filter-row[b-ib1b52yzwm],
    .dxbs-grid-command-column[b-ib1b52yzwm],
    .dxbs-grid-selection-column[b-ib1b52yzwm],
    .dxbs-grid-data-column[b-ib1b52yzwm],
    .dxbs-grid-table thead[b-ib1b52yzwm],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-ib1b52yzwm] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-ib1b52yzwm],
    .dxbs-grid-table > tbody[b-ib1b52yzwm],
    .dxbs-grid-table > tbody > tr[b-ib1b52yzwm] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-ib1b52yzwm] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-ib1b52yzwm] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-ib1b52yzwm] {
    position: sticky;
    z-index: 105;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-ib1b52yzwm] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-ib1b52yzwm] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-ib1b52yzwm] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-ib1b52yzwm] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-ib1b52yzwm] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-ib1b52yzwm]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-ib1b52yzwm] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-ib1b52yzwm] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-ib1b52yzwm] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-ib1b52yzwm] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-ib1b52yzwm] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-ib1b52yzwm] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-ib1b52yzwm] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-ib1b52yzwm] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-ib1b52yzwm] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-ib1b52yzwm] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-ib1b52yzwm] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-ib1b52yzwm] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-ib1b52yzwm] {
    color: #667eea;
}

.separator[b-ib1b52yzwm] {
    color: var(--text-muted);
}

.total-pages[b-ib1b52yzwm] {
    color: var(--text-secondary);
}




.page-size-selector[b-ib1b52yzwm] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-ib1b52yzwm] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-ib1b52yzwm] {
        border-color: #667eea;
    }

.pagination-text[b-ib1b52yzwm] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-ib1b52yzwm] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-ib1b52yzwm] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-ib1b52yzwm] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-ib1b52yzwm] {
        transform: scale(0.98);
    }

.card-header-section[b-ib1b52yzwm] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-ib1b52yzwm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-ib1b52yzwm] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-ib1b52yzwm] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-ib1b52yzwm] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-ib1b52yzwm] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-ib1b52yzwm] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-ib1b52yzwm] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-ib1b52yzwm] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-ib1b52yzwm] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-ib1b52yzwm] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-ib1b52yzwm] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-ib1b52yzwm] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-ib1b52yzwm] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-ib1b52yzwm] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-ib1b52yzwm] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-ib1b52yzwm] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-ib1b52yzwm] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-ib1b52yzwm] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-ib1b52yzwm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-ib1b52yzwm] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-ib1b52yzwm] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-ib1b52yzwm] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-ib1b52yzwm] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-ib1b52yzwm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-ib1b52yzwm] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-ib1b52yzwm] {
        transform: scale(0.95);
    }

.btn-primary[b-ib1b52yzwm] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-ib1b52yzwm] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-ib1b52yzwm] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-ib1b52yzwm] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-ib1b52yzwm] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-ib1b52yzwm] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-ib1b52yzwm] {
        font-size: 14px;
    }

    .card-quick-info[b-ib1b52yzwm] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-ib1b52yzwm] {
        padding: 10px;
    }

    .stok-card[b-ib1b52yzwm] {
        margin: 6px 10px;
    }

    .quick-value[b-ib1b52yzwm] {
        font-size: 15px;
    }

    .card-header-section[b-ib1b52yzwm] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-ib1b52yzwm],
    .stok-card[b-ib1b52yzwm],
    .mobile-pagination[b-ib1b52yzwm],
    .pagination-details[b-ib1b52yzwm] {
        display: none !important;
    }
}

@keyframes fadeIn-b-ib1b52yzwm {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-ib1b52yzwm] {
    animation: fadeIn-b-ib1b52yzwm 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-ib1b52yzwm]::-webkit-scrollbar {
        width: 6px;
    }

    [b-ib1b52yzwm]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-ib1b52yzwm]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-ib1b52yzwm]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-ib1b52yzwm] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-ib1b52yzwm] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-ib1b52yzwm] {
    background: #0f172a;
}

.pagination-btn[b-ib1b52yzwm] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-ib1b52yzwm] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-ib1b52yzwm] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-ib1b52yzwm] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-ib1b52yzwm] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-ib1b52yzwm] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-ib1b52yzwm] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-ib1b52yzwm] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-ib1b52yzwm] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-ib1b52yzwm] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-ib1b52yzwm] {
        border-color: #667eea;
    }

.pagination-text[b-ib1b52yzwm] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-ib1b52yzwm] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-ib1b52yzwm] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-ib1b52yzwm] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-ib1b52yzwm]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-ib1b52yzwm] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-ib1b52yzwm] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-ib1b52yzwm] {
        transform: scale(0.95);
    }
/* _content/Client/Pages/SatisDagitim/Teklifler/VerilenTekliflerMobil/VerilenTekliflerMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-lbbfgjhf9g] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-lbbfgjhf9g] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-lbbfgjhf9g] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-lbbfgjhf9g] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-lbbfgjhf9g] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-lbbfgjhf9g] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-lbbfgjhf9g]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-lbbfgjhf9g] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-lbbfgjhf9g] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-lbbfgjhf9g] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-lbbfgjhf9g] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-lbbfgjhf9g] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-lbbfgjhf9g] {
        transform: scale(0.98);
    }

.card-header-section[b-lbbfgjhf9g] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-lbbfgjhf9g] {
    width: 100%;
}

.card-title-row[b-lbbfgjhf9g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-lbbfgjhf9g] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-lbbfgjhf9g] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-lbbfgjhf9g] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-lbbfgjhf9g] {
        transform: rotate(0deg);
    }

.card-meta-row[b-lbbfgjhf9g] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-lbbfgjhf9g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-lbbfgjhf9g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-lbbfgjhf9g] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-lbbfgjhf9g] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-lbbfgjhf9g] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-lbbfgjhf9g] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-lbbfgjhf9g] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-lbbfgjhf9g] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-lbbfgjhf9g] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-lbbfgjhf9g] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-lbbfgjhf9g] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-lbbfgjhf9g] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-lbbfgjhf9g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-lbbfgjhf9g] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-row[b-lbbfgjhf9g] {
    display: flex;
    flex-wrap: wrap; /* Uzun değer varsa yeni satıra geçsin */
    align-items: flex-start;
    margin-bottom: 6px;
    gap: 6px;
}

.info-label[b-lbbfgjhf9g] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 35%; /* Satırın %35'ini kapla */
    max-width: 35%;
}

    .info-label i[b-lbbfgjhf9g] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-lbbfgjhf9g] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex: 0 0 65%; /* Satırın %65'ini kapla */
    max-width: 65%;
    white-space: pre-wrap; /* Satır sonlarında kır */
    word-wrap: break-word; /* Uzun kelimelerde kır */
    overflow-wrap: break-word;
}


.card-actions[b-lbbfgjhf9g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-lbbfgjhf9g] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }

.btn-primary[b-lbbfgjhf9g] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-lbbfgjhf9g] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-lbbfgjhf9g] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-lbbfgjhf9g] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-lbbfgjhf9g] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-lbbfgjhf9g] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-lbbfgjhf9g] {
        font-size: 14px;
    }

    .card-quick-info[b-lbbfgjhf9g] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-lbbfgjhf9g] {
        padding: 10px;
    }

    .stok-card[b-lbbfgjhf9g] {
        margin: 6px 10px;
    }

    .quick-value[b-lbbfgjhf9g] {
        font-size: 15px;
    }

    .card-header-section[b-lbbfgjhf9g] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-lbbfgjhf9g],
    .stok-card[b-lbbfgjhf9g] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-lbbfgjhf9g {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-lbbfgjhf9g] {
    animation: fadeIn-b-lbbfgjhf9g 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-lbbfgjhf9g]::-webkit-scrollbar {
        width: 6px;
    }

    [b-lbbfgjhf9g]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-lbbfgjhf9g]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-lbbfgjhf9g]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-lbbfgjhf9g],
    .custom-grid[b-lbbfgjhf9g] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-lbbfgjhf9g],
    [data-bs-theme="dark"] .custom-grid[b-lbbfgjhf9g] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-lbbfgjhf9g],
    .dxbs-grid-header-content[b-lbbfgjhf9g],
    .dxbs-grid-header-panel[b-lbbfgjhf9g],
    .dxbs-grid-filter-row[b-lbbfgjhf9g],
    .dxbs-grid-command-column[b-lbbfgjhf9g],
    .dxbs-grid-selection-column[b-lbbfgjhf9g],
    .dxbs-grid-data-column[b-lbbfgjhf9g],
    .dxbs-grid-table thead[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody > tr > th[b-lbbfgjhf9g],
    .dxbs-grid-pager[b-lbbfgjhf9g],
    .dxbs-grid-empty-data[b-lbbfgjhf9g],
    .dxbs-grid-toolbar[b-lbbfgjhf9g],
    .dxbs-grid-statusbar[b-lbbfgjhf9g] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody > tr[b-lbbfgjhf9g] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-lbbfgjhf9g] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-lbbfgjhf9g],
        .dxbs-grid-detail-cell > *[b-lbbfgjhf9g] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-lbbfgjhf9g] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-lbbfgjhf9g],
    .dxbs-grid-header-content[b-lbbfgjhf9g],
    .dxbs-grid-filter-row[b-lbbfgjhf9g],
    .dxbs-grid-command-column[b-lbbfgjhf9g],
    .dxbs-grid-selection-column[b-lbbfgjhf9g],
    .dxbs-grid-data-column[b-lbbfgjhf9g],
    .dxbs-grid-table thead[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-lbbfgjhf9g] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody[b-lbbfgjhf9g],
    .dxbs-grid-table > tbody > tr[b-lbbfgjhf9g] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-lbbfgjhf9g] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-lbbfgjhf9g] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-lbbfgjhf9g] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-lbbfgjhf9g] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-lbbfgjhf9g] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-lbbfgjhf9g] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-lbbfgjhf9g] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-lbbfgjhf9g] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-lbbfgjhf9g]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-lbbfgjhf9g] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-lbbfgjhf9g] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-lbbfgjhf9g] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-lbbfgjhf9g] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-lbbfgjhf9g] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-lbbfgjhf9g] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-lbbfgjhf9g] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-lbbfgjhf9g] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-lbbfgjhf9g] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-lbbfgjhf9g] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-lbbfgjhf9g] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-lbbfgjhf9g] {
    color: #667eea;
}

.separator[b-lbbfgjhf9g] {
    color: var(--text-muted);
}

.total-pages[b-lbbfgjhf9g] {
    color: var(--text-secondary);
}




.page-size-selector[b-lbbfgjhf9g] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-lbbfgjhf9g] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-lbbfgjhf9g] {
        border-color: #667eea;
    }

.pagination-text[b-lbbfgjhf9g] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-lbbfgjhf9g] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-lbbfgjhf9g] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-lbbfgjhf9g] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-lbbfgjhf9g] {
        transform: scale(0.98);
    }

.card-header-section[b-lbbfgjhf9g] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-lbbfgjhf9g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-lbbfgjhf9g] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-lbbfgjhf9g] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-lbbfgjhf9g] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-lbbfgjhf9g] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-lbbfgjhf9g] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-lbbfgjhf9g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-lbbfgjhf9g] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-lbbfgjhf9g] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-lbbfgjhf9g] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-lbbfgjhf9g] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-lbbfgjhf9g] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-lbbfgjhf9g] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-lbbfgjhf9g] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-lbbfgjhf9g] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-lbbfgjhf9g] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-lbbfgjhf9g] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-lbbfgjhf9g] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-lbbfgjhf9g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-lbbfgjhf9g] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-lbbfgjhf9g] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-lbbfgjhf9g] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-lbbfgjhf9g] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-lbbfgjhf9g] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-lbbfgjhf9g] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }

.btn-primary[b-lbbfgjhf9g] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-lbbfgjhf9g] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-lbbfgjhf9g] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-lbbfgjhf9g] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-lbbfgjhf9g] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-lbbfgjhf9g] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-lbbfgjhf9g] {
        font-size: 14px;
    }

    .card-quick-info[b-lbbfgjhf9g] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-lbbfgjhf9g] {
        padding: 10px;
    }

    .stok-card[b-lbbfgjhf9g] {
        margin: 6px 10px;
    }

    .quick-value[b-lbbfgjhf9g] {
        font-size: 15px;
    }

    .card-header-section[b-lbbfgjhf9g] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-lbbfgjhf9g],
    .stok-card[b-lbbfgjhf9g],
    .mobile-pagination[b-lbbfgjhf9g],
    .pagination-details[b-lbbfgjhf9g] {
        display: none !important;
    }
}

@keyframes fadeIn-b-lbbfgjhf9g {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-lbbfgjhf9g] {
    animation: fadeIn-b-lbbfgjhf9g 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-lbbfgjhf9g]::-webkit-scrollbar {
        width: 6px;
    }

    [b-lbbfgjhf9g]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-lbbfgjhf9g]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-lbbfgjhf9g]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-lbbfgjhf9g] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-lbbfgjhf9g] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-lbbfgjhf9g] {
    background: #0f172a;
}

.pagination-btn[b-lbbfgjhf9g] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-lbbfgjhf9g] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-lbbfgjhf9g] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-lbbfgjhf9g] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-lbbfgjhf9g] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-lbbfgjhf9g] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-lbbfgjhf9g] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-lbbfgjhf9g] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-lbbfgjhf9g] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-lbbfgjhf9g] {
        border-color: #667eea;
    }

.pagination-text[b-lbbfgjhf9g] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-lbbfgjhf9g] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-lbbfgjhf9g] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-lbbfgjhf9g] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-lbbfgjhf9g]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-lbbfgjhf9g] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-lbbfgjhf9g] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-lbbfgjhf9g] {
        transform: scale(0.95);
    }
/* _content/Client/Pages/SatisDagitim/İrsaliye/SatisIrsaliyesiMobil/SatisIrsaliyesiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-0zj8nno2ap] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-0zj8nno2ap] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-0zj8nno2ap] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-0zj8nno2ap] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-0zj8nno2ap] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-0zj8nno2ap] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0zj8nno2ap]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0zj8nno2ap] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0zj8nno2ap] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0zj8nno2ap] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-0zj8nno2ap] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-0zj8nno2ap] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-0zj8nno2ap] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-0zj8nno2ap] {
        transform: scale(0.98);
    }

.card-header-section[b-0zj8nno2ap] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-0zj8nno2ap] {
    width: 100%;
}

.card-title-row[b-0zj8nno2ap] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-0zj8nno2ap] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-0zj8nno2ap] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-0zj8nno2ap] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-0zj8nno2ap] {
        transform: rotate(0deg);
    }

.card-meta-row[b-0zj8nno2ap] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-0zj8nno2ap] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-0zj8nno2ap] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-0zj8nno2ap] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-0zj8nno2ap] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-0zj8nno2ap] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-0zj8nno2ap] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-0zj8nno2ap] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-0zj8nno2ap] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-0zj8nno2ap] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-0zj8nno2ap] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-0zj8nno2ap] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-0zj8nno2ap] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-0zj8nno2ap] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-0zj8nno2ap] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-row[b-0zj8nno2ap] {
    display: flex;
    flex-wrap: wrap; /* Uzun değer varsa yeni satıra geçsin */
    align-items: flex-start;
    margin-bottom: 6px;
    gap: 6px;
}

.info-label[b-0zj8nno2ap] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 35%; /* Satırın %35'ini kapla */
    max-width: 35%;
}

    .info-label i[b-0zj8nno2ap] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-0zj8nno2ap] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex: 0 0 65%; /* Satırın %65'ini kapla */
    max-width: 65%;
    white-space: pre-wrap; /* Satır sonlarında kır */
    word-wrap: break-word; /* Uzun kelimelerde kır */
    overflow-wrap: break-word;
}


.card-actions[b-0zj8nno2ap] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-0zj8nno2ap] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-0zj8nno2ap] {
        transform: scale(0.95);
    }

.btn-primary[b-0zj8nno2ap] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-0zj8nno2ap] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-0zj8nno2ap] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-0zj8nno2ap] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-0zj8nno2ap] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-0zj8nno2ap] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-0zj8nno2ap] {
        font-size: 14px;
    }

    .card-quick-info[b-0zj8nno2ap] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-0zj8nno2ap] {
        padding: 10px;
    }

    .stok-card[b-0zj8nno2ap] {
        margin: 6px 10px;
    }

    .quick-value[b-0zj8nno2ap] {
        font-size: 15px;
    }

    .card-header-section[b-0zj8nno2ap] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-0zj8nno2ap],
    .stok-card[b-0zj8nno2ap] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-0zj8nno2ap {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-0zj8nno2ap] {
    animation: fadeIn-b-0zj8nno2ap 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-0zj8nno2ap]::-webkit-scrollbar {
        width: 6px;
    }

    [b-0zj8nno2ap]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-0zj8nno2ap]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-0zj8nno2ap]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-0zj8nno2ap],
    .custom-grid[b-0zj8nno2ap] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-0zj8nno2ap],
    [data-bs-theme="dark"] .custom-grid[b-0zj8nno2ap] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-0zj8nno2ap],
    .dxbs-grid-header-content[b-0zj8nno2ap],
    .dxbs-grid-header-panel[b-0zj8nno2ap],
    .dxbs-grid-filter-row[b-0zj8nno2ap],
    .dxbs-grid-command-column[b-0zj8nno2ap],
    .dxbs-grid-selection-column[b-0zj8nno2ap],
    .dxbs-grid-data-column[b-0zj8nno2ap],
    .dxbs-grid-table thead[b-0zj8nno2ap],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-0zj8nno2ap],
    .dxbs-grid-table > tbody > tr > th[b-0zj8nno2ap],
    .dxbs-grid-pager[b-0zj8nno2ap],
    .dxbs-grid-empty-data[b-0zj8nno2ap],
    .dxbs-grid-toolbar[b-0zj8nno2ap],
    .dxbs-grid-statusbar[b-0zj8nno2ap] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-0zj8nno2ap],
    .dxbs-grid-table > tbody[b-0zj8nno2ap],
    .dxbs-grid-table > tbody > tr[b-0zj8nno2ap] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-0zj8nno2ap] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-0zj8nno2ap],
        .dxbs-grid-detail-cell > *[b-0zj8nno2ap] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-0zj8nno2ap] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-0zj8nno2ap],
    .dxbs-grid-header-content[b-0zj8nno2ap],
    .dxbs-grid-filter-row[b-0zj8nno2ap],
    .dxbs-grid-command-column[b-0zj8nno2ap],
    .dxbs-grid-selection-column[b-0zj8nno2ap],
    .dxbs-grid-data-column[b-0zj8nno2ap],
    .dxbs-grid-table thead[b-0zj8nno2ap],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-0zj8nno2ap] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-0zj8nno2ap],
    .dxbs-grid-table > tbody[b-0zj8nno2ap],
    .dxbs-grid-table > tbody > tr[b-0zj8nno2ap] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-0zj8nno2ap] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-0zj8nno2ap] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-0zj8nno2ap] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-0zj8nno2ap] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-0zj8nno2ap] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-0zj8nno2ap] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-0zj8nno2ap] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-0zj8nno2ap] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0zj8nno2ap]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0zj8nno2ap] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0zj8nno2ap] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0zj8nno2ap] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-0zj8nno2ap] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-0zj8nno2ap] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-0zj8nno2ap] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-0zj8nno2ap] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-0zj8nno2ap] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-0zj8nno2ap] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-0zj8nno2ap] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-0zj8nno2ap] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-0zj8nno2ap] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-0zj8nno2ap] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-0zj8nno2ap] {
    color: #667eea;
}

.separator[b-0zj8nno2ap] {
    color: var(--text-muted);
}

.total-pages[b-0zj8nno2ap] {
    color: var(--text-secondary);
}




.page-size-selector[b-0zj8nno2ap] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-0zj8nno2ap] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-0zj8nno2ap] {
        border-color: #667eea;
    }

.pagination-text[b-0zj8nno2ap] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-0zj8nno2ap] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-0zj8nno2ap] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-0zj8nno2ap] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-0zj8nno2ap] {
        transform: scale(0.98);
    }

.card-header-section[b-0zj8nno2ap] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-0zj8nno2ap] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-0zj8nno2ap] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-0zj8nno2ap] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-0zj8nno2ap] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-0zj8nno2ap] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-0zj8nno2ap] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-0zj8nno2ap] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-0zj8nno2ap] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-0zj8nno2ap] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-0zj8nno2ap] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-0zj8nno2ap] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-0zj8nno2ap] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-0zj8nno2ap] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-0zj8nno2ap] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-0zj8nno2ap] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-0zj8nno2ap] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-0zj8nno2ap] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-0zj8nno2ap] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-0zj8nno2ap] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-0zj8nno2ap] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-0zj8nno2ap] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-0zj8nno2ap] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-0zj8nno2ap] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-0zj8nno2ap] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-0zj8nno2ap] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-0zj8nno2ap] {
        transform: scale(0.95);
    }

.btn-primary[b-0zj8nno2ap] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-0zj8nno2ap] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-0zj8nno2ap] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-0zj8nno2ap] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-0zj8nno2ap] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-0zj8nno2ap] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-0zj8nno2ap] {
        font-size: 14px;
    }

    .card-quick-info[b-0zj8nno2ap] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-0zj8nno2ap] {
        padding: 10px;
    }

    .stok-card[b-0zj8nno2ap] {
        margin: 6px 10px;
    }

    .quick-value[b-0zj8nno2ap] {
        font-size: 15px;
    }

    .card-header-section[b-0zj8nno2ap] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-0zj8nno2ap],
    .stok-card[b-0zj8nno2ap],
    .mobile-pagination[b-0zj8nno2ap],
    .pagination-details[b-0zj8nno2ap] {
        display: none !important;
    }
}

@keyframes fadeIn-b-0zj8nno2ap {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-0zj8nno2ap] {
    animation: fadeIn-b-0zj8nno2ap 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-0zj8nno2ap]::-webkit-scrollbar {
        width: 6px;
    }

    [b-0zj8nno2ap]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-0zj8nno2ap]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-0zj8nno2ap]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-0zj8nno2ap] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-0zj8nno2ap] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-0zj8nno2ap] {
    background: #0f172a;
}

.pagination-btn[b-0zj8nno2ap] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-0zj8nno2ap] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-0zj8nno2ap] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-0zj8nno2ap] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-0zj8nno2ap] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-0zj8nno2ap] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-0zj8nno2ap] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-0zj8nno2ap] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-0zj8nno2ap] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-0zj8nno2ap] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-0zj8nno2ap] {
        border-color: #667eea;
    }

.pagination-text[b-0zj8nno2ap] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-0zj8nno2ap] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-0zj8nno2ap] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-0zj8nno2ap] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0zj8nno2ap]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0zj8nno2ap] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0zj8nno2ap] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0zj8nno2ap] {
        transform: scale(0.95);
    }
/* _content/Client/Pages/SistemAraclari/ToplamlariHesapla.razor.rz.scp.css */
/* _content/Client/Pages/Stok/DepoListesiMobil/DepoListesiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-3gp7wbt02a] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-3gp7wbt02a] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-3gp7wbt02a] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-3gp7wbt02a] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-3gp7wbt02a] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-3gp7wbt02a] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-3gp7wbt02a]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-3gp7wbt02a] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-3gp7wbt02a] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-3gp7wbt02a] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-3gp7wbt02a] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-3gp7wbt02a] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-3gp7wbt02a] {
        transform: scale(0.98);
    }

.card-header-section[b-3gp7wbt02a] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-3gp7wbt02a] {
    width: 100%;
}

.card-title-row[b-3gp7wbt02a] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-3gp7wbt02a] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-3gp7wbt02a] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-3gp7wbt02a] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-3gp7wbt02a] {
        transform: rotate(0deg);
    }

.card-meta-row[b-3gp7wbt02a] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-3gp7wbt02a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-3gp7wbt02a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-3gp7wbt02a] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-3gp7wbt02a] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-3gp7wbt02a] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-3gp7wbt02a] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-3gp7wbt02a] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-3gp7wbt02a] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-3gp7wbt02a] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-3gp7wbt02a] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-3gp7wbt02a] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-3gp7wbt02a] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-3gp7wbt02a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-3gp7wbt02a] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-3gp7wbt02a] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-3gp7wbt02a] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-3gp7wbt02a] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-3gp7wbt02a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-3gp7wbt02a] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

.btn-primary[b-3gp7wbt02a] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-3gp7wbt02a] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-3gp7wbt02a] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-3gp7wbt02a] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-3gp7wbt02a] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-3gp7wbt02a] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-3gp7wbt02a] {
        font-size: 14px;
    }

    .card-quick-info[b-3gp7wbt02a] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-3gp7wbt02a] {
        padding: 10px;
    }

    .stok-card[b-3gp7wbt02a] {
        margin: 6px 10px;
    }

    .quick-value[b-3gp7wbt02a] {
        font-size: 15px;
    }

    .card-header-section[b-3gp7wbt02a] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-3gp7wbt02a],
    .stok-card[b-3gp7wbt02a] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-3gp7wbt02a {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-3gp7wbt02a] {
    animation: fadeIn-b-3gp7wbt02a 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-3gp7wbt02a]::-webkit-scrollbar {
        width: 6px;
    }

    [b-3gp7wbt02a]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-3gp7wbt02a]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-3gp7wbt02a]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-3gp7wbt02a],
    .custom-grid[b-3gp7wbt02a] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-3gp7wbt02a],
    [data-bs-theme="dark"] .custom-grid[b-3gp7wbt02a] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-3gp7wbt02a],
    .dxbs-grid-header-content[b-3gp7wbt02a],
    .dxbs-grid-header-panel[b-3gp7wbt02a],
    .dxbs-grid-filter-row[b-3gp7wbt02a],
    .dxbs-grid-command-column[b-3gp7wbt02a],
    .dxbs-grid-selection-column[b-3gp7wbt02a],
    .dxbs-grid-data-column[b-3gp7wbt02a],
    .dxbs-grid-table thead[b-3gp7wbt02a],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-3gp7wbt02a],
    .dxbs-grid-table > tbody > tr > th[b-3gp7wbt02a],
    .dxbs-grid-pager[b-3gp7wbt02a],
    .dxbs-grid-empty-data[b-3gp7wbt02a],
    .dxbs-grid-toolbar[b-3gp7wbt02a],
    .dxbs-grid-statusbar[b-3gp7wbt02a] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-3gp7wbt02a],
    .dxbs-grid-table > tbody[b-3gp7wbt02a],
    .dxbs-grid-table > tbody > tr[b-3gp7wbt02a] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-3gp7wbt02a] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-3gp7wbt02a],
        .dxbs-grid-detail-cell > *[b-3gp7wbt02a] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-3gp7wbt02a] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-3gp7wbt02a],
    .dxbs-grid-header-content[b-3gp7wbt02a],
    .dxbs-grid-filter-row[b-3gp7wbt02a],
    .dxbs-grid-command-column[b-3gp7wbt02a],
    .dxbs-grid-selection-column[b-3gp7wbt02a],
    .dxbs-grid-data-column[b-3gp7wbt02a],
    .dxbs-grid-table thead[b-3gp7wbt02a],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-3gp7wbt02a] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-3gp7wbt02a],
    .dxbs-grid-table > tbody[b-3gp7wbt02a],
    .dxbs-grid-table > tbody > tr[b-3gp7wbt02a] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-3gp7wbt02a] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-3gp7wbt02a] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-3gp7wbt02a] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-3gp7wbt02a] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-3gp7wbt02a] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-3gp7wbt02a] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-3gp7wbt02a] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-3gp7wbt02a] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-3gp7wbt02a]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-3gp7wbt02a] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-3gp7wbt02a] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-3gp7wbt02a] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-3gp7wbt02a] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-3gp7wbt02a] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-3gp7wbt02a] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-3gp7wbt02a] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-3gp7wbt02a] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-3gp7wbt02a] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-3gp7wbt02a] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-3gp7wbt02a] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-3gp7wbt02a] {
    color: #667eea;
}

.separator[b-3gp7wbt02a] {
    color: var(--text-muted);
}

.total-pages[b-3gp7wbt02a] {
    color: var(--text-secondary);
}




.page-size-selector[b-3gp7wbt02a] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-3gp7wbt02a] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-3gp7wbt02a] {
        border-color: #667eea;
    }

.pagination-text[b-3gp7wbt02a] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-3gp7wbt02a] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-3gp7wbt02a] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-3gp7wbt02a] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-3gp7wbt02a] {
        transform: scale(0.98);
    }

.card-header-section[b-3gp7wbt02a] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-3gp7wbt02a] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-3gp7wbt02a] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-3gp7wbt02a] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-3gp7wbt02a] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-3gp7wbt02a] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-3gp7wbt02a] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-3gp7wbt02a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-3gp7wbt02a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-3gp7wbt02a] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-3gp7wbt02a] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-3gp7wbt02a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-3gp7wbt02a] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-3gp7wbt02a] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-3gp7wbt02a] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-3gp7wbt02a] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-3gp7wbt02a] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-3gp7wbt02a] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-3gp7wbt02a] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-3gp7wbt02a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-3gp7wbt02a] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-3gp7wbt02a] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-3gp7wbt02a] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-3gp7wbt02a] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-3gp7wbt02a] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-3gp7wbt02a] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

.btn-primary[b-3gp7wbt02a] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-3gp7wbt02a] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-3gp7wbt02a] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-3gp7wbt02a] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-3gp7wbt02a] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-3gp7wbt02a] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-3gp7wbt02a] {
        font-size: 14px;
    }

    .card-quick-info[b-3gp7wbt02a] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-3gp7wbt02a] {
        padding: 10px;
    }

    .stok-card[b-3gp7wbt02a] {
        margin: 6px 10px;
    }

    .quick-value[b-3gp7wbt02a] {
        font-size: 15px;
    }

    .card-header-section[b-3gp7wbt02a] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-3gp7wbt02a],
    .stok-card[b-3gp7wbt02a],
    .mobile-pagination[b-3gp7wbt02a],
    .pagination-details[b-3gp7wbt02a] {
        display: none !important;
    }
}

@keyframes fadeIn-b-3gp7wbt02a {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-3gp7wbt02a] {
    animation: fadeIn-b-3gp7wbt02a 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-3gp7wbt02a]::-webkit-scrollbar {
        width: 6px;
    }

    [b-3gp7wbt02a]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-3gp7wbt02a]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-3gp7wbt02a]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-3gp7wbt02a] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-3gp7wbt02a] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-3gp7wbt02a] {
    background: #0f172a;
}

.pagination-btn[b-3gp7wbt02a] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-3gp7wbt02a] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-3gp7wbt02a] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-3gp7wbt02a] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-3gp7wbt02a] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-3gp7wbt02a] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-3gp7wbt02a] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-3gp7wbt02a] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-3gp7wbt02a] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-3gp7wbt02a] {
        border-color: #667eea;
    }

.pagination-text[b-3gp7wbt02a] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-3gp7wbt02a] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-3gp7wbt02a] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-3gp7wbt02a] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-3gp7wbt02a]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-3gp7wbt02a] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-3gp7wbt02a] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-3gp7wbt02a] {
        transform: scale(0.95);
    }

#faturaContainer[b-3gp7wbt02a] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/Stok/DepoTransferFisiMobil/DepoTransferFisiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-5vszjw5f3c] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-5vszjw5f3c] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-5vszjw5f3c] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-5vszjw5f3c] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-5vszjw5f3c] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-5vszjw5f3c] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-5vszjw5f3c]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-5vszjw5f3c] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-5vszjw5f3c] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-5vszjw5f3c] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-5vszjw5f3c] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-5vszjw5f3c] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-5vszjw5f3c] {
        transform: scale(0.98);
    }

.card-header-section[b-5vszjw5f3c] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-5vszjw5f3c] {
    width: 100%;
}

.card-title-row[b-5vszjw5f3c] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-5vszjw5f3c] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-5vszjw5f3c] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-5vszjw5f3c] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-5vszjw5f3c] {
        transform: rotate(0deg);
    }

.card-meta-row[b-5vszjw5f3c] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-5vszjw5f3c] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-5vszjw5f3c] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-5vszjw5f3c] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-5vszjw5f3c] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-5vszjw5f3c] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-5vszjw5f3c] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-5vszjw5f3c] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-5vszjw5f3c] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-5vszjw5f3c] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-5vszjw5f3c] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-5vszjw5f3c] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-5vszjw5f3c] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-5vszjw5f3c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-5vszjw5f3c] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-5vszjw5f3c] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-5vszjw5f3c] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-5vszjw5f3c] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-5vszjw5f3c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-5vszjw5f3c] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

.btn-primary[b-5vszjw5f3c] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-5vszjw5f3c] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-5vszjw5f3c] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-5vszjw5f3c] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-5vszjw5f3c] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-5vszjw5f3c] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-5vszjw5f3c] {
        font-size: 14px;
    }

    .card-quick-info[b-5vszjw5f3c] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-5vszjw5f3c] {
        padding: 10px;
    }

    .stok-card[b-5vszjw5f3c] {
        margin: 6px 10px;
    }

    .quick-value[b-5vszjw5f3c] {
        font-size: 15px;
    }

    .card-header-section[b-5vszjw5f3c] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-5vszjw5f3c],
    .stok-card[b-5vszjw5f3c] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-5vszjw5f3c {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-5vszjw5f3c] {
    animation: fadeIn-b-5vszjw5f3c 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-5vszjw5f3c]::-webkit-scrollbar {
        width: 6px;
    }

    [b-5vszjw5f3c]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-5vszjw5f3c]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-5vszjw5f3c]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-5vszjw5f3c],
    .custom-grid[b-5vszjw5f3c] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-5vszjw5f3c],
    [data-bs-theme="dark"] .custom-grid[b-5vszjw5f3c] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-5vszjw5f3c],
    .dxbs-grid-header-content[b-5vszjw5f3c],
    .dxbs-grid-header-panel[b-5vszjw5f3c],
    .dxbs-grid-filter-row[b-5vszjw5f3c],
    .dxbs-grid-command-column[b-5vszjw5f3c],
    .dxbs-grid-selection-column[b-5vszjw5f3c],
    .dxbs-grid-data-column[b-5vszjw5f3c],
    .dxbs-grid-table thead[b-5vszjw5f3c],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-5vszjw5f3c],
    .dxbs-grid-table > tbody > tr > th[b-5vszjw5f3c],
    .dxbs-grid-pager[b-5vszjw5f3c],
    .dxbs-grid-empty-data[b-5vszjw5f3c],
    .dxbs-grid-toolbar[b-5vszjw5f3c],
    .dxbs-grid-statusbar[b-5vszjw5f3c] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-5vszjw5f3c],
    .dxbs-grid-table > tbody[b-5vszjw5f3c],
    .dxbs-grid-table > tbody > tr[b-5vszjw5f3c] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-5vszjw5f3c] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-5vszjw5f3c],
        .dxbs-grid-detail-cell > *[b-5vszjw5f3c] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-5vszjw5f3c] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-5vszjw5f3c],
    .dxbs-grid-header-content[b-5vszjw5f3c],
    .dxbs-grid-filter-row[b-5vszjw5f3c],
    .dxbs-grid-command-column[b-5vszjw5f3c],
    .dxbs-grid-selection-column[b-5vszjw5f3c],
    .dxbs-grid-data-column[b-5vszjw5f3c],
    .dxbs-grid-table thead[b-5vszjw5f3c],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-5vszjw5f3c] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-5vszjw5f3c],
    .dxbs-grid-table > tbody[b-5vszjw5f3c],
    .dxbs-grid-table > tbody > tr[b-5vszjw5f3c] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-5vszjw5f3c] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-5vszjw5f3c] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-5vszjw5f3c] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-5vszjw5f3c] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-5vszjw5f3c] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-5vszjw5f3c] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-5vszjw5f3c] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-5vszjw5f3c] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-5vszjw5f3c]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-5vszjw5f3c] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-5vszjw5f3c] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-5vszjw5f3c] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-5vszjw5f3c] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-5vszjw5f3c] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-5vszjw5f3c] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-5vszjw5f3c] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-5vszjw5f3c] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-5vszjw5f3c] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-5vszjw5f3c] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-5vszjw5f3c] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-5vszjw5f3c] {
    color: #667eea;
}

.separator[b-5vszjw5f3c] {
    color: var(--text-muted);
}

.total-pages[b-5vszjw5f3c] {
    color: var(--text-secondary);
}




.page-size-selector[b-5vszjw5f3c] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-5vszjw5f3c] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-5vszjw5f3c] {
        border-color: #667eea;
    }

.pagination-text[b-5vszjw5f3c] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-5vszjw5f3c] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-5vszjw5f3c] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-5vszjw5f3c] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-5vszjw5f3c] {
        transform: scale(0.98);
    }

.card-header-section[b-5vszjw5f3c] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-5vszjw5f3c] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-5vszjw5f3c] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-5vszjw5f3c] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-5vszjw5f3c] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-5vszjw5f3c] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-5vszjw5f3c] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-5vszjw5f3c] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-5vszjw5f3c] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-5vszjw5f3c] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-5vszjw5f3c] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-5vszjw5f3c] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-5vszjw5f3c] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-5vszjw5f3c] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-5vszjw5f3c] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-5vszjw5f3c] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-5vszjw5f3c] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-5vszjw5f3c] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-5vszjw5f3c] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-5vszjw5f3c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-5vszjw5f3c] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-5vszjw5f3c] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-5vszjw5f3c] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-5vszjw5f3c] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-5vszjw5f3c] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-5vszjw5f3c] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

.btn-primary[b-5vszjw5f3c] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-5vszjw5f3c] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-5vszjw5f3c] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-5vszjw5f3c] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-5vszjw5f3c] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-5vszjw5f3c] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-5vszjw5f3c] {
        font-size: 14px;
    }

    .card-quick-info[b-5vszjw5f3c] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-5vszjw5f3c] {
        padding: 10px;
    }

    .stok-card[b-5vszjw5f3c] {
        margin: 6px 10px;
    }

    .quick-value[b-5vszjw5f3c] {
        font-size: 15px;
    }

    .card-header-section[b-5vszjw5f3c] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-5vszjw5f3c],
    .stok-card[b-5vszjw5f3c],
    .mobile-pagination[b-5vszjw5f3c],
    .pagination-details[b-5vszjw5f3c] {
        display: none !important;
    }
}

@keyframes fadeIn-b-5vszjw5f3c {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-5vszjw5f3c] {
    animation: fadeIn-b-5vszjw5f3c 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-5vszjw5f3c]::-webkit-scrollbar {
        width: 6px;
    }

    [b-5vszjw5f3c]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-5vszjw5f3c]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-5vszjw5f3c]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-5vszjw5f3c] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-5vszjw5f3c] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-5vszjw5f3c] {
    background: #0f172a;
}

.pagination-btn[b-5vszjw5f3c] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-5vszjw5f3c] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-5vszjw5f3c] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-5vszjw5f3c] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-5vszjw5f3c] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-5vszjw5f3c] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-5vszjw5f3c] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-5vszjw5f3c] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-5vszjw5f3c] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-5vszjw5f3c] {
        border-color: #667eea;
    }

.pagination-text[b-5vszjw5f3c] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-5vszjw5f3c] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-5vszjw5f3c] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-5vszjw5f3c] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-5vszjw5f3c]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-5vszjw5f3c] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-5vszjw5f3c] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-5vszjw5f3c] {
        transform: scale(0.95);
    }

#faturaContainer[b-5vszjw5f3c] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/Stok/FiyatListesiMobil/FiyatListesiMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-2blffexr05] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-2blffexr05] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-2blffexr05] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-2blffexr05] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-2blffexr05] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-2blffexr05] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-2blffexr05]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-2blffexr05] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-2blffexr05] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-2blffexr05] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-2blffexr05] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-2blffexr05] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-2blffexr05] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-2blffexr05] {
        transform: scale(0.98);
    }

.card-header-section[b-2blffexr05] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-2blffexr05] {
    width: 100%;
}

.card-title-row[b-2blffexr05] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-2blffexr05] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-2blffexr05] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-2blffexr05] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-2blffexr05] {
        transform: rotate(0deg);
    }

.card-meta-row[b-2blffexr05] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-2blffexr05] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-2blffexr05] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-2blffexr05] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-2blffexr05] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-2blffexr05] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-2blffexr05] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-2blffexr05] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-2blffexr05] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-2blffexr05] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-2blffexr05] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-2blffexr05] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-2blffexr05] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-2blffexr05] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-2blffexr05] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-2blffexr05] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-2blffexr05] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-2blffexr05] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-2blffexr05] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-2blffexr05] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-2blffexr05] {
        transform: scale(0.95);
    }

.btn-primary[b-2blffexr05] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-2blffexr05] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-2blffexr05] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-2blffexr05] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-2blffexr05] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-2blffexr05] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-2blffexr05] {
        font-size: 14px;
    }

    .card-quick-info[b-2blffexr05] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-2blffexr05] {
        padding: 10px;
    }

    .stok-card[b-2blffexr05] {
        margin: 6px 10px;
    }

    .quick-value[b-2blffexr05] {
        font-size: 15px;
    }

    .card-header-section[b-2blffexr05] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-2blffexr05],
    .stok-card[b-2blffexr05] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-2blffexr05 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-2blffexr05] {
    animation: fadeIn-b-2blffexr05 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-2blffexr05]::-webkit-scrollbar {
        width: 6px;
    }

    [b-2blffexr05]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-2blffexr05]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-2blffexr05]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-2blffexr05],
    .custom-grid[b-2blffexr05] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-2blffexr05],
    [data-bs-theme="dark"] .custom-grid[b-2blffexr05] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-2blffexr05],
    .dxbs-grid-header-content[b-2blffexr05],
    .dxbs-grid-header-panel[b-2blffexr05],
    .dxbs-grid-filter-row[b-2blffexr05],
    .dxbs-grid-command-column[b-2blffexr05],
    .dxbs-grid-selection-column[b-2blffexr05],
    .dxbs-grid-data-column[b-2blffexr05],
    .dxbs-grid-table thead[b-2blffexr05],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-2blffexr05],
    .dxbs-grid-table > tbody > tr > th[b-2blffexr05],
    .dxbs-grid-pager[b-2blffexr05],
    .dxbs-grid-empty-data[b-2blffexr05],
    .dxbs-grid-toolbar[b-2blffexr05],
    .dxbs-grid-statusbar[b-2blffexr05] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-2blffexr05],
    .dxbs-grid-table > tbody[b-2blffexr05],
    .dxbs-grid-table > tbody > tr[b-2blffexr05] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-2blffexr05] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-2blffexr05],
        .dxbs-grid-detail-cell > *[b-2blffexr05] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-2blffexr05] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-2blffexr05],
    .dxbs-grid-header-content[b-2blffexr05],
    .dxbs-grid-filter-row[b-2blffexr05],
    .dxbs-grid-command-column[b-2blffexr05],
    .dxbs-grid-selection-column[b-2blffexr05],
    .dxbs-grid-data-column[b-2blffexr05],
    .dxbs-grid-table thead[b-2blffexr05],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-2blffexr05] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-2blffexr05],
    .dxbs-grid-table > tbody[b-2blffexr05],
    .dxbs-grid-table > tbody > tr[b-2blffexr05] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-2blffexr05] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-2blffexr05] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-2blffexr05] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-2blffexr05] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-2blffexr05] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-2blffexr05] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-2blffexr05] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-2blffexr05] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-2blffexr05]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-2blffexr05] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-2blffexr05] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-2blffexr05] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-2blffexr05] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-2blffexr05] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-2blffexr05] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-2blffexr05] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-2blffexr05] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-2blffexr05] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-2blffexr05] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-2blffexr05] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-2blffexr05] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-2blffexr05] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-2blffexr05] {
    color: #667eea;
}

.separator[b-2blffexr05] {
    color: var(--text-muted);
}

.total-pages[b-2blffexr05] {
    color: var(--text-secondary);
}




.page-size-selector[b-2blffexr05] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-2blffexr05] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-2blffexr05] {
        border-color: #667eea;
    }

.pagination-text[b-2blffexr05] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-2blffexr05] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-2blffexr05] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-2blffexr05] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-2blffexr05] {
        transform: scale(0.98);
    }

.card-header-section[b-2blffexr05] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-2blffexr05] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-2blffexr05] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-2blffexr05] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-2blffexr05] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-2blffexr05] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-2blffexr05] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-2blffexr05] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-2blffexr05] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-2blffexr05] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-2blffexr05] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-2blffexr05] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-2blffexr05] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-2blffexr05] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-2blffexr05] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-2blffexr05] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-2blffexr05] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-2blffexr05] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-2blffexr05] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-2blffexr05] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-2blffexr05] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-2blffexr05] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-2blffexr05] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-2blffexr05] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-2blffexr05] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-2blffexr05] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-2blffexr05] {
        transform: scale(0.95);
    }

.btn-primary[b-2blffexr05] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-2blffexr05] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-2blffexr05] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-2blffexr05] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-2blffexr05] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-2blffexr05] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-2blffexr05] {
        font-size: 14px;
    }

    .card-quick-info[b-2blffexr05] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-2blffexr05] {
        padding: 10px;
    }

    .stok-card[b-2blffexr05] {
        margin: 6px 10px;
    }

    .quick-value[b-2blffexr05] {
        font-size: 15px;
    }

    .card-header-section[b-2blffexr05] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-2blffexr05],
    .stok-card[b-2blffexr05],
    .mobile-pagination[b-2blffexr05],
    .pagination-details[b-2blffexr05] {
        display: none !important;
    }
}

@keyframes fadeIn-b-2blffexr05 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-2blffexr05] {
    animation: fadeIn-b-2blffexr05 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-2blffexr05]::-webkit-scrollbar {
        width: 6px;
    }

    [b-2blffexr05]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-2blffexr05]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-2blffexr05]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-2blffexr05] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-2blffexr05] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-2blffexr05] {
    background: #0f172a;
}

.pagination-btn[b-2blffexr05] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-2blffexr05] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-2blffexr05] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-2blffexr05] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-2blffexr05] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-2blffexr05] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-2blffexr05] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-2blffexr05] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-2blffexr05] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-2blffexr05] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-2blffexr05] {
        border-color: #667eea;
    }

.pagination-text[b-2blffexr05] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-2blffexr05] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-2blffexr05] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-2blffexr05] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-2blffexr05]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-2blffexr05] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-2blffexr05] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-2blffexr05] {
        transform: scale(0.95);
    }

#faturaContainer[b-2blffexr05] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/Stok/HizmetAra.razor.rz.scp.css */
:root[b-0ecc36lzh2] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-0ecc36lzh2] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

@media (max-width: 991px) {
    .dxbs-grid[b-0ecc36lzh2] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-0ecc36lzh2],
    .dxbs-grid-header-content[b-0ecc36lzh2],
    .dxbs-grid-filter-row[b-0ecc36lzh2],
    .dxbs-grid-command-column[b-0ecc36lzh2],
    .dxbs-grid-selection-column[b-0ecc36lzh2],
    .dxbs-grid-data-column[b-0ecc36lzh2],
    .dxbs-grid-table thead[b-0ecc36lzh2],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-0ecc36lzh2] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-0ecc36lzh2],
    .dxbs-grid-table > tbody[b-0ecc36lzh2],
    .dxbs-grid-table > tbody > tr[b-0ecc36lzh2] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-0ecc36lzh2] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-0ecc36lzh2] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-0ecc36lzh2] {
    position: sticky;
    z-index: 1000;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-0ecc36lzh2] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-0ecc36lzh2] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-0ecc36lzh2] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-0ecc36lzh2] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-0ecc36lzh2] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-0ecc36lzh2]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-0ecc36lzh2] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-0ecc36lzh2] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-0ecc36lzh2] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-0ecc36lzh2] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 998;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-0ecc36lzh2] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-0ecc36lzh2] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-0ecc36lzh2] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-0ecc36lzh2] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-0ecc36lzh2] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-0ecc36lzh2] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-0ecc36lzh2] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-0ecc36lzh2] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-0ecc36lzh2] {
    color: #667eea;
}

.separator[b-0ecc36lzh2] {
    color: var(--text-muted);
}

.total-pages[b-0ecc36lzh2] {
    color: var(--text-secondary);
}




.page-size-selector[b-0ecc36lzh2] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-0ecc36lzh2] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-0ecc36lzh2] {
        border-color: #667eea;
    }

.pagination-text[b-0ecc36lzh2] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-0ecc36lzh2] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-0ecc36lzh2] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-0ecc36lzh2] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-0ecc36lzh2] {
        transform: scale(0.98);
    }

.card-header-section[b-0ecc36lzh2] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-0ecc36lzh2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-0ecc36lzh2] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-0ecc36lzh2] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-0ecc36lzh2] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-0ecc36lzh2] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-0ecc36lzh2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-0ecc36lzh2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-0ecc36lzh2] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-0ecc36lzh2] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-0ecc36lzh2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-0ecc36lzh2] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-0ecc36lzh2] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-0ecc36lzh2] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-0ecc36lzh2] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-0ecc36lzh2] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-0ecc36lzh2] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-0ecc36lzh2] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-0ecc36lzh2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-0ecc36lzh2] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-0ecc36lzh2] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-0ecc36lzh2] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-0ecc36lzh2] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-0ecc36lzh2] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

.action-btn[b-0ecc36lzh2] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-0ecc36lzh2] {
        transform: scale(0.95);
    }

.btn-primary[b-0ecc36lzh2] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-0ecc36lzh2] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-0ecc36lzh2] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-0ecc36lzh2] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-0ecc36lzh2] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-0ecc36lzh2] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-0ecc36lzh2] {
        font-size: 14px;
    }

    .card-quick-info[b-0ecc36lzh2] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-0ecc36lzh2] {
        padding: 10px;
    }

    .stok-card[b-0ecc36lzh2] {
        margin: 6px 10px;
    }

    .quick-value[b-0ecc36lzh2] {
        font-size: 15px;
    }

    .card-header-section[b-0ecc36lzh2] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-0ecc36lzh2],
    .stok-card[b-0ecc36lzh2],
    .mobile-pagination[b-0ecc36lzh2],
    .pagination-details[b-0ecc36lzh2] {
        display: none !important;
    }
}

@keyframes fadeIn-b-0ecc36lzh2 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-0ecc36lzh2] {
    animation: fadeIn-b-0ecc36lzh2 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-0ecc36lzh2]::-webkit-scrollbar {
        width: 6px;
    }

    [b-0ecc36lzh2]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-0ecc36lzh2]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-0ecc36lzh2]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}
/* _content/Client/Pages/Stok/HizmetAraMobil/HizmetAraMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-8t1uv7qtv8] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-8t1uv7qtv8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-8t1uv7qtv8] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-8t1uv7qtv8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-8t1uv7qtv8] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-8t1uv7qtv8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-8t1uv7qtv8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-8t1uv7qtv8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-8t1uv7qtv8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-8t1uv7qtv8] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-8t1uv7qtv8] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-8t1uv7qtv8] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-8t1uv7qtv8] {
        transform: scale(0.98);
    }

.card-header-section[b-8t1uv7qtv8] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-8t1uv7qtv8] {
    width: 100%;
}

.card-title-row[b-8t1uv7qtv8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-8t1uv7qtv8] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-8t1uv7qtv8] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-8t1uv7qtv8] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-8t1uv7qtv8] {
        transform: rotate(0deg);
    }

.card-meta-row[b-8t1uv7qtv8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-8t1uv7qtv8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-8t1uv7qtv8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-8t1uv7qtv8] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-8t1uv7qtv8] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-8t1uv7qtv8] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-8t1uv7qtv8] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-8t1uv7qtv8] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-8t1uv7qtv8] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-8t1uv7qtv8] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-8t1uv7qtv8] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-8t1uv7qtv8] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-8t1uv7qtv8] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-8t1uv7qtv8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-8t1uv7qtv8] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-8t1uv7qtv8] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-8t1uv7qtv8] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-8t1uv7qtv8] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-8t1uv7qtv8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-8t1uv7qtv8] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

.btn-primary[b-8t1uv7qtv8] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-8t1uv7qtv8] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-8t1uv7qtv8] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-8t1uv7qtv8] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-8t1uv7qtv8] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-8t1uv7qtv8] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-8t1uv7qtv8] {
        font-size: 14px;
    }

    .card-quick-info[b-8t1uv7qtv8] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-8t1uv7qtv8] {
        padding: 10px;
    }

    .stok-card[b-8t1uv7qtv8] {
        margin: 6px 10px;
    }

    .quick-value[b-8t1uv7qtv8] {
        font-size: 15px;
    }

    .card-header-section[b-8t1uv7qtv8] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-8t1uv7qtv8],
    .stok-card[b-8t1uv7qtv8] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-8t1uv7qtv8 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-8t1uv7qtv8] {
    animation: fadeIn-b-8t1uv7qtv8 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-8t1uv7qtv8]::-webkit-scrollbar {
        width: 6px;
    }

    [b-8t1uv7qtv8]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-8t1uv7qtv8]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-8t1uv7qtv8]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-8t1uv7qtv8],
    .custom-grid[b-8t1uv7qtv8] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-8t1uv7qtv8],
    [data-bs-theme="dark"] .custom-grid[b-8t1uv7qtv8] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-8t1uv7qtv8],
    .dxbs-grid-header-content[b-8t1uv7qtv8],
    .dxbs-grid-header-panel[b-8t1uv7qtv8],
    .dxbs-grid-filter-row[b-8t1uv7qtv8],
    .dxbs-grid-command-column[b-8t1uv7qtv8],
    .dxbs-grid-selection-column[b-8t1uv7qtv8],
    .dxbs-grid-data-column[b-8t1uv7qtv8],
    .dxbs-grid-table thead[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody > tr > th[b-8t1uv7qtv8],
    .dxbs-grid-pager[b-8t1uv7qtv8],
    .dxbs-grid-empty-data[b-8t1uv7qtv8],
    .dxbs-grid-toolbar[b-8t1uv7qtv8],
    .dxbs-grid-statusbar[b-8t1uv7qtv8] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody > tr[b-8t1uv7qtv8] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-8t1uv7qtv8] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-8t1uv7qtv8],
        .dxbs-grid-detail-cell > *[b-8t1uv7qtv8] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-8t1uv7qtv8] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-8t1uv7qtv8],
    .dxbs-grid-header-content[b-8t1uv7qtv8],
    .dxbs-grid-filter-row[b-8t1uv7qtv8],
    .dxbs-grid-command-column[b-8t1uv7qtv8],
    .dxbs-grid-selection-column[b-8t1uv7qtv8],
    .dxbs-grid-data-column[b-8t1uv7qtv8],
    .dxbs-grid-table thead[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-8t1uv7qtv8] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody[b-8t1uv7qtv8],
    .dxbs-grid-table > tbody > tr[b-8t1uv7qtv8] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-8t1uv7qtv8] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-8t1uv7qtv8] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-8t1uv7qtv8] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-8t1uv7qtv8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-8t1uv7qtv8] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-8t1uv7qtv8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-8t1uv7qtv8] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-8t1uv7qtv8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-8t1uv7qtv8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-8t1uv7qtv8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-8t1uv7qtv8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-8t1uv7qtv8] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-8t1uv7qtv8] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-8t1uv7qtv8] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-8t1uv7qtv8] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-8t1uv7qtv8] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-8t1uv7qtv8] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-8t1uv7qtv8] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-8t1uv7qtv8] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-8t1uv7qtv8] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-8t1uv7qtv8] {
    color: #667eea;
}

.separator[b-8t1uv7qtv8] {
    color: var(--text-muted);
}

.total-pages[b-8t1uv7qtv8] {
    color: var(--text-secondary);
}




.page-size-selector[b-8t1uv7qtv8] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-8t1uv7qtv8] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-8t1uv7qtv8] {
        border-color: #667eea;
    }

.pagination-text[b-8t1uv7qtv8] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-8t1uv7qtv8] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-8t1uv7qtv8] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-8t1uv7qtv8] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-8t1uv7qtv8] {
        transform: scale(0.98);
    }

.card-header-section[b-8t1uv7qtv8] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-8t1uv7qtv8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-8t1uv7qtv8] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-8t1uv7qtv8] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-8t1uv7qtv8] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-8t1uv7qtv8] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-8t1uv7qtv8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-8t1uv7qtv8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-8t1uv7qtv8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-8t1uv7qtv8] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-8t1uv7qtv8] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-8t1uv7qtv8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-8t1uv7qtv8] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-8t1uv7qtv8] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-8t1uv7qtv8] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-8t1uv7qtv8] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-8t1uv7qtv8] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-8t1uv7qtv8] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-8t1uv7qtv8] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-8t1uv7qtv8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-8t1uv7qtv8] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-8t1uv7qtv8] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-8t1uv7qtv8] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-8t1uv7qtv8] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-8t1uv7qtv8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-8t1uv7qtv8] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

.btn-primary[b-8t1uv7qtv8] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-8t1uv7qtv8] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-8t1uv7qtv8] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-8t1uv7qtv8] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-8t1uv7qtv8] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-8t1uv7qtv8] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-8t1uv7qtv8] {
        font-size: 14px;
    }

    .card-quick-info[b-8t1uv7qtv8] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-8t1uv7qtv8] {
        padding: 10px;
    }

    .stok-card[b-8t1uv7qtv8] {
        margin: 6px 10px;
    }

    .quick-value[b-8t1uv7qtv8] {
        font-size: 15px;
    }

    .card-header-section[b-8t1uv7qtv8] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-8t1uv7qtv8],
    .stok-card[b-8t1uv7qtv8],
    .mobile-pagination[b-8t1uv7qtv8],
    .pagination-details[b-8t1uv7qtv8] {
        display: none !important;
    }
}

@keyframes fadeIn-b-8t1uv7qtv8 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-8t1uv7qtv8] {
    animation: fadeIn-b-8t1uv7qtv8 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-8t1uv7qtv8]::-webkit-scrollbar {
        width: 6px;
    }

    [b-8t1uv7qtv8]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-8t1uv7qtv8]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-8t1uv7qtv8]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-8t1uv7qtv8] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-8t1uv7qtv8] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-8t1uv7qtv8] {
    background: #0f172a;
}

.pagination-btn[b-8t1uv7qtv8] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-8t1uv7qtv8] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-8t1uv7qtv8] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-8t1uv7qtv8] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-8t1uv7qtv8] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-8t1uv7qtv8] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-8t1uv7qtv8] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-8t1uv7qtv8] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-8t1uv7qtv8] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-8t1uv7qtv8] {
        border-color: #667eea;
    }

.pagination-text[b-8t1uv7qtv8] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-8t1uv7qtv8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-8t1uv7qtv8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-8t1uv7qtv8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-8t1uv7qtv8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-8t1uv7qtv8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-8t1uv7qtv8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-8t1uv7qtv8] {
        transform: scale(0.95);
    }

#faturaContainer[b-8t1uv7qtv8] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/Stok/MasrafAra.razor.rz.scp.css */
:root[b-q14mj1cnyu] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-q14mj1cnyu] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

@media (max-width: 991px) {
    .dxbs-grid[b-q14mj1cnyu] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-q14mj1cnyu],
    .dxbs-grid-header-content[b-q14mj1cnyu],
    .dxbs-grid-filter-row[b-q14mj1cnyu],
    .dxbs-grid-command-column[b-q14mj1cnyu],
    .dxbs-grid-selection-column[b-q14mj1cnyu],
    .dxbs-grid-data-column[b-q14mj1cnyu],
    .dxbs-grid-table thead[b-q14mj1cnyu],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-q14mj1cnyu] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-q14mj1cnyu],
    .dxbs-grid-table > tbody[b-q14mj1cnyu],
    .dxbs-grid-table > tbody > tr[b-q14mj1cnyu] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-q14mj1cnyu] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-q14mj1cnyu] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-q14mj1cnyu] {
    position: sticky;
    z-index: 1000;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-q14mj1cnyu] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-q14mj1cnyu] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-q14mj1cnyu] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-q14mj1cnyu] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-q14mj1cnyu] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-q14mj1cnyu]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-q14mj1cnyu] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-q14mj1cnyu] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-q14mj1cnyu] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-q14mj1cnyu] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 998;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-q14mj1cnyu] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-q14mj1cnyu] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-q14mj1cnyu] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-q14mj1cnyu] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-q14mj1cnyu] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-q14mj1cnyu] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-q14mj1cnyu] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-q14mj1cnyu] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-q14mj1cnyu] {
    color: #667eea;
}

.separator[b-q14mj1cnyu] {
    color: var(--text-muted);
}

.total-pages[b-q14mj1cnyu] {
    color: var(--text-secondary);
}




.page-size-selector[b-q14mj1cnyu] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-q14mj1cnyu] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-q14mj1cnyu] {
        border-color: #667eea;
    }

.pagination-text[b-q14mj1cnyu] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-q14mj1cnyu] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-q14mj1cnyu] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-q14mj1cnyu] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-q14mj1cnyu] {
        transform: scale(0.98);
    }

.card-header-section[b-q14mj1cnyu] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-q14mj1cnyu] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-q14mj1cnyu] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-q14mj1cnyu] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-q14mj1cnyu] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-q14mj1cnyu] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-q14mj1cnyu] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-q14mj1cnyu] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-q14mj1cnyu] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-q14mj1cnyu] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-q14mj1cnyu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-q14mj1cnyu] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-q14mj1cnyu] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-q14mj1cnyu] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-q14mj1cnyu] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-q14mj1cnyu] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-q14mj1cnyu] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-q14mj1cnyu] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-q14mj1cnyu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-q14mj1cnyu] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-q14mj1cnyu] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-q14mj1cnyu] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-q14mj1cnyu] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-q14mj1cnyu] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

.action-btn[b-q14mj1cnyu] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-q14mj1cnyu] {
        transform: scale(0.95);
    }

.btn-primary[b-q14mj1cnyu] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-q14mj1cnyu] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-q14mj1cnyu] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-q14mj1cnyu] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-q14mj1cnyu] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-q14mj1cnyu] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-q14mj1cnyu] {
        font-size: 14px;
    }

    .card-quick-info[b-q14mj1cnyu] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-q14mj1cnyu] {
        padding: 10px;
    }

    .stok-card[b-q14mj1cnyu] {
        margin: 6px 10px;
    }

    .quick-value[b-q14mj1cnyu] {
        font-size: 15px;
    }

    .card-header-section[b-q14mj1cnyu] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-q14mj1cnyu],
    .stok-card[b-q14mj1cnyu],
    .mobile-pagination[b-q14mj1cnyu],
    .pagination-details[b-q14mj1cnyu] {
        display: none !important;
    }
}

@keyframes fadeIn-b-q14mj1cnyu {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-q14mj1cnyu] {
    animation: fadeIn-b-q14mj1cnyu 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-q14mj1cnyu]::-webkit-scrollbar {
        width: 6px;
    }

    [b-q14mj1cnyu]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-q14mj1cnyu]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-q14mj1cnyu]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}
/* _content/Client/Pages/Stok/StokAra.razor.rz.scp.css */
:root[b-lhoo2d0si4] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-lhoo2d0si4] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

@media (max-width: 991px) {
    .dxbs-grid[b-lhoo2d0si4] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-lhoo2d0si4],
    .dxbs-grid-header-content[b-lhoo2d0si4],
    .dxbs-grid-filter-row[b-lhoo2d0si4],
    .dxbs-grid-command-column[b-lhoo2d0si4],
    .dxbs-grid-selection-column[b-lhoo2d0si4],
    .dxbs-grid-data-column[b-lhoo2d0si4],
    .dxbs-grid-table thead[b-lhoo2d0si4],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-lhoo2d0si4] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-lhoo2d0si4],
    .dxbs-grid-table > tbody[b-lhoo2d0si4],
    .dxbs-grid-table > tbody > tr[b-lhoo2d0si4] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-lhoo2d0si4] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-lhoo2d0si4] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
    .search-card-container[b-lhoo2d0si4] {
        position: sticky;
        z-index: 1000;
        padding: 12px;
        background: var(--card-bg);
        margin: 0;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }

.search-card[b-lhoo2d0si4] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-lhoo2d0si4] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-lhoo2d0si4] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-lhoo2d0si4] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-lhoo2d0si4] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-lhoo2d0si4]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-lhoo2d0si4] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-lhoo2d0si4] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-lhoo2d0si4] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-lhoo2d0si4] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 998;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-lhoo2d0si4] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-lhoo2d0si4] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-lhoo2d0si4] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-lhoo2d0si4] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-lhoo2d0si4] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-lhoo2d0si4] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-lhoo2d0si4] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-lhoo2d0si4] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-lhoo2d0si4] {
    color: #667eea;
}

.separator[b-lhoo2d0si4] {
    color: var(--text-muted);
}

.total-pages[b-lhoo2d0si4] {
    color: var(--text-secondary);
}




.page-size-selector[b-lhoo2d0si4] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-lhoo2d0si4] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-lhoo2d0si4] {
        border-color: #667eea;
    }

.pagination-text[b-lhoo2d0si4] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top:1vh;
    text-align: right;
}

.stok-card[b-lhoo2d0si4] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
    pointer-events: auto; 
}

    .stok-card:hover[b-lhoo2d0si4] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-lhoo2d0si4] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-lhoo2d0si4] {
        transform: scale(0.98);
    }

.card-header-section[b-lhoo2d0si4] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-lhoo2d0si4] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-lhoo2d0si4] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-lhoo2d0si4] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-lhoo2d0si4] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-lhoo2d0si4] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-lhoo2d0si4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-lhoo2d0si4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-lhoo2d0si4] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-lhoo2d0si4] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-lhoo2d0si4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-lhoo2d0si4] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-lhoo2d0si4] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-lhoo2d0si4] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-lhoo2d0si4] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-lhoo2d0si4] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-lhoo2d0si4] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-lhoo2d0si4] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
}

.info-row[b-lhoo2d0si4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-lhoo2d0si4] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-lhoo2d0si4] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-lhoo2d0si4] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-lhoo2d0si4] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-lhoo2d0si4] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

.action-btn[b-lhoo2d0si4] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-lhoo2d0si4] {
        transform: scale(0.95);
    }

.btn-primary[b-lhoo2d0si4] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-lhoo2d0si4] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-lhoo2d0si4] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-lhoo2d0si4] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-lhoo2d0si4] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-lhoo2d0si4] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-lhoo2d0si4] {
        font-size: 14px;
    }

    .card-quick-info[b-lhoo2d0si4] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-lhoo2d0si4] {
        padding: 10px;
    }

    .stok-card[b-lhoo2d0si4] {
        margin: 6px 10px;
    }

    .quick-value[b-lhoo2d0si4] {
        font-size: 15px;
    }

    .card-header-section[b-lhoo2d0si4] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-lhoo2d0si4],
    .stok-card[b-lhoo2d0si4],
    .mobile-pagination[b-lhoo2d0si4],
    .pagination-details[b-lhoo2d0si4] {
        display: none !important;
    }
}

@keyframes fadeIn-b-lhoo2d0si4 {
    from {
        opacity: 0;search-card-container
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-lhoo2d0si4] {
    animation: fadeIn-b-lhoo2d0si4 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-lhoo2d0si4]::-webkit-scrollbar {
        width: 6px;
    }

    [b-lhoo2d0si4]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-lhoo2d0si4]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-lhoo2d0si4]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

/* _content/Client/Pages/Stok/StokGirisCikisMobil/StokGirisMobil.razor.rz.scp.css */

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-xqezcj9xg8] {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 12px;
    background: var(--search-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-xqezcj9xg8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-xqezcj9xg8] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-xqezcj9xg8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-xqezcj9xg8] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-xqezcj9xg8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-xqezcj9xg8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-xqezcj9xg8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-xqezcj9xg8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

/* ============================================
   STOK KARTI
   ============================================ */
.stok-card[b-xqezcj9xg8] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    position: relative;
}

    .stok-card:hover[b-xqezcj9xg8] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-xqezcj9xg8] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-xqezcj9xg8] {
        transform: scale(0.98);
    }

.card-header-section[b-xqezcj9xg8] {
    padding: 6px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

.card-main-info[b-xqezcj9xg8] {
    width: 100%;
}

.card-title-row[b-xqezcj9xg8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-xqezcj9xg8] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.expand-icon[b-xqezcj9xg8] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.stok-card.expanded .expand-icon[b-xqezcj9xg8] {
    transform: rotate(180deg);
    color: #764ba2;
}

    .stok-card.expanded .expand-icon i[b-xqezcj9xg8] {
        transform: rotate(0deg);
    }

.card-meta-row[b-xqezcj9xg8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-xqezcj9xg8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-xqezcj9xg8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-xqezcj9xg8] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-xqezcj9xg8] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-xqezcj9xg8] {
    display: flex; /* yan yana dizmek için flex */
    justify-content: space-between; /* iki öğeyi uçlara yasla */
    gap: 8px; /* öğeler arası boşluk */
}

.quick-info-item[b-xqezcj9xg8] {
    background: var(--card-bg);
    padding: 6px 10px; /* biraz daha kompakt */
    border-radius: 12px;
    display: flex; /* içerik yan yana veya dikey için flex */
    flex-direction: column; /* label ve value dikey */
    gap: 2px;
    flex: 1; /* eşit genişlik */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    text-align: center; /* değerleri ortala */
}

    .quick-info-item:hover[b-xqezcj9xg8] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-xqezcj9xg8] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: start;
}

.quick-value[b-xqezcj9xg8] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-xqezcj9xg8] {
        color: #48bb78;
        background: var(--text-primary);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

/* ============================================
   AÇILIR İÇERİK
   ============================================ */
.card-content[b-xqezcj9xg8] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
    visibility: visible;
}

.stok-card.expanded .card-content[b-xqezcj9xg8] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    display: block;
    visibility: visible;
}

.info-row[b-xqezcj9xg8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-xqezcj9xg8] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-xqezcj9xg8] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-xqezcj9xg8] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-xqezcj9xg8] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-xqezcj9xg8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.action-btn[b-xqezcj9xg8] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    flex: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    position: relative;
    z-index: 11;
}

    .action-btn:active[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

.btn-primary[b-xqezcj9xg8] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-xqezcj9xg8] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-xqezcj9xg8] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-xqezcj9xg8] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-xqezcj9xg8] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-xqezcj9xg8] {
        background: #475569;
    }

/* ============================================
   RESPONSİVE TASARIM
   ============================================ */
@media (max-width: 360px) {
    .card-title[b-xqezcj9xg8] {
        font-size: 14px;
    }

    .card-quick-info[b-xqezcj9xg8] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-xqezcj9xg8] {
        padding: 10px;
    }

    .stok-card[b-xqezcj9xg8] {
        margin: 6px 10px;
    }

    .quick-value[b-xqezcj9xg8] {
        font-size: 15px;
    }

    .card-header-section[b-xqezcj9xg8] {
        padding: 8px;
    }
}

@media (min-width: 768px) {
    .search-card-container[b-xqezcj9xg8],
    .stok-card[b-xqezcj9xg8] {
        display: none !important;
    }
}

/* ============================================
   ANIMASYONLAR
   ============================================ */
@keyframes fadeIn-b-xqezcj9xg8 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-xqezcj9xg8] {
    animation: fadeIn-b-xqezcj9xg8 0.3s ease-out;
}

/* ============================================
   SCROLLBAR
   ============================================ */
@media (max-width: 767px) {
    [b-xqezcj9xg8]::-webkit-scrollbar {
        width: 6px;
    }

    [b-xqezcj9xg8]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-xqezcj9xg8]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-xqezcj9xg8]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }

    .dxbs-grid[b-xqezcj9xg8],
    .custom-grid[b-xqezcj9xg8] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    [data-bs-theme="dark"] .dxbs-grid[b-xqezcj9xg8],
    [data-bs-theme="dark"] .custom-grid[b-xqezcj9xg8] {
        background: #0f172a !important;
    }

    .dxbs-grid-header[b-xqezcj9xg8],
    .dxbs-grid-header-content[b-xqezcj9xg8],
    .dxbs-grid-header-panel[b-xqezcj9xg8],
    .dxbs-grid-filter-row[b-xqezcj9xg8],
    .dxbs-grid-command-column[b-xqezcj9xg8],
    .dxbs-grid-selection-column[b-xqezcj9xg8],
    .dxbs-grid-data-column[b-xqezcj9xg8],
    .dxbs-grid-table thead[b-xqezcj9xg8],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-xqezcj9xg8],
    .dxbs-grid-table > tbody > tr > th[b-xqezcj9xg8],
    .dxbs-grid-pager[b-xqezcj9xg8],
    .dxbs-grid-empty-data[b-xqezcj9xg8],
    .dxbs-grid-toolbar[b-xqezcj9xg8],
    .dxbs-grid-statusbar[b-xqezcj9xg8] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
    }

    .dxbs-grid-table[b-xqezcj9xg8],
    .dxbs-grid-table > tbody[b-xqezcj9xg8],
    .dxbs-grid-table > tbody > tr[b-xqezcj9xg8] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-xqezcj9xg8] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        position: relative !important;
        left: 0 !important;
    }

        .dxbs-grid-detail-cell > div[b-xqezcj9xg8],
        .dxbs-grid-detail-cell > *[b-xqezcj9xg8] {
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
}



@media (max-width: 991px) {
    .dxbs-grid[b-xqezcj9xg8] {
        background: transparent !important;
        border: none !important;
    }

    .dxbs-grid-header[b-xqezcj9xg8],
    .dxbs-grid-header-content[b-xqezcj9xg8],
    .dxbs-grid-filter-row[b-xqezcj9xg8],
    .dxbs-grid-command-column[b-xqezcj9xg8],
    .dxbs-grid-selection-column[b-xqezcj9xg8],
    .dxbs-grid-data-column[b-xqezcj9xg8],
    .dxbs-grid-table thead[b-xqezcj9xg8],
    .dxbs-grid-table > tbody > tr > td:not(.dxbs-grid-detail-cell)[b-xqezcj9xg8] {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    .dxbs-grid-table[b-xqezcj9xg8],
    .dxbs-grid-table > tbody[b-xqezcj9xg8],
    .dxbs-grid-table > tbody > tr[b-xqezcj9xg8] {
        display: block !important;
        width: 100% !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .dxbs-grid-detail-cell[b-xqezcj9xg8] {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    .custom-grid[b-xqezcj9xg8] {
        background: var(--info-row-bg) !important;
        border: none !important;
        padding: 0 !important;
    }
}

/* ============================================
   SABİT ARAMA KARTI - MOR ARKA PLAN
   ============================================ */
.search-card-container[b-xqezcj9xg8] {
    position: sticky;
    z-index: 100;
    padding: 12px;
    background: var(--card-bg);
    margin: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-card[b-xqezcj9xg8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

    .search-card:focus-within[b-xqezcj9xg8] {
        box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
        transform: translateY(-1px);
    }

.search-icon[b-xqezcj9xg8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-card:focus-within .search-icon[b-xqezcj9xg8] {
    color: white;
    transform: scale(1.1);
}

.search-input[b-xqezcj9xg8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-xqezcj9xg8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-xqezcj9xg8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-xqezcj9xg8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

/* ============================================
   MOBİL PAGINATION
   ============================================ */
/* Sabit footer container */
.pagination-footer[b-xqezcj9xg8] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    z-index: 9;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column; /* üst üste dizmek için */
    transition: transform 0.3s;
}

.fatura-list-container[b-xqezcj9xg8] {
    max-height: 80vh; /* scroll olması için */
    overflow-y: auto;
}

/* Üstteki sayfa numaraları */
.mobile-pagination[b-xqezcj9xg8] {
    padding: 7px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid var(--border-color); /* opsiyonel ayrım için */
}

/* Alttaki detaylar + select */
.pagination-details[b-xqezcj9xg8] {
    padding: 7px 11px;
    height: 110px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}




.pagination-btn[b-xqezcj9xg8] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-xqezcj9xg8] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-xqezcj9xg8] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.5;
        box-shadow: none;
    }

.pagination-info[b-xqezcj9xg8] {
    display: flex;
    align-items: center; /* hepsi dikeyde ortalanır */
    justify-content: center; /* yatayda hizalanır */
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    box-shadow: var(--shadow-sm);
    white-space: nowrap; /* alt satıra geçmeyi engeller */
    line-height: 1; /* yükseklik farklarını sıfırlar */
}

    .pagination-info span[b-xqezcj9xg8] {
        font-size: 11px;
        line-height: 1; /* tam hizalama için */
        display: flex;
        align-items: center; /* dikey ortalama */
    }

.current-page[b-xqezcj9xg8] {
    color: #667eea;
}

.separator[b-xqezcj9xg8] {
    color: var(--text-muted);
}

.total-pages[b-xqezcj9xg8] {
    color: var(--text-secondary);
}




.page-size-selector[b-xqezcj9xg8] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-xqezcj9xg8] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-xqezcj9xg8] {
        border-color: #667eea;
    }

.pagination-text[b-xqezcj9xg8] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    margin-top: 1vh;
    text-align: right;
}

.stok-card[b-xqezcj9xg8] {
    background: var(--card-bg);
    margin: 8px 12px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: 2px solid transparent;
    user-select: none;
    z-index: 1;
    position: relative;
    pointer-events: auto;
}

    .stok-card:hover[b-xqezcj9xg8] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
    }

    .stok-card.expanded[b-xqezcj9xg8] {
        border-color: #764ba2;
        box-shadow: 0 8px 24px rgba(102, 126, 234, 0.25);
    }

    .stok-card:active[b-xqezcj9xg8] {
        transform: scale(0.98);
    }

.card-header-section[b-xqezcj9xg8] {
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.card-title-row[b-xqezcj9xg8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.card-title[b-xqezcj9xg8] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    flex: 1;
    line-height: 1.3;
    padding-right: 8px;
}

.card-subtitle[b-xqezcj9xg8] {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    margin: 2px 0 0 0;
    line-height: 1.25;
    padding-right: 8px;
    display: block;
}


.expand-icon[b-xqezcj9xg8] {
    font-size: 22px;
    color: #667eea;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .expand-icon[b-xqezcj9xg8] {
    transform: rotate(180deg);
    color: #764ba2;
}

.card-meta-row[b-xqezcj9xg8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.card-code[b-xqezcj9xg8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--primary-gradient);
    color: white;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

.stock-badge[b-xqezcj9xg8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.stock-available[b-xqezcj9xg8] {
    background: var(--success-gradient);
    color: white;
}

.stock-out[b-xqezcj9xg8] {
    background: var(--danger-gradient);
    color: white;
}

.card-quick-info[b-xqezcj9xg8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.quick-info-item[b-xqezcj9xg8] {
    background: var(--card-bg);
    padding: 10px 12px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

    .quick-info-item:hover[b-xqezcj9xg8] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        transform: translateY(-1px);
    }

.quick-label[b-xqezcj9xg8] {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.quick-value[b-xqezcj9xg8] {
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 800;
}

    .quick-value.price[b-xqezcj9xg8] {
        color: #48bb78;
        background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

.card-content[b-xqezcj9xg8] {
    padding: 0 12px;
    background: var(--card-bg);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stok-card.expanded .card-content[b-xqezcj9xg8] {
    max-height: 2500px;
    opacity: 1;
    padding: 12px;
    margin-bottom: 10px;
}

.info-row[b-xqezcj9xg8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: var(--info-row-bg);
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

    .info-row:hover[b-xqezcj9xg8] {
        background: var(--border-color);
        transform: translateX(2px);
    }

.info-label[b-xqezcj9xg8] {
    font-size: 13px;
    color: var(--text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

    .info-label i[b-xqezcj9xg8] {
        color: #667eea;
        font-size: 16px;
    }

.info-value[b-xqezcj9xg8] {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
    flex-shrink: 0;
    margin-left: 8px;
}

.card-actions[b-xqezcj9xg8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}


.action-btn[b-xqezcj9xg8] {
    border: none;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

    .action-btn:active[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

.btn-primary[b-xqezcj9xg8] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .btn-primary:hover[b-xqezcj9xg8] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
        transform: translateY(-2px);
    }

.btn-secondary[b-xqezcj9xg8] {
    background: var(--border-color);
    color: var(--text-secondary);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

    .btn-secondary:hover[b-xqezcj9xg8] {
        background: #cbd5e0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
        transform: translateY(-2px);
    }

[data-bs-theme="dark"] .btn-secondary[b-xqezcj9xg8] {
    background: #334155;
    color: #cbd5e1;
}

    [data-bs-theme="dark"] .btn-secondary:hover[b-xqezcj9xg8] {
        background: #475569;
    }

@media (max-width: 360px) {
    .card-title[b-xqezcj9xg8] {
        font-size: 14px;
    }

    .card-quick-info[b-xqezcj9xg8] {
        grid-template-columns: 1fr;
    }

    .search-card-container[b-xqezcj9xg8] {
        padding: 10px;
    }

    .stok-card[b-xqezcj9xg8] {
        margin: 6px 10px;
    }

    .quick-value[b-xqezcj9xg8] {
        font-size: 15px;
    }

    .card-header-section[b-xqezcj9xg8] {
        padding: 10px;
    }
}

@media (min-width: 992px) {
    .search-card-container[b-xqezcj9xg8],
    .stok-card[b-xqezcj9xg8],
    .mobile-pagination[b-xqezcj9xg8],
    .pagination-details[b-xqezcj9xg8] {
        display: none !important;
    }
}

@keyframes fadeIn-b-xqezcj9xg8 {
    from {
        opacity: 0;
        search-card-container transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.stok-card[b-xqezcj9xg8] {
    animation: fadeIn-b-xqezcj9xg8 0.3s ease-out;
}

@media (max-width: 991px) {
    [b-xqezcj9xg8]::-webkit-scrollbar {
        width: 6px;
    }

    [b-xqezcj9xg8]::-webkit-scrollbar-track {
        background: var(--info-row-bg);
    }

    [b-xqezcj9xg8]::-webkit-scrollbar-thumb {
        background: var(--border-color);
        border-radius: 3px;
    }

        [b-xqezcj9xg8]::-webkit-scrollbar-thumb:hover {
            background: #667eea;
        }
}

.mobile-footer-fixed[b-xqezcj9xg8] {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    border-top: 1px solid var(--border-color) !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
}

.mobile-list-container[b-xqezcj9xg8] {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    background: #f7fafc;
    padding-bottom: 130px;
    position: relative;
    z-index: 1;
}

[data-bs-theme="dark"] .mobile-list-container[b-xqezcj9xg8] {
    background: #0f172a;
}

.pagination-btn[b-xqezcj9xg8] {
    background: var(--primary-gradient);
    border: none;
    width: 27px;
    height: 27px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

    .pagination-btn:hover:not(:disabled)[b-xqezcj9xg8] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .pagination-btn:active:not(:disabled)[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

    .pagination-btn:disabled[b-xqezcj9xg8] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        box-shadow: none;
        opacity: 0.5;
    }

.pagination-info[b-xqezcj9xg8] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--card-header-bg);
    padding: 6px 11px;
    border-radius: 7px;
    font-weight: 700;
    min-width: 60px;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}

.current-page[b-xqezcj9xg8] {
    font-size: 11px;
    color: #667eea;
}

.separator[b-xqezcj9xg8] {
    font-size: 10px;
    color: var(--text-muted);
}

.total-pages[b-xqezcj9xg8] {
    font-size: 10px;
    color: var(--text-secondary);
}

.page-size-selector[b-xqezcj9xg8] {
    background: var(--card-header-bg);
    border: 2px solid var(--border-color);
    padding: 5px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .page-size-selector:focus[b-xqezcj9xg8] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .page-size-selector:hover[b-xqezcj9xg8] {
        border-color: #667eea;
    }

.pagination-text[b-xqezcj9xg8] {
    font-size: 11px;
    color: var(--text-secondary);
    font-weight: 600;
    flex: 1;
    text-align: right;
}

.search-card[b-xqezcj9xg8] {
    position: relative;
    background: var(--search-bg);
    border-radius: 14px;
    padding: 12px 54px 12px 48px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
}

.search-icon[b-xqezcj9xg8] {
    position: absolute;
    left: 16px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 20px;
    transition: all 0.3s ease;
}

.search-input[b-xqezcj9xg8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: white;
    font-weight: 500;
}

    .search-input[b-xqezcj9xg8]::placeholder {
        color: rgba(255, 255, 255, 0.7);
    }

.search-clear[b-xqezcj9xg8] {
    position: absolute;
    right: 12px;
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 18px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

    .search-clear:hover[b-xqezcj9xg8] {
        background: linear-gradient(135deg, #f7931e 0%, #ff6b35 100%);
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(255, 107, 53, 0.6);
    }

    .search-clear:active[b-xqezcj9xg8] {
        transform: scale(0.95);
    }

#faturaContainer[b-xqezcj9xg8] {
    overflow-y: auto;
    height: calc(100vh - 150px);
}
/* _content/Client/Pages/Stok/StokKart/Stok_Resim.razor.rz.scp.css */
/* _content/Client/Pages/Stok/StokKartıMobil/StokKartMobil.razor.rz.scp.css */
/* ========================================
   STOK MOBİL COMPONENT STYLES
   ======================================== */

:root[b-4ngcfbyoh7] {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --success-gradient: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
    --danger-gradient: linear-gradient(135deg, #f56565 0%, #e53e3e 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --search-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(102, 126, 234, 0.2);
}

[data-bs-theme="dark"][b-4ngcfbyoh7] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* Container */
.stok-mobil-container[b-4ngcfbyoh7] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    background: var(--info-row-bg);
    overflow: hidden;
    position: relative;
}

/* ========================================
   HEADER SECTION
   ======================================== */
.stok-mobil-header[b-4ngcfbyoh7] {
    background: var(--primary-gradient);
    padding: 16px;
    padding-top: calc(env(safe-area-inset-top) + 16px);
    box-shadow: var(--shadow-md);
    position: relative;
    z-index: 10;
}

    .stok-mobil-header[b-4ngcfbyoh7]::after {
        content: '';
        position: absolute;
        bottom: -20px;
        left: 0;
        right: 0;
        height: 20px;
        background: var(--primary-gradient);
        border-radius: 0 0 50% 50% / 0 0 100% 100%;
    }

.header-content[b-4ngcfbyoh7] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.stok-image-wrapper[b-4ngcfbyoh7] {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    padding: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.stok-image[b-4ngcfbyoh7] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 12px;
    background: white;
}

.stok-info[b-4ngcfbyoh7] {
    flex: 1;
    min-width: 0;
    color: white;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ========================================
   EDITABLE HEADER INPUTS
   ======================================== */
.stok-kod-input[b-4ngcfbyoh7] {
    width: 100%;
    font-size: 12px;
    font-weight: 600;
    color: white;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 6px 10px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    transition: all 0.3s ease;
}

    .stok-kod-input[b-4ngcfbyoh7]::placeholder {
        color: rgba(255, 255, 255, 0.6);
    }

    .stok-kod-input:focus[b-4ngcfbyoh7] {
        outline: none;
        background: rgba(255, 255, 255, 0.25);
        border-color: rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1);
    }

.stok-adi-input[b-4ngcfbyoh7] {
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    color: white;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 8px 12px;
    transition: all 0.3s ease;
}

    .stok-adi-input[b-4ngcfbyoh7]::placeholder {
        color: rgba(255, 255, 255, 0.6);
    }

    .stok-adi-input:focus[b-4ngcfbyoh7] {
        outline: none;
        background: rgba(255, 255, 255, 0.25);
        border-color: rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.1);
    }

/* Durum Toggle Button */
.stok-durum-wrapper[b-4ngcfbyoh7] {
    display: flex;
    align-items: center;
}

.stok-durum-toggle[b-4ngcfbyoh7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 500;
    padding: 6px 12px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
}

    .stok-durum-toggle:hover[b-4ngcfbyoh7] {
        background: rgba(255, 255, 255, 0.3);
        transform: scale(1.05);
    }

    .stok-durum-toggle:active[b-4ngcfbyoh7] {
        transform: scale(0.98);
    }

    .stok-durum-toggle i[b-4ngcfbyoh7] {
        font-size: 8px;
        transition: all 0.3s ease;
    }

    .stok-durum-toggle.aktif[b-4ngcfbyoh7] {
        background: rgba(72, 187, 120, 0.3);
        border-color: rgba(72, 187, 120, 0.5);
    }

        .stok-durum-toggle.aktif i[b-4ngcfbyoh7] {
            color: #48bb78;
            animation: pulse-b-4ngcfbyoh7 2s ease-in-out infinite;
        }

    .stok-durum-toggle.pasif[b-4ngcfbyoh7] {
        background: rgba(245, 101, 101, 0.3);
        border-color: rgba(245, 101, 101, 0.5);
    }

        .stok-durum-toggle.pasif i[b-4ngcfbyoh7] {
            color: #f56565;
        }

@keyframes pulse-b-4ngcfbyoh7 {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.6;
        transform: scale(1.2);
    }
}

/* ========================================
   TAB NAVIGATION
   ======================================== */
.stok-mobil-tabs[b-4ngcfbyoh7] {
    background: var(--card-bg);
    padding: 8px 12px 0;
    margin-top: 12px;
    position: relative;
    z-index: 5;
    box-shadow: var(--shadow-sm);
}

.tabs-wrapper[b-4ngcfbyoh7] {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
}

    .tabs-wrapper[b-4ngcfbyoh7]::-webkit-scrollbar {
        display: none;
    }

.tab-item[b-4ngcfbyoh7] {
    flex: 1;
    min-width: 75px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 12px 8px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    border-radius: 12px 12px 0 0;
}

    .tab-item i[b-4ngcfbyoh7] {
        font-size: 18px;
        transition: all 0.3s ease;
    }

    .tab-item span[b-4ngcfbyoh7] {
        white-space: nowrap;
    }

    .tab-item[b-4ngcfbyoh7]::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 3px;
        background: var(--primary-gradient);
        border-radius: 3px 3px 0 0;
        transition: width 0.3s ease;
    }

    .tab-item:hover[b-4ngcfbyoh7] {
        color: var(--text-secondary);
        background: var(--info-row-bg);
    }

    .tab-item.active[b-4ngcfbyoh7] {
        color: #667eea;
        background: var(--info-row-bg);
    }

        .tab-item.active[b-4ngcfbyoh7]::after {
            width: 70%;
        }

        .tab-item.active i[b-4ngcfbyoh7] {
            transform: scale(1.1);
        }

/* ========================================
   TAB CONTENT AREA
   ======================================== */
.stok-mobil-content[b-4ngcfbyoh7] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--info-row-bg);
    position: relative;
    -webkit-overflow-scrolling: touch;
}

.tab-content-wrapper[b-4ngcfbyoh7] {
    min-height: 100%;
    padding-bottom: 100px;
}

.tab-pane[b-4ngcfbyoh7] {
    display: none;
    padding: 16px;
    animation: fadeIn-b-4ngcfbyoh7 0.3s ease;
}

    .tab-pane.active[b-4ngcfbyoh7] {
        display: block;
    }

@keyframes fadeIn-b-4ngcfbyoh7 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Empty Tab Content */
.empty-tab-content[b-4ngcfbyoh7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: var(--text-muted);
    text-align: center;
    gap: 12px;
}

    .empty-tab-content i[b-4ngcfbyoh7] {
        font-size: 48px;
        opacity: 0.5;
    }

    .empty-tab-content span[b-4ngcfbyoh7] {
        font-size: 14px;
    }

/* Loading Overlay */
.loading-overlay[b-4ngcfbyoh7] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--card-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.loading-spinner[b-4ngcfbyoh7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    color: var(--text-muted);
}

.spinner[b-4ngcfbyoh7] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border-color);
    border-top-color: #667eea;
    border-radius: 50%;
    animation: spin-b-4ngcfbyoh7 0.8s linear infinite;
}

@keyframes spin-b-4ngcfbyoh7 {
    to {
        transform: rotate(360deg);
    }
}

/* ========================================
   BOTTOM ACTION BAR
   ======================================== */
.stok-mobil-actions[b-4ngcfbyoh7] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    padding-bottom: calc(env(safe-area-inset-bottom) + 12px);
    background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.1);
    z-index: 100;
}

.action-btn[b-4ngcfbyoh7] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    border: none;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    min-height: 48px;
}

    .action-btn:disabled[b-4ngcfbyoh7] {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none !important;
    }

    .action-btn i[b-4ngcfbyoh7] {
        font-size: 16px;
    }

    .action-btn span[b-4ngcfbyoh7] {
        white-space: nowrap;
    }

/* Save Button */
.save-btn[b-4ngcfbyoh7] {
    flex: 2;
    background: var(--success-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(72, 187, 120, 0.3);
}

    .save-btn:not(:disabled):hover[b-4ngcfbyoh7] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(72, 187, 120, 0.4);
    }

    .save-btn:not(:disabled):active[b-4ngcfbyoh7] {
        transform: translateY(0);
    }

/* Delete Button */
.delete-btn[b-4ngcfbyoh7] {
    flex: 2;
    background: var(--danger-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(245, 101, 101, 0.3);
}

    .delete-btn:not(:disabled):hover[b-4ngcfbyoh7] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(245, 101, 101, 0.4);
    }

    .delete-btn:not(:disabled):active[b-4ngcfbyoh7] {
        transform: translateY(0);
    }

/* Info Button */
.info-btn[b-4ngcfbyoh7] {
    flex: 0 0 48px;
    background: var(--card-header-bg);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

    .info-btn:not(:disabled):hover[b-4ngcfbyoh7] {
        background: var(--primary-gradient);
        color: white;
        border-color: transparent;
    }

/* Close Button */
.close-btn[b-4ngcfbyoh7] {
    flex: 0 0 48px;
    background: var(--card-header-bg);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

    .close-btn:hover[b-4ngcfbyoh7] {
        background: var(--danger-gradient);
        color: white;
        border-color: transparent;
    }

/* ========================================
   FORM ELEMENTS (Generic Styling)
   ======================================== */
.stok-mobil-content .form-group[b-4ngcfbyoh7] {
    margin-bottom: 16px;
}

.stok-mobil-content .form-label[b-4ngcfbyoh7] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stok-mobil-content .form-control[b-4ngcfbyoh7] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
}

    .stok-mobil-content .form-control:focus[b-4ngcfbyoh7] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
    }

/* Card Styling for Tab Content */
.stok-mobil-content .mobile-card[b-4ngcfbyoh7] {
    background: var(--card-bg);
    border-radius: 16px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.stok-mobil-content .mobile-card-header[b-4ngcfbyoh7] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    gap: 8px;
}

    .stok-mobil-content .mobile-card-header i[b-4ngcfbyoh7] {
        color: #667eea;
    }

/* Info Row Styling */
.stok-mobil-content .info-row[b-4ngcfbyoh7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-color);
}

    .stok-mobil-content .info-row:last-child[b-4ngcfbyoh7] {
        border-bottom: none;
    }

.stok-mobil-content .info-label[b-4ngcfbyoh7] {
    font-size: 13px;
    color: var(--text-muted);
}

.stok-mobil-content .info-value[b-4ngcfbyoh7] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    text-align: right;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .stok-mobil-header[b-4ngcfbyoh7] {
        padding: 12px;
    }

    .stok-image-wrapper[b-4ngcfbyoh7] {
        width: 60px;
        height: 60px;
    }

    .stok-kod-input[b-4ngcfbyoh7] {
        font-size: 11px;
        padding: 5px 8px;
    }

    .stok-adi-input[b-4ngcfbyoh7] {
        font-size: 16px;
        padding: 7px 10px;
    }

    .stok-durum-toggle[b-4ngcfbyoh7] {
        font-size: 11px;
        padding: 5px 10px;
    }

    .tab-item[b-4ngcfbyoh7] {
        min-width: 65px;
        padding: 10px 6px;
    }

        .tab-item i[b-4ngcfbyoh7] {
            font-size: 16px;
        }

        .tab-item span[b-4ngcfbyoh7] {
            font-size: 10px;
        }

    .action-btn[b-4ngcfbyoh7] {
        padding: 10px 12px;
        font-size: 12px;
    }

        .action-btn span[b-4ngcfbyoh7] {
            display: none;
        }

    .save-btn span[b-4ngcfbyoh7],
    .delete-btn span[b-4ngcfbyoh7] {
        display: inline;
    }
}

@media (min-width: 576px) {
    .stok-mobil-container[b-4ngcfbyoh7] {
        max-width: 576px;
        margin: 0 auto;
    }

    .stok-mobil-actions[b-4ngcfbyoh7] {
        max-width: 576px;
        left: 50%;
        transform: translateX(-50%);
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .stok-mobil-header[b-4ngcfbyoh7] {
        padding: 10px 16px;
    }

        .stok-mobil-header[b-4ngcfbyoh7]::after {
            display: none;
        }

    .stok-image-wrapper[b-4ngcfbyoh7] {
        width: 50px;
        height: 50px;
    }

    .stok-kod-input[b-4ngcfbyoh7] {
        font-size: 11px;
    }

    .stok-adi-input[b-4ngcfbyoh7] {
        font-size: 14px;
    }

    .stok-mobil-tabs[b-4ngcfbyoh7] {
        margin-top: 0;
    }

    .tab-item[b-4ngcfbyoh7] {
        flex-direction: row;
        gap: 6px;
        padding: 8px 12px;
    }
}

/* Dark Mode Specific Overrides */
[data-bs-theme="dark"] .stok-image[b-4ngcfbyoh7] {
    background: #2d3748;
}

[data-bs-theme="dark"] .tab-item.active[b-4ngcfbyoh7] {
    color: #a78bfa;
}

[data-bs-theme="dark"] .spinner[b-4ngcfbyoh7] {
    border-top-color: #a78bfa;
}

[data-bs-theme="dark"] .stok-kod-input[b-4ngcfbyoh7],
[data-bs-theme="dark"] .stok-adi-input[b-4ngcfbyoh7] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.15);
}

    [data-bs-theme="dark"] .stok-kod-input:focus[b-4ngcfbyoh7],
    [data-bs-theme="dark"] .stok-adi-input:focus[b-4ngcfbyoh7] {
        background: rgba(255, 255, 255, 0.15);
        border-color: rgba(255, 255, 255, 0.3);
    }
/* _content/Client/Pages/Stok/StokKartıMobil/StokKartMobil_Birim.razor.rz.scp.css */
/* ========================================
   STOK MOBİL BİRİM TAB STYLES
   ======================================== */

:root[b-9yv9viltez] {
    --primary-color: #667eea;
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --input-focus-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
    --success-color: #48bb78;
    --danger-color: #f56565;
    --warning-color: #ed8936;
}

[data-bs-theme="dark"][b-9yv9viltez] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --input-focus-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}

/* ========================================
   MAIN CONTAINER
   ======================================== */
.mobil-birim-container[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    width: 100%;
}

/* ========================================
   MOBILE CARD COMPONENTS
   ======================================== */
.mobile-card[b-9yv9viltez] {
    background: var(--card-bg);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.mobile-card-header[b-9yv9viltez] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .mobile-card-header i[b-9yv9viltez] {
        color: var(--primary-color);
        font-size: 18px;
        flex-shrink: 0;
    }

    .mobile-card-header span[b-9yv9viltez] {
        flex: 1;
    }

.mobile-card-body[b-9yv9viltez] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

    .mobile-card-body.p-0[b-9yv9viltez] {
        padding: 0;
    }

/* ========================================
   HEADER ACTION BUTTON
   ======================================== */
.btn-header-action[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--primary-gradient);
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

    .btn-header-action:hover[b-9yv9viltez] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .btn-header-action:active[b-9yv9viltez] {
        transform: translateY(0);
    }

    .btn-header-action i[b-9yv9viltez] {
        font-size: 14px;
        color: white;
    }

/* ========================================
   EMPTY STATE
   ======================================== */
.empty-state[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: var(--text-muted);
    gap: 12px;
}

    .empty-state i[b-9yv9viltez] {
        font-size: 48px;
        opacity: 0.5;
    }

    .empty-state span[b-9yv9viltez] {
        font-size: 14px;
        text-align: center;
    }

/* ========================================
   BIRIM LIST
   ======================================== */
.birim-list[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
}

.birim-item[b-9yv9viltez] {
    border-bottom: 1px solid var(--border-color);
}

    .birim-item:last-child[b-9yv9viltez] {
        border-bottom: none;
    }

.birim-item-content[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    gap: 12px;
}

.birim-info[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.birim-name[b-9yv9viltez] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.birim-carpan[b-9yv9viltez] {
    font-size: 13px;
    color: var(--text-muted);
}

.birim-actions[b-9yv9viltez] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

/* ========================================
   BIRIM ACTION BUTTONS
   ======================================== */
.btn-birim-action[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .btn-birim-action.barkod-btn[b-9yv9viltez] {
        background: linear-gradient(135deg, #4299e1 0%, #3182ce 100%);
        color: white;
    }

    .btn-birim-action.delete-btn[b-9yv9viltez] {
        background: linear-gradient(135deg, #fc8181 0%, #f56565 100%);
        color: white;
    }

    .btn-birim-action.disabled[b-9yv9viltez] {
        background: var(--border-color);
        color: var(--text-muted);
        cursor: not-allowed;
        opacity: 0.6;
    }

    .btn-birim-action:not(.disabled):hover[b-9yv9viltez] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    }

    .btn-birim-action:not(.disabled):active[b-9yv9viltez] {
        transform: translateY(0);
    }

    .btn-birim-action i[b-9yv9viltez] {
        font-size: 16px;
    }

/* ========================================
   POPUP STYLES
   ======================================== */
.mobil-popup-content[b-9yv9viltez] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ========================================
   FORM GROUPS
   ======================================== */
.form-group-mobile[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label-mobile[b-9yv9viltez] {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

/* ========================================
   FORM CONTROLS
   ======================================== */
.form-control-mobile[b-9yv9viltez] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

    .form-control-mobile:focus[b-9yv9viltez] {
        outline: none;
        border-color: var(--primary-color);
        box-shadow: var(--input-focus-shadow);
    }

    .form-control-mobile:disabled[b-9yv9viltez] {
        opacity: 0.6;
        cursor: not-allowed;
        background: var(--info-row-bg);
    }

/* Select specific styling */
select.form-control-mobile[b-9yv9viltez] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23718096' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 12px;
    padding-right: 40px;
}

/* ========================================
   INPUT WITH BUTTON
   ======================================== */
.input-with-button[b-9yv9viltez] {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

    .input-with-button .form-control-mobile[b-9yv9viltez] {
        flex: 1;
    }

.btn-addon[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: auto;
    padding: 0 12px;
    background: var(--primary-gradient);
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

    .btn-addon:hover[b-9yv9viltez] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .btn-addon:active[b-9yv9viltez] {
        transform: translateY(0);
    }

    .btn-addon i[b-9yv9viltez] {
        font-size: 16px;
    }

/* ========================================
   CARPAN FORMULA
   ======================================== */
.carpan-formula[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    background: var(--info-row-bg);
    border-radius: 12px;
    flex-wrap: wrap;
}

.formula-item[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .formula-item.selected-birim[b-9yv9viltez],
    .formula-item.ana-birim[b-9yv9viltez] {
        padding: 8px 12px;
        background: var(--card-bg);
        border: 1px solid var(--border-color);
        border-radius: 8px;
        font-weight: 600;
        color: var(--text-primary);
        min-width: 60px;
    }

    .formula-item.equals[b-9yv9viltez] {
        font-size: 18px;
        font-weight: 700;
        color: var(--text-muted);
        padding: 0 4px;
    }

    .formula-item.operator[b-9yv9viltez] {
        min-width: 50px;
    }

        .formula-item.operator .operator-select[b-9yv9viltez] {
            width: 50px;
            padding: 8px;
            text-align: center;
            font-weight: 700;
            font-size: 16px;
        }

    .formula-item.carpan-input[b-9yv9viltez] {
        flex: 1;
        min-width: 80px;
        max-width: 120px;
    }

        .formula-item.carpan-input .form-control-mobile[b-9yv9viltez] {
            text-align: center;
            font-weight: 600;
        }

/* ========================================
   POPUP FOOTER
   ======================================== */
.popup-footer-mobile[b-9yv9viltez] {
    display: flex;
    gap: 12px;
    padding: 16px;
    border-top: 1px solid var(--border-color);
}

.popup-btn[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex: 1;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .popup-btn.cancel-btn[b-9yv9viltez] {
        background: var(--info-row-bg);
        color: var(--text-secondary);
        border: 1px solid var(--border-color);
    }

    .popup-btn.save-btn[b-9yv9viltez] {
        background: var(--primary-gradient);
        color: white;
    }

    .popup-btn.full-width[b-9yv9viltez] {
        width: 100%;
    }

    .popup-btn:hover[b-9yv9viltez] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }

    .popup-btn:active[b-9yv9viltez] {
        transform: translateY(0);
    }

/* ========================================
   BARKOD LIST HEADER
   ======================================== */
.barkod-list-header[b-9yv9viltez] {
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-color);
}

.add-barkod-btn[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    color: white;
    background: var(--primary-gradient);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .add-barkod-btn:hover[b-9yv9viltez] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .add-barkod-btn:active[b-9yv9viltez] {
        transform: translateY(0);
    }

/* ========================================
   BARKOD LIST
   ======================================== */
.barkod-list[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
    max-height: 40vh;
    overflow-y: auto;
}

.barkod-item[b-9yv9viltez] {
    border-bottom: 1px solid var(--border-color);
}

    .barkod-item:last-child[b-9yv9viltez] {
        border-bottom: none;
    }

    .barkod-item.editing[b-9yv9viltez] {
        background: var(--info-row-bg);
    }

.barkod-item-content[b-9yv9viltez] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    gap: 12px;
    cursor: pointer;
    transition: background 0.2s ease;
}

    .barkod-item-content:hover[b-9yv9viltez] {
        background: var(--info-row-bg);
    }

.barkod-info[b-9yv9viltez] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

.barkod-code[b-9yv9viltez] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
}

    .barkod-code i[b-9yv9viltez] {
        color: var(--primary-color);
        font-size: 16px;
    }

    .barkod-code span[b-9yv9viltez] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.barkod-details[b-9yv9viltez] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
}

.barkod-birim[b-9yv9viltez] {
    color: var(--text-muted);
    padding: 2px 8px;
    background: var(--info-row-bg);
    border-radius: 4px;
}

.barkod-fiyat[b-9yv9viltez] {
    color: var(--success-color);
    font-weight: 600;
}

.barkod-tip[b-9yv9viltez] {
    color: var(--text-muted);
}

/* ========================================
   BARKOD EDIT FORM
   ======================================== */
.barkod-edit-form[b-9yv9viltez] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.barkod-edit-actions[b-9yv9viltez] {
    display: flex;
    gap: 10px;
    margin-top: 8px;
}

    .barkod-edit-actions .popup-btn[b-9yv9viltez] {
        flex: 1;
        padding: 10px 14px;
        font-size: 13px;
    }

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .mobile-card-header[b-9yv9viltez] {
        padding: 12px 14px;
        font-size: 13px;
    }

        .mobile-card-header i[b-9yv9viltez] {
            font-size: 16px;
        }

    .btn-header-action[b-9yv9viltez] {
        width: 32px;
        height: 32px;
    }

    .birim-item-content[b-9yv9viltez] {
        padding: 12px 14px;
    }

    .birim-name[b-9yv9viltez] {
        font-size: 14px;
    }

    .birim-carpan[b-9yv9viltez] {
        font-size: 12px;
    }

    .btn-birim-action[b-9yv9viltez] {
        width: 36px;
        height: 36px;
    }

    .form-control-mobile[b-9yv9viltez] {
        padding: 10px 12px;
        font-size: 13px;
    }

    .form-label-mobile[b-9yv9viltez] {
        font-size: 10px;
    }

    .carpan-formula[b-9yv9viltez] {
        padding: 12px;
        gap: 6px;
    }

    .formula-item.selected-birim[b-9yv9viltez],
    .formula-item.ana-birim[b-9yv9viltez] {
        padding: 6px 10px;
        min-width: 50px;
        font-size: 13px;
    }

    .formula-item.carpan-input[b-9yv9viltez] {
        min-width: 60px;
        max-width: 100px;
    }
}

@media (min-width: 576px) {
    .mobil-birim-container[b-9yv9viltez] {
        padding: 0 8px;
    }

    .mobile-card[b-9yv9viltez] {
        border-radius: 20px;
    }

    .birim-item-content[b-9yv9viltez] {
        padding: 16px 20px;
    }

    .barkod-item-content[b-9yv9viltez] {
        padding: 16px 20px;
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .mobil-birim-container[b-9yv9viltez] {
        gap: 8px;
    }

    .mobile-card[b-9yv9viltez] {
        border-radius: 12px;
    }

    .mobile-card-header[b-9yv9viltez] {
        padding: 10px 14px;
    }

    .birim-item-content[b-9yv9viltez] {
        padding: 10px 14px;
    }

    .barkod-list[b-9yv9viltez] {
        max-height: 30vh;
    }

    .empty-state[b-9yv9viltez] {
        padding: 24px 16px;
    }

        .empty-state i[b-9yv9viltez] {
            font-size: 32px;
        }
}

/* ========================================
   DARK MODE OVERRIDES
   ======================================== */
[data-bs-theme="dark"] .mobile-card[b-9yv9viltez] {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .mobile-card-header[b-9yv9viltez] {
    background: var(--card-header-bg);
}

    [data-bs-theme="dark"] .mobile-card-header i[b-9yv9viltez] {
        color: #a78bfa;
    }

[data-bs-theme="dark"] .form-control-mobile[b-9yv9viltez] {
    background: var(--card-bg);
    color: var(--text-primary);
    border-color: var(--border-color);
}

    [data-bs-theme="dark"] .form-control-mobile:focus[b-9yv9viltez] {
        border-color: #a78bfa;
        box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15);
    }

[data-bs-theme="dark"] select.form-control-mobile[b-9yv9viltez] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2394a3b8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .btn-addon[b-9yv9viltez],
[data-bs-theme="dark"] .btn-header-action[b-9yv9viltez] {
    background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
}

[data-bs-theme="dark"] .carpan-formula[b-9yv9viltez] {
    background: var(--info-row-bg);
}

[data-bs-theme="dark"] .formula-item.selected-birim[b-9yv9viltez],
[data-bs-theme="dark"] .formula-item.ana-birim[b-9yv9viltez] {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .barkod-code i[b-9yv9viltez] {
    color: #a78bfa;
}

[data-bs-theme="dark"] .popup-btn.cancel-btn[b-9yv9viltez] {
    background: var(--info-row-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .popup-btn.save-btn[b-9yv9viltez],
[data-bs-theme="dark"] .add-barkod-btn[b-9yv9viltez] {
    background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
}

[data-bs-theme="dark"] .btn-birim-action.barkod-btn[b-9yv9viltez] {
    background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
}

[data-bs-theme="dark"] .btn-birim-action.delete-btn[b-9yv9viltez] {
    background: linear-gradient(135deg, #f87171 0%, #ef4444 100%);
}

/* ========================================
   ACCESSIBILITY
   ======================================== */
.form-control-mobile:focus-visible[b-9yv9viltez] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.btn-addon:focus-visible[b-9yv9viltez],
.btn-header-action:focus-visible[b-9yv9viltez],
.btn-birim-action:focus-visible[b-9yv9viltez],
.popup-btn:focus-visible[b-9yv9viltez],
.add-barkod-btn:focus-visible[b-9yv9viltez] {
    outline: 2px solid white;
    outline-offset: 2px;
}

/* ========================================
   TOUCH OPTIMIZATION
   ======================================== */
@media (hover: none) and (pointer: coarse) {
    .form-control-mobile[b-9yv9viltez],
    .btn-addon[b-9yv9viltez],
    .btn-header-action[b-9yv9viltez],
    .btn-birim-action[b-9yv9viltez],
    .popup-btn[b-9yv9viltez] {
        min-height: 44px;
    }

    .birim-item-content[b-9yv9viltez],
    .barkod-item-content[b-9yv9viltez] {
        min-height: 56px;
    }
}

/* ========================================
   SCROLLBAR STYLING
   ======================================== */
.barkod-list[b-9yv9viltez]::-webkit-scrollbar {
    width: 6px;
}

.barkod-list[b-9yv9viltez]::-webkit-scrollbar-track {
    background: var(--info-row-bg);
    border-radius: 3px;
}

.barkod-list[b-9yv9viltez]::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 3px;
}

    .barkod-list[b-9yv9viltez]::-webkit-scrollbar-thumb:hover {
        background: var(--text-muted);
    }
/* _content/Client/Pages/Stok/StokKartıMobil/StokKartMobil_Fiyat.razor.rz.scp.css */
/* ========================================
   STOK MOBİL GENEL TAB STYLES
   ======================================== */

:root[b-0f8ou42ozt] {
    --primary-color: #667eea;
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --input-focus-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

[data-bs-theme="dark"][b-0f8ou42ozt] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --input-focus-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}

/* ========================================
   MAIN CONTAINER
   ======================================== */
.mobil-genel-container[b-0f8ou42ozt] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    width: 100%;
}

/* ========================================
   MOBILE CARD COMPONENTS
   ======================================== */
.mobile-card[b-0f8ou42ozt] {
    background: var(--card-bg);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.mobile-card-header[b-0f8ou42ozt] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .mobile-card-header i[b-0f8ou42ozt] {
        color: var(--primary-color);
        font-size: 18px;
        flex-shrink: 0;
    }

    .mobile-card-header span[b-0f8ou42ozt] {
        flex: 1;
    }

.mobile-card-body[b-0f8ou42ozt] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ========================================
   FORM GROUPS
   ======================================== */
.form-group-mobile[b-0f8ou42ozt] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label-mobile[b-0f8ou42ozt] {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

/* ========================================
   FORM CONTROLS
   ======================================== */
.form-control-mobile[b-0f8ou42ozt] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

    .form-control-mobile:focus[b-0f8ou42ozt] {
        outline: none;
        border-color: var(--primary-color);
        box-shadow: var(--input-focus-shadow);
    }

    .form-control-mobile:disabled[b-0f8ou42ozt] {
        opacity: 0.6;
        cursor: not-allowed;
        background: var(--info-row-bg);
    }

/* Select specific styling */
select.form-control-mobile[b-0f8ou42ozt] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23718096' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 12px;
    padding-right: 40px;
}

/* ========================================
   INPUT WITH BUTTON
   ======================================== */
.input-with-button[b-0f8ou42ozt] {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

    .input-with-button .form-control-mobile[b-0f8ou42ozt] {
        flex: 1;
    }

.btn-addon[b-0f8ou42ozt] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: auto;
    padding: 0 12px;
    background: var(--primary-gradient);
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

    .btn-addon:hover[b-0f8ou42ozt] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .btn-addon:active[b-0f8ou42ozt] {
        transform: translateY(0);
    }

    .btn-addon i[b-0f8ou42ozt] {
        font-size: 16px;
    }

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .mobile-card-header[b-0f8ou42ozt] {
        padding: 12px 14px;
        font-size: 13px;
    }

        .mobile-card-header i[b-0f8ou42ozt] {
            font-size: 16px;
        }

    .mobile-card-body[b-0f8ou42ozt] {
        padding: 14px;
        gap: 14px;
    }

    .form-control-mobile[b-0f8ou42ozt] {
        padding: 10px 12px;
        font-size: 13px;
    }

    .form-label-mobile[b-0f8ou42ozt] {
        font-size: 10px;
    }

    .btn-addon[b-0f8ou42ozt] {
        min-width: 40px;
        padding: 0 10px;
    }
}

@media (min-width: 576px) {
    .mobil-genel-container[b-0f8ou42ozt] {
        padding: 0 8px;
    }

    .mobile-card[b-0f8ou42ozt] {
        border-radius: 20px;
    }

    .mobile-card-body[b-0f8ou42ozt] {
        padding: 20px;
        gap: 18px;
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .mobil-genel-container[b-0f8ou42ozt] {
        gap: 8px;
    }

    .mobile-card[b-0f8ou42ozt] {
        border-radius: 12px;
    }

    .mobile-card-header[b-0f8ou42ozt] {
        padding: 10px 14px;
    }

    .mobile-card-body[b-0f8ou42ozt] {
        padding: 12px;
        gap: 12px;
    }

    .form-control-mobile[b-0f8ou42ozt] {
        padding: 8px 12px;
    }

    .form-group-mobile[b-0f8ou42ozt] {
        gap: 6px;
    }
}

/* ========================================
   DARK MODE OVERRIDES
   ======================================== */
[data-bs-theme="dark"] .mobile-card[b-0f8ou42ozt] {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .mobile-card-header[b-0f8ou42ozt] {
    background: var(--card-header-bg);
}

    [data-bs-theme="dark"] .mobile-card-header i[b-0f8ou42ozt] {
        color: #a78bfa;
    }

[data-bs-theme="dark"] .form-control-mobile[b-0f8ou42ozt] {
    background: var(--card-bg);
    color: var(--text-primary);
    border-color: var(--border-color);
}

    [data-bs-theme="dark"] .form-control-mobile:focus[b-0f8ou42ozt] {
        border-color: #a78bfa;
        box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15);
    }

[data-bs-theme="dark"] select.form-control-mobile[b-0f8ou42ozt] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2394a3b8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .btn-addon[b-0f8ou42ozt] {
    background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
}

/* ========================================
   ACCESSIBILITY
   ======================================== */
.form-control-mobile:focus-visible[b-0f8ou42ozt] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.btn-addon:focus-visible[b-0f8ou42ozt] {
    outline: 2px solid white;
    outline-offset: 2px;
}

/* ========================================
   TOUCH OPTIMIZATION
   ======================================== */
@media (hover: none) and (pointer: coarse) {
    .form-control-mobile[b-0f8ou42ozt],
    .btn-addon[b-0f8ou42ozt] {
        min-height: 44px;
    }
}
/* _content/Client/Pages/Stok/StokKartıMobil/StokKartMobil_Genel.razor.rz.scp.css */
/* ========================================
   STOK MOBİL GENEL TAB STYLES
   ======================================== */

:root[b-tj7qv9lbsx] {
    --primary-color: #667eea;
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --card-bg: #ffffff;
    --card-header-bg: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --border-color: #e2e8f0;
    --info-row-bg: #f7fafc;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --input-focus-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

[data-bs-theme="dark"][b-tj7qv9lbsx] {
    --card-bg: #1e293b;
    --card-header-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --info-row-bg: #0f172a;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --input-focus-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}

/* ========================================
   MAIN CONTAINER
   ======================================== */
.mobil-genel-container[b-tj7qv9lbsx] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    width: 100%;
}

/* ========================================
   MOBILE CARD COMPONENTS
   ======================================== */
.mobile-card[b-tj7qv9lbsx] {
    background: var(--card-bg);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
}

.mobile-card-header[b-tj7qv9lbsx] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .mobile-card-header i[b-tj7qv9lbsx] {
        color: var(--primary-color);
        font-size: 18px;
        flex-shrink: 0;
    }

    .mobile-card-header span[b-tj7qv9lbsx] {
        flex: 1;
    }

.mobile-card-body[b-tj7qv9lbsx] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ========================================
   FORM GROUPS
   ======================================== */
.form-group-mobile[b-tj7qv9lbsx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label-mobile[b-tj7qv9lbsx] {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

/* ========================================
   FORM CONTROLS
   ======================================== */
.form-control-mobile[b-tj7qv9lbsx] {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    transition: all 0.3s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

    .form-control-mobile:focus[b-tj7qv9lbsx] {
        outline: none;
        border-color: var(--primary-color);
        box-shadow: var(--input-focus-shadow);
    }

    .form-control-mobile:disabled[b-tj7qv9lbsx] {
        opacity: 0.6;
        cursor: not-allowed;
        background: var(--info-row-bg);
    }

/* Select specific styling */
select.form-control-mobile[b-tj7qv9lbsx] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23718096' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 12px;
    padding-right: 40px;
}

/* ========================================
   INPUT WITH BUTTON
   ======================================== */
.input-with-button[b-tj7qv9lbsx] {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

    .input-with-button .form-control-mobile[b-tj7qv9lbsx] {
        flex: 1;
    }

.btn-addon[b-tj7qv9lbsx] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: auto;
    padding: 0 12px;
    background: var(--primary-gradient);
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

    .btn-addon:hover[b-tj7qv9lbsx] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

    .btn-addon:active[b-tj7qv9lbsx] {
        transform: translateY(0);
    }

    .btn-addon i[b-tj7qv9lbsx] {
        font-size: 16px;
    }

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 360px) {
    .mobile-card-header[b-tj7qv9lbsx] {
        padding: 12px 14px;
        font-size: 13px;
    }

        .mobile-card-header i[b-tj7qv9lbsx] {
            font-size: 16px;
        }

    .mobile-card-body[b-tj7qv9lbsx] {
        padding: 14px;
        gap: 14px;
    }

    .form-control-mobile[b-tj7qv9lbsx] {
        padding: 10px 12px;
        font-size: 13px;
    }

    .form-label-mobile[b-tj7qv9lbsx] {
        font-size: 10px;
    }

    .btn-addon[b-tj7qv9lbsx] {
        min-width: 40px;
        padding: 0 10px;
    }
}

@media (min-width: 576px) {
    .mobil-genel-container[b-tj7qv9lbsx] {
        padding: 0 8px;
    }

    .mobile-card[b-tj7qv9lbsx] {
        border-radius: 20px;
    }

    .mobile-card-body[b-tj7qv9lbsx] {
        padding: 20px;
        gap: 18px;
    }
}

/* Landscape Mode */
@media (max-height: 500px) and (orientation: landscape) {
    .mobil-genel-container[b-tj7qv9lbsx] {
        gap: 8px;
    }

    .mobile-card[b-tj7qv9lbsx] {
        border-radius: 12px;
    }

    .mobile-card-header[b-tj7qv9lbsx] {
        padding: 10px 14px;
    }

    .mobile-card-body[b-tj7qv9lbsx] {
        padding: 12px;
        gap: 12px;
    }

    .form-control-mobile[b-tj7qv9lbsx] {
        padding: 8px 12px;
    }

    .form-group-mobile[b-tj7qv9lbsx] {
        gap: 6px;
    }
}

/* ========================================
   DARK MODE OVERRIDES
   ======================================== */
[data-bs-theme="dark"] .mobile-card[b-tj7qv9lbsx] {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-bs-theme="dark"] .mobile-card-header[b-tj7qv9lbsx] {
    background: var(--card-header-bg);
}

    [data-bs-theme="dark"] .mobile-card-header i[b-tj7qv9lbsx] {
        color: #a78bfa;
    }

[data-bs-theme="dark"] .form-control-mobile[b-tj7qv9lbsx] {
    background: var(--card-bg);
    color: var(--text-primary);
    border-color: var(--border-color);
}

    [data-bs-theme="dark"] .form-control-mobile:focus[b-tj7qv9lbsx] {
        border-color: #a78bfa;
        box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15);
    }

[data-bs-theme="dark"] select.form-control-mobile[b-tj7qv9lbsx] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2394a3b8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .btn-addon[b-tj7qv9lbsx] {
    background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
}

/* ========================================
   ACCESSIBILITY
   ======================================== */
.form-control-mobile:focus-visible[b-tj7qv9lbsx] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.btn-addon:focus-visible[b-tj7qv9lbsx] {
    outline: 2px solid white;
    outline-offset: 2px;
}

/* ========================================
   TOUCH OPTIMIZATION
   ======================================== */
@media (hover: none) and (pointer: coarse) {
    .form-control-mobile[b-tj7qv9lbsx],
    .btn-addon[b-tj7qv9lbsx] {
        min-height: 44px;
    }
}
/* _content/Client/Pages/Stok/StokKartıMobil/StokKartMobil_HareketBilgisi.razor.rz.scp.css */
/* ============================================
   HAREKET MOBİL CONTAINER
   ============================================ */
.hareket-mobil-container[b-tfbhkv5bv6] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--card-bg);
}

/* ============================================
   HAREKET TABS
   ============================================ */
.hareket-tabs[b-tfbhkv5bv6] {
    display: flex;
    background: var(--card-header-bg);
    border-bottom: 2px solid var(--border-color);
    padding: 8px 12px;
    gap: 8px;
}

.hareket-tab[b-tfbhkv5bv6] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .hareket-tab i[b-tfbhkv5bv6] {
        font-size: 16px;
    }

    .hareket-tab:active[b-tfbhkv5bv6] {
        transform: scale(0.95);
    }

    .hareket-tab.active[b-tfbhkv5bv6] {
        background: var(--primary-gradient);
        color: white;
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
    }

/* ============================================
   FİLTRE SECTİON
   ============================================ */
.hareket-filter-section[b-tfbhkv5bv6] {
    padding: 12px;
    background: var(--info-row-bg);
    border-bottom: 1px solid var(--border-color);
}

.filter-row[b-tfbhkv5bv6] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.filter-item[b-tfbhkv5bv6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .filter-item.full-width[b-tfbhkv5bv6] {
        flex: 1 1 100%;
    }

.filter-label[b-tfbhkv5bv6] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

    .filter-label i[b-tfbhkv5bv6] {
        color: #667eea;
        font-size: 12px;
    }

.filter-input[b-tfbhkv5bv6],
.filter-select[b-tfbhkv5bv6] {
    width: 100%;
    padding: 8px 12px;
    border: 2px solid var(--border-color);
    border-radius: 8px;
    background: var(--card-bg);
    color: var(--text-primary);
    font-size: 13px;
    font-weight: 600;
    transition: all 0.2s ease;
}

    .filter-input:focus[b-tfbhkv5bv6],
    .filter-select:focus[b-tfbhkv5bv6] {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

.filter-actions[b-tfbhkv5bv6] {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.filter-btn[b-tfbhkv5bv6] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .filter-btn i[b-tfbhkv5bv6] {
        font-size: 14px;
    }

    .filter-btn:active[b-tfbhkv5bv6] {
        transform: scale(0.95);
    }

.search-btn[b-tfbhkv5bv6] {
    background: var(--primary-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

    .search-btn:hover[b-tfbhkv5bv6] {
        box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
    }

.report-btn[b-tfbhkv5bv6] {
    background: var(--success-gradient);
    color: white;
    box-shadow: 0 4px 12px rgba(72, 187, 120, 0.3);
}

    .report-btn:hover[b-tfbhkv5bv6] {
        box-shadow: 0 6px 16px rgba(72, 187, 120, 0.4);
    }

/* ============================================
   HAREKET CONTENT
   ============================================ */
.hareket-content[b-tfbhkv5bv6] {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
}

/* ============================================
   LOADING
   ============================================ */
.loading-container[b-tfbhkv5bv6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    gap: 12px;
}

    .loading-container span[b-tfbhkv5bv6] {
        font-size: 14px;
        font-weight: 600;
        color: var(--text-secondary);
    }

.spinner[b-tfbhkv5bv6] {
    width: 40px;
    height: 40px;
    border: 4px solid var(--border-color);
    border-top-color: #667eea;
    border-radius: 50%;
    animation: spin-b-tfbhkv5bv6 0.8s linear infinite;
}

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

/* ============================================
   HAREKET LIST & CARDS
   ============================================ */
.hareket-list[b-tfbhkv5bv6] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.hareket-card[b-tfbhkv5bv6] {
    background: var(--card-bg);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 2px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .hareket-card:active[b-tfbhkv5bv6] {
        transform: scale(0.98);
    }

    .hareket-card:hover[b-tfbhkv5bv6] {
        border-color: #667eea;
        box-shadow: var(--shadow-md);
    }

.hareket-card-header[b-tfbhkv5bv6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background: var(--card-header-bg);
    border-bottom: 1px solid var(--border-color);
}

.hareket-main-info[b-tfbhkv5bv6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.hareket-title[b-tfbhkv5bv6] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    line-height: 1.3;
}

.hareket-date[b-tfbhkv5bv6] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
}

    .hareket-date i[b-tfbhkv5bv6] {
        color: #667eea;
        font-size: 11px;
    }

.hareket-arrow[b-tfbhkv5bv6] {
    font-size: 18px;
    color: #667eea;
    transition: all 0.3s ease;
}

.hareket-card:hover .hareket-arrow[b-tfbhkv5bv6] {
    transform: translateX(4px);
}

.hareket-card-body[b-tfbhkv5bv6] {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.hareket-info-row[b-tfbhkv5bv6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 10px;
    background: var(--info-row-bg);
    border-radius: 8px;
    transition: all 0.2s ease;
}

    .hareket-info-row:hover[b-tfbhkv5bv6] {
        background: var(--border-color);
    }

.hareket-label[b-tfbhkv5bv6] {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
}

.hareket-value[b-tfbhkv5bv6] {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-primary);
    text-align: right;
}

    .hareket-value.highlight[b-tfbhkv5bv6] {
        color: #667eea;
        font-size: 14px;
    }

    .hareket-value.price[b-tfbhkv5bv6] {
        color: #48bb78;
        font-size: 14px;
    }
    .hareket-value.out[b-tfbhkv5bv6] {
        color: #f56565;
        font-size: 14px;
    }

/* ============================================
   EMPTY STATE
   ============================================ */
.empty-state[b-tfbhkv5bv6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
}

    .empty-state i[b-tfbhkv5bv6] {
        font-size: 64px;
        color: var(--text-muted);
        opacity: 0.5;
    }

    .empty-state p[b-tfbhkv5bv6] {
        font-size: 15px;
        font-weight: 600;
        color: var(--text-secondary);
        margin: 0;
    }

/* ============================================
   RESPONSİVE
   ============================================ */
@media (max-width: 360px) {
    .hareket-tab span[b-tfbhkv5bv6] {
        font-size: 11px;
    }

    .hareket-title[b-tfbhkv5bv6] {
        font-size: 14px;
    }

    .filter-btn span[b-tfbhkv5bv6] {
        display: none;
    }

    .filter-btn i[b-tfbhkv5bv6] {
        font-size: 16px;
    }
}

/* ============================================
   DARK MODE
   ============================================ */
[data-bs-theme="dark"] .hareket-mobil-container[b-tfbhkv5bv6] {
    background: #0f172a;
}

[data-bs-theme="dark"] .hareket-card[b-tfbhkv5bv6] {
    background: #1e293b;
}

[data-bs-theme="dark"] .hareket-card-header[b-tfbhkv5bv6] {
    background: #334155;
}

[data-bs-theme="dark"] .filter-input[b-tfbhkv5bv6],
[data-bs-theme="dark"] .filter-select[b-tfbhkv5bv6] {
    background: #1e293b;
    border-color: #334155;
}

    [data-bs-theme="dark"] .filter-input:focus[b-tfbhkv5bv6],
    [data-bs-theme="dark"] .filter-select:focus[b-tfbhkv5bv6] {
        border-color: #667eea;
    }

/* ============================================
   SCROLLBAR
   ============================================ */
.hareket-content[b-tfbhkv5bv6]::-webkit-scrollbar {
    width: 6px;
}

.hareket-content[b-tfbhkv5bv6]::-webkit-scrollbar-track {
    background: var(--info-row-bg);
}

.hareket-content[b-tfbhkv5bv6]::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 3px;
}

    .hareket-content[b-tfbhkv5bv6]::-webkit-scrollbar-thumb:hover {
        background: #667eea;
    }
/* _content/Client/Pages/Takvim.razor.rz.scp.css */
.dxbl-sc-tb-wrapper[b-8nzismxxur] {
    display: none !important;
}
/* _content/Client/Shared/MainLayout.razor.rz.scp.css */
.page[b-ocnk4r8tjs] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-ocnk4r8tjs] {
    flex: 1;
}

.sidebar[b-ocnk4r8tjs] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-ocnk4r8tjs] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-ocnk4r8tjs]  a, .top-row .btn-link[b-ocnk4r8tjs] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-ocnk4r8tjs] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-ocnk4r8tjs] {
        display: none;
    }

    .top-row.auth[b-ocnk4r8tjs] {
        justify-content: space-between;
    }

    .top-row a[b-ocnk4r8tjs], .top-row .btn-link[b-ocnk4r8tjs] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-ocnk4r8tjs] {
        flex-direction: row;
    }

    .sidebar[b-ocnk4r8tjs] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-ocnk4r8tjs] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row[b-ocnk4r8tjs], article[b-ocnk4r8tjs] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* _content/Client/Shared/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-kd1ih0s86n] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-kd1ih0s86n] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-kd1ih0s86n] {
    font-size: 1.1rem;
}

.oi[b-kd1ih0s86n] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.nav-item[b-kd1ih0s86n] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-kd1ih0s86n] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-kd1ih0s86n] {
        padding-bottom: 1rem;
    }

    .nav-item[b-kd1ih0s86n]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-kd1ih0s86n]  a.active {
    background-color: rgba(255,255,255,0.25);
    color: white;
}

.nav-item[b-kd1ih0s86n]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-kd1ih0s86n] {
        display: none;
    }

    .collapse[b-kd1ih0s86n] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
}