/* /Components/Common/LastSalesList.razor.rz.scp.css */
.sales-history-container[b-22tywj88yn] {
    max-height: 80vh;
    overflow-y: auto;
}

.sales-history-container .mud-card[b-22tywj88yn] {
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.sales-history-container .mud-card:hover[b-22tywj88yn] {
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.sales-history-container .mud-card-content[b-22tywj88yn] {
    padding: 16px;
}

.sales-history-container .mud-data-grid[b-22tywj88yn] {
    border-radius: 8px;
    overflow: hidden;
}

.sales-history-container .mud-data-grid .mud-table-head[b-22tywj88yn] {
    background-color: #f5f5f5;
    font-weight: 600;
}

.sales-history-container .mud-data-grid .mud-table-row:hover[b-22tywj88yn] {
    background-color: #f8f9fa;
    cursor: pointer;
}

.sales-history-container .mud-chip[b-22tywj88yn] {
    font-size: 0.75rem;
    font-weight: 500;
}

.sales-history-container .mud-select[b-22tywj88yn],
.sales-history-container .mud-date-picker[b-22tywj88yn] {
    margin-bottom: 8px;
}

.sales-history-container .mud-button[b-22tywj88yn] {
    border-radius: 8px;
    font-weight: 500;
    text-transform: none;
}

.sales-history-container .mud-button.mud-button-filled-primary[b-22tywj88yn] {
    background: linear-gradient(45deg, #2196F3 30%, #21CBF3 90%);
    box-shadow: 0 3px 5px 2px rgba(33, 203, 243, .3);
}

.sales-history-container .mud-button.mud-button-filled-primary:hover[b-22tywj88yn] {
    background: linear-gradient(45deg, #1976D2 30%, #1CB5E0 90%);
    box-shadow: 0 4px 8px 3px rgba(33, 203, 243, .4);
}

.sales-history-container .mud-icon[b-22tywj88yn] {
    margin-right: 8px;
}

.sales-history-container .mud-table[b-22tywj88yn] {
    border-radius: 8px;
    overflow: hidden;
}

.sales-history-container .mud-table-head .mud-table-cell[b-22tywj88yn] {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
}

.sales-history-container .mud-table-body .mud-table-row:nth-child(even)[b-22tywj88yn] {
    background-color: #f8f9fa;
}

.sales-history-container .mud-table-body .mud-table-row:hover[b-22tywj88yn] {
    background-color: #e3f2fd;
}

.sales-history-container .mud-divider[b-22tywj88yn] {
    margin: 16px 0;
    border-color: #e0e0e0;
}

.sales-history-container .mud-grid .mud-grid-item[b-22tywj88yn] {
    padding: 8px;
}

.sales-history-container .mud-text[b-22tywj88yn] {
    line-height: 1.5;
}

.sales-history-container .mud-text strong[b-22tywj88yn] {
    color: #333;
    font-weight: 600;
}

/* Responsive tasarım */
@media (max-width: 768px) {
    .sales-history-container[b-22tywj88yn] {
        max-height: 90vh;
        padding: 8px;
    }
    
    .sales-history-container .mud-card-content[b-22tywj88yn] {
        padding: 12px;
    }
    
    .sales-history-container .mud-data-grid[b-22tywj88yn] {
        font-size: 0.875rem;
    }
    
    .sales-history-container .mud-table[b-22tywj88yn] {
        font-size: 0.875rem;
    }
}

@media (max-width: 480px) {
    .sales-history-container .mud-grid .mud-grid-item[b-22tywj88yn] {
        padding: 4px;
    }
    
    .sales-history-container .mud-card-content[b-22tywj88yn] {
        padding: 8px;
    }
    
    .sales-history-container .mud-data-grid[b-22tywj88yn],
    .sales-history-container .mud-table[b-22tywj88yn] {
        font-size: 0.8rem;
    }
}

/* Loading animation */
.sales-history-container .mud-progress-circular[b-22tywj88yn] {
    margin: 20px auto;
    display: block;
}

/* Custom scrollbar */
.sales-history-container[b-22tywj88yn]::-webkit-scrollbar {
    width: 8px;
}

.sales-history-container[b-22tywj88yn]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.sales-history-container[b-22tywj88yn]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

.sales-history-container[b-22tywj88yn]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Dialog özelleştirmeleri */
[b-22tywj88yn] .mud-dialog {
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

[b-22tywj88yn] .mud-dialog-title {
    background: linear-gradient(45deg, #2196F3 30%, #21CBF3 90%);
    color: white;
    padding: 16px 24px;
    border-radius: 16px 16px 0 0;
}

[b-22tywj88yn] .mud-dialog-content {
    padding: 24px;
    max-height: 70vh;
    overflow-y: auto;
}

[b-22tywj88yn] .mud-dialog-actions {
    padding: 16px 24px;
    background-color: #f8f9fa;
    border-radius: 0 0 16px 16px;
    border-top: 1px solid #e0e0e0;
}

/* Kart animasyonları */
.sales-history-container .mud-card[b-22tywj88yn] {
    animation: fadeInUp-b-22tywj88yn 0.3s ease-out;
}

@keyframes fadeInUp-b-22tywj88yn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Özet kartları özelleştirmeleri */
.sales-history-container .mud-card .mud-icon[b-22tywj88yn] {
    margin-bottom: 8px;
}

.sales-history-container .mud-card .mud-text[b-22tywj88yn] {
    margin: 4px 0;
}

/* DataGrid özelleştirmeleri */
[b-22tywj88yn] .mud-data-grid .mud-table-container {
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

[b-22tywj88yn] .mud-data-grid .mud-table-head .mud-table-cell {
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    font-weight: 600;
    color: #495057;
}

[b-22tywj88yn] .mud-data-grid .mud-table-body .mud-table-row:hover {
    background-color: #e3f2fd;
    transition: background-color 0.2s ease;
}

/* Chip özelleştirmeleri */
.sales-history-container .mud-chip.mud-chip-color-success[b-22tywj88yn] {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.sales-history-container .mud-chip.mud-chip-color-warning[b-22tywj88yn] {
    background-color: #fff3cd;
    color: #856404;
    border: 1px solid #ffeaa7;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
body[b-xmgvl7knjf] {
    overflow-x: hidden;
    /* Yatay kaydırmayı engelle - beyaz şeridi kaldırır */
    background-color: #f8f9fa;
    /* Bootstrap bg-light rengi */
    width: 100vw;
    /* Tam genişlik - taşmaları önler */
    max-width: 100%;
    /* Ekranın sınırlarını aşmamasını sağlar */
    margin: 0;
    padding: 0;
}

.layout-container[b-xmgvl7knjf] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #f8f9fa;
    /* Bootstrap bg-light rengi */
}

.main-content[b-xmgvl7knjf] {
    margin-left: 210px;
    height: 100vh;
    overflow-y: auto;
    overflow-x: hidden;
    /* Yatay taşmayı engeller - beyaz şeridi kaldırır */
    background-color: #f8f9fa;
    /* Bootstrap bg-light rengi */
    transition: margin-left 0.2s ease-out;
    padding: 0;
    width: calc(100% - 210px);
    /* Tam genişlik ayarı */
    max-width: calc(100% - 210px);
    /* Taşmayı engeller */
    will-change: margin-left, width, max-width;
}

.content-wrapper[b-xmgvl7knjf] {
    width: 100%;
    padding: 0 0.75rem 0.75rem 0.75rem;
    background-color: #f8f9fa;
    /* Bootstrap bg-light rengi */
    min-height: 100vh;
    /* Optimizasyon: GPU hızlandırması ekleyelim */
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
    /* Akıcı geçiş için */
    transition: opacity 0.08s ease-out;
    will-change: opacity, transform;
}

/* Modal açıkken transform kaldır: position: fixed düzgün çalışsın */
body.modal-open-override .content-wrapper[b-xmgvl7knjf] {
    transform: none !important;
}

/* Modal açıkken içeriğin kaymasını engelle (opsiyonel) */
body.modal-open-override .main-content[b-xmgvl7knjf] {
    overflow: hidden !important;
}

.collapsed-content[b-xmgvl7knjf] {
    margin-left: 80px;
    width: calc(100% - 80px);
    max-width: calc(100% - 80px);
}

.sidebar[b-xmgvl7knjf] {
    width: 210px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #343a40;
    transition: all 0.3s ease;
    z-index: 1050;
    overflow-y: auto;
}

.sidebar.collapsed[b-xmgvl7knjf] {
    width: 80px;
}

.sidebar .brand[b-xmgvl7knjf] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    transition: all 0.3s ease;
}

.sidebar.collapsed .brand h4[b-xmgvl7knjf] {
    display: none;
}

.sidebar .menu-text[b-xmgvl7knjf] {
    display: inline;
}

.sidebar.collapsed .menu-text[b-xmgvl7knjf] {
    display: none;
}

.sidebar.collapsed .nav-link[b-xmgvl7knjf] {
    justify-content: center;
    text-align: center;
}

.sidebar.collapsed .nav-link i[b-xmgvl7knjf] {
    margin-right: 0;
}

.active-menu[b-xmgvl7knjf] {
    background-color: #007bff !important;
    color: white !important;
    font-weight: bold;
    border-radius: 5px;
}

.toggle-menu[b-xmgvl7knjf] {
    cursor: pointer;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.toggle-menu i[b-xmgvl7knjf] {
    transition: transform 0.3s ease;
    transform: rotate(0deg);
}

.sidebar.collapsed .toggle-menu i[b-xmgvl7knjf] {
    transform: rotate(-180deg);
}

.user-info[b-xmgvl7knjf],
.logout[b-xmgvl7knjf] {
    padding: 10px;
}

/* Skeleton UI stil ve animasyonları */
@keyframes pulse-b-xmgvl7knjf {
    0% {
        opacity: 0.6;
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 0.6;
    }
}

.skeleton-item[b-xmgvl7knjf] {
    animation: pulse-b-xmgvl7knjf 1.5s infinite ease-in-out;
    background-color: rgba(255, 255, 255, 0.15) !important;
}

.skeleton-bg-light[b-xmgvl7knjf] {
    background-color: rgba(200, 200, 200, 0.15) !important;
}

/* Sayfa geçişleri için fade efekti */
.fade-in[b-xmgvl7knjf] {
    animation: fadeIn-b-xmgvl7knjf 0.15s ease-out;
    will-change: opacity, transform;
}

@keyframes fadeIn-b-xmgvl7knjf {
    from {
        opacity: 0;
        transform: translateY(3px);
    }

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

/* === RESPONSIVE ÇÖZÜM === */
/* Özel 1366x768 çözünürlük optimizasyonu */
@media (max-width: 1366px) and (max-height: 768px) {
    .sidebar[b-xmgvl7knjf] {
        width: 160px !important;
        padding: 0 !important;
    }

    .main-content[b-xmgvl7knjf] {
        margin-left: 160px !important;
        width: calc(100% - 160px) !important;
        max-width: calc(100% - 160px) !important;
    }

    .sidebar.collapsed[b-xmgvl7knjf] {
        width: 50px !important;
    }

    .main-content.collapsed-content[b-xmgvl7knjf] {
        margin-left: 50px !important;
        width: calc(100% - 50px) !important;
        max-width: calc(100% - 50px) !important;
    }

    /* Brand area kompakt hale getir */
    .sidebar .brand[b-xmgvl7knjf] {
        height: 45px !important;
        padding: 0.5rem !important;
    }

    .sidebar .brand h4[b-xmgvl7knjf] {
        font-size: 0.9rem !important;
        margin: 0 !important;
    }

    /* Navigation linkler kompakt */
    .nav-link[b-xmgvl7knjf] {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.6rem !important;
        margin-bottom: 0.1rem !important;
        line-height: 1.2 !important;
    }

    .nav-link i[b-xmgvl7knjf] {
        font-size: 0.85rem !important;
        margin-right: 0.4rem !important;
    }

    /* Menu badge kompakt */
    .menu-badge[b-xmgvl7knjf] {
        font-size: 0.6rem !important;
        padding: 0.15rem 0.3rem !important;
    }

    /* User info area kompakt */
    .user-info[b-xmgvl7knjf] {
        padding: 0.5rem !important;
        font-size: 0.7rem !important;
    }

    .user-info p[b-xmgvl7knjf] {
        margin-bottom: 0.2rem !important;
    }

    /* Logout button kompakt */
    .logout[b-xmgvl7knjf] {
        padding: 0.5rem !important;
    }

    .logout .btn[b-xmgvl7knjf] {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.6rem !important;
    }

    /* Icon buttons area kompakt */
    .button-stack-container[b-xmgvl7knjf] {
        margin-bottom: 0 !important;
    }

    .icon-btn[b-xmgvl7knjf] {
        padding: 0.3rem 0.2rem !important;
        font-size: 0.8rem !important;
    }

    /* Toggle menu kompakt */
    .toggle-menu[b-xmgvl7knjf] {
        padding: 0.4rem !important;
    }

    /* Navigation list kompakt */
    .nav.flex-column[b-xmgvl7knjf] {
        padding-left: 0.3rem !important;
        padding-right: 0.3rem !important;
    }

    /* Scrollbar ince */
    .sidebar[b-xmgvl7knjf]::-webkit-scrollbar {
        width: 4px !important;
    }

    .sidebar[b-xmgvl7knjf]::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.3) !important;
        border-radius: 2px !important;
    }

    /* Collapsed state özel ayarları */
    .sidebar.collapsed .brand[b-xmgvl7knjf] {
        justify-content: center !important;
        padding: 0.3rem !important;
    }

    .sidebar.collapsed .nav-link[b-xmgvl7knjf] {
        justify-content: center !important;
        padding: 0.4rem 0.2rem !important;
    }

    .sidebar.collapsed .nav-link i[b-xmgvl7knjf] {
        margin-right: 0 !important;
    }

    .sidebar.collapsed .user-info[b-xmgvl7knjf] {
        text-align: center !important;
        padding: 0.3rem !important;
    }

    .sidebar.collapsed .user-info p[b-xmgvl7knjf] {
        font-size: 0.6rem !important;
        margin-bottom: 0.1rem !important;
    }

    .sidebar.collapsed .logout[b-xmgvl7knjf] {
        padding: 0.3rem !important;
    }

    .sidebar.collapsed .logout .btn[b-xmgvl7knjf] {
        padding: 0.3rem !important;
        font-size: 0 !important;
        /* Sadece icon görünsün */
    }

    .sidebar.collapsed .logout .btn i[b-xmgvl7knjf] {
        font-size: 0.8rem !important;
    }

    /* Icon menu button için özel stil */
    .sidebar.collapsed .icon-menu-btn[b-xmgvl7knjf] {
        padding: 0.3rem 0.4rem !important;
        font-size: 0.8rem !important;
    }
}

/* 1366px genel genişlik optimizasyonu (diğer yükseklikler için) */
@media (max-width: 1366px) and (min-height: 769px) {
    .sidebar[b-xmgvl7knjf] {
        width: 180px;
    }

    .main-content[b-xmgvl7knjf] {
        margin-left: 180px;
        width: calc(100% - 180px);
        max-width: calc(100% - 180px);
    }

    .sidebar.collapsed[b-xmgvl7knjf] {
        width: 60px;
    }

    .main-content.collapsed-content[b-xmgvl7knjf] {
        margin-left: 60px;
        width: calc(100% - 60px);
        max-width: calc(100% - 60px);
    }

    .nav-link[b-xmgvl7knjf] {
        font-size: 14px;
        padding: 6px 10px;
    }

    .nav-link i[b-xmgvl7knjf] {
        font-size: 16px;
    }

    .sidebar .brand h4[b-xmgvl7knjf] {
        font-size: 13px;
    }
}

/* 1280px altında sidebar daha da küçülür */
@media (max-width: 1280px) {
    .sidebar[b-xmgvl7knjf] {
        width: 160px;
    }

    .main-content[b-xmgvl7knjf] {
        margin-left: 160px;
    }

    .sidebar.collapsed[b-xmgvl7knjf] {
        width: 50px;
    }

    .main-content.collapsed-content[b-xmgvl7knjf] {
        margin-left: 50px;
    }

    .nav-link[b-xmgvl7knjf] {
        font-size: 13px;
        padding: 5px 8px;
    }

    .nav-link i[b-xmgvl7knjf] {
        font-size: 14px;
    }

    .sidebar .brand h4[b-xmgvl7knjf] {
        font-size: 12px;
    }
}

@media (max-width: 1200px) {
    .sidebar .nav-link[b-xmgvl7knjf] {
        padding: 0.5rem 0.75rem !important;
    }

    .sidebar .icon-btn[b-xmgvl7knjf] {
        padding: 0.4rem !important;
    }
}

/* 1024px altında sidebar daha da küçülür */
@media (max-width: 1024px) {
    .sidebar[b-xmgvl7knjf] {
        width: 140px;
    }

    .main-content[b-xmgvl7knjf] {
        margin-left: 140px;
    }

    .sidebar.collapsed[b-xmgvl7knjf] {
        width: 45px;
    }

    .main-content.collapsed-content[b-xmgvl7knjf] {
        margin-left: 45px;
    }

    .nav-link[b-xmgvl7knjf] {
        font-size: 12px;
        padding: 4px 6px;
    }

    .nav-link i[b-xmgvl7knjf] {
        font-size: 12px;
        margin-right: 5px;
    }

    .sidebar .brand h4[b-xmgvl7knjf] {
        font-size: 11px;
    }
}

/* 992px altında sidebar daha da küçülür */
@media (max-width: 992px) {
    .sidebar[b-xmgvl7knjf] {
        width: 120px;
    }

    .main-content[b-xmgvl7knjf] {
        margin-left: 120px;
    }

    .sidebar.collapsed[b-xmgvl7knjf] {
        width: 40px;
    }

    .main-content.collapsed-content[b-xmgvl7knjf] {
        margin-left: 40px;
    }

    .nav-link[b-xmgvl7knjf] {
        font-size: 11px;
        padding: 3px 5px;
    }

    .nav-link i[b-xmgvl7knjf] {
        font-size: 11px;
        margin-right: 4px;
    }

    .sidebar .brand h4[b-xmgvl7knjf] {
        font-size: 10px;
    }
}

/* 768px altında (mobil) sidebar gizlenir ve tam ekran içerik */
@media (max-width: 768px) {
    .sidebar[b-xmgvl7knjf] {
        display: none;
        /* Mobilde hiç gözükmez, Offcanvas kullanılır */
    }

    .main-content[b-xmgvl7knjf] {
        margin-left: 0;
        width: 100%;
        max-width: 100%;
    }

    .main-content.collapsed-content[b-xmgvl7knjf] {
        margin-left: 0;
        width: 100%;
        max-width: 100%;
    }

    .content-wrapper[b-xmgvl7knjf] {
        width: 100%;
        padding: 0 0.5rem 0.5rem 0.5rem;
    }

    html[b-xmgvl7knjf],
    body[b-xmgvl7knjf] {
        overflow-x: hidden;
        width: 100%;
        position: relative;
    }
}

/* Sayfa tipine göre özel stiller */
.content-wrapper.tablesales-page[b-xmgvl7knjf] {
    overflow-y: auto !important;
    /* Tablesales liste görünümünde kaydırma çubuğu olsun */
}

/* TableSales sayfası için dikey kaydırma çubuğu */
.content-wrapper.tablesales-page[b-xmgvl7knjf]::-webkit-scrollbar {
    width: 8px;
    /* Kaydırma çubuğu genişliği */
}

.content-wrapper.tablesales-page[b-xmgvl7knjf]::-webkit-scrollbar-track {
    background: #f1f1f1;
    /* Kaydırma çubuğu arka plan rengi */
    border-radius: 10px;
}

.content-wrapper.tablesales-page[b-xmgvl7knjf]::-webkit-scrollbar-thumb {
    background: #888;
    /* Kaydırma çubuğu rengi */
    border-radius: 10px;
}

.content-wrapper.tablesales-page[b-xmgvl7knjf]::-webkit-scrollbar-thumb:hover {
    background: #555;
    /* Kaydırma çubuğu hover rengi */
}

.content-wrapper.tablesales-page.sales-content[b-xmgvl7knjf] {
    overflow: hidden !important;
    /* SalesMode'da kaydırma çubuğu olmasın */
}

.content-wrapper.quicksales-page[b-xmgvl7knjf],
.content-wrapper.takeoutsales-page[b-xmgvl7knjf] {
    overflow: hidden !important;
    /* Bu sayfalar her zaman kaydırma çubuğu olmadan */
}

/* Sales mode'da scroll engelleme */
body.sales-mode[b-xmgvl7knjf] {
    overflow: hidden !important;
}

html.sales-mode[b-xmgvl7knjf] {
    overflow: hidden !important;
}

/* Mobil sidebar görünürlük kontrolü */
.offcanvas[b-xmgvl7knjf] {
    visibility: hidden;
    position: fixed;
    top: 0;
    left: 0;
    width: 75%;
    max-width: 300px;
    height: 100%;
    z-index: 1050;
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
}

.offcanvas.show[b-xmgvl7knjf] {
    visibility: visible;
    transform: translateX(0);
}

/* Mobil menü arka plan gölgesi */
.offcanvas-backdrop[b-xmgvl7knjf] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1049;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out;
}

.offcanvas-backdrop.show[b-xmgvl7knjf] {
    opacity: 1;
    visibility: visible;
}

/* Stok Yönetimi ve Cari Yönetimi sayfaları için özel stiller */
.content-wrapper.scrollable-page[b-xmgvl7knjf] {
    height: 100vh;
    overflow-y: auto !important;
    overflow-x: hidden;
    padding-bottom: 20px;
}

.content-wrapper.scrollable-page[b-xmgvl7knjf]::-webkit-scrollbar {
    width: 10px;
}

.content-wrapper.scrollable-page[b-xmgvl7knjf]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.content-wrapper.scrollable-page[b-xmgvl7knjf]::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}

.content-wrapper.scrollable-page[b-xmgvl7knjf]::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Stok Yönetimi sayfası için özel stil */
.content-wrapper.stock-page[b-xmgvl7knjf] {
    background-color: #f9f9f9;
}

/* Cari Yönetimi sayfası için özel stil */
.content-wrapper.account-page[b-xmgvl7knjf] {
    background-color: #f9f9f9;
}

/* QuickSales sayfası için özel düzenlemeler */
.content-wrapper.quicksales-page[b-xmgvl7knjf] {
    padding: 0;
    margin: 0;
    height: 100vh;
    max-height: 100vh;
    overflow: hidden;
}

.content-wrapper.quicksales-page .quicksale-container[b-xmgvl7knjf] {
    margin-left: 0;
    /* Önceki negatif değeri kaldırdık */
}

/* QuickSales sayfası için responsive düzenlemeler */
@media (max-width: 1366px) {
    .content-wrapper.quicksales-page .quicksale-container[b-xmgvl7knjf] {
        margin-left: 0;
        /* Küçük ekranlarda da margin'i sıfırla */
    }
}

/* ===== STYLES MOVED FROM MAINLAYOUT.RAZOR STYLE TAG ===== */

/* Hide all notification badges when notification panel is open */
.notification-panel~#global-badges-container[b-xmgvl7knjf],
.notification-panel~* span.badge:not(.badge-always-visible)[b-xmgvl7knjf],
.notification-panel~* .badge:not(.badge-always-visible)[b-xmgvl7knjf] {
    display: none !important;
}

/* Optimization to prevent scrollbars in sidebar */
.sidebar[b-xmgvl7knjf] {
    overflow-x: hidden !important;
}

/* Yeni icon butonu stacking sistemi için stiller */
.button-stack-container[b-xmgvl7knjf] {
    position: relative;
    z-index: 10000;
}

/* Icon ve badge'in içinde yer alacağı konteyner */
.icon-stack[b-xmgvl7knjf] {
    position: relative;
}

/* Badge wrapper'ı - her zaman üstte görünecek */
.icon-badge-wrapper[b-xmgvl7knjf] {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 99999 !important;
    transform: translate(25%, -25%);
    pointer-events: none;
}

/* Satış sayfalarında badge'ler en üstte kalacak */
.sales-page .icon-badge-wrapper[b-xmgvl7knjf],
.sales-mode .icon-badge-wrapper[b-xmgvl7knjf],
body[url*="/sales/"] .icon-badge-wrapper[b-xmgvl7knjf] {
    z-index: 9999999 !important;
    position: absolute !important;
}

/* İkon butonları */
.icon-btn[b-xmgvl7knjf] {
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color 0.2s;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    overflow: visible !important;
    /* Badge'lerin dışarı çıkmasına izin ver */
}

/* Notification source icon styling */
.notification-source-icon[b-xmgvl7knjf] {
    width: 28px !important;
    height: 28px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.5));
}

/* Notification icon container centered */
.notification-icon[b-xmgvl7knjf] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-width: 40px !important;
    min-height: 40px !important;
}

/* Sidebar içindeki butonlar için daha dar stil */
.sidebar .icon-btn[b-xmgvl7knjf] {
    font-size: 0.9rem;
    padding: 0.375rem 0.25rem !important;
}

/* Badge'lerin daha uygun şekilde hizalanması */
.sidebar .icon-badge-wrapper[b-xmgvl7knjf] {
    right: -5px;
}

/* Badge'ler için yeni stil - her zaman görünür olacak */
.badge[b-xmgvl7knjf] {
    z-index: 9999999 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Butonların içindeki badge'ler - Bootstrap translate-middle sınıfını override et */
.icon-btn .badge.translate-middle[b-xmgvl7knjf] {
    transform: translate(-25%, -25%) !important;
}

/* Sidebar genişliğinin badge taşmasını engelleme */
.sidebar[b-xmgvl7knjf] {
    overflow: visible !important;
}

.icon-btn.active[b-xmgvl7knjf] {
    background-color: #0d6efd !important;
}

/* Sidebar genel stili - üst katmanda kalacak */
.sidebar[b-xmgvl7knjf] {
    z-index: 1050;
}

/* Satış sayfaları için özel stiller */
body[url*="/sales/"] .button-stack-container[b-xmgvl7knjf] {
    z-index: 9999995 !important;
}

body[url*="/sales/"] .icon-badge-wrapper[b-xmgvl7knjf] {
    z-index: 9999999 !important;
}

/* Diğer satış sayfaları ve bileşenlerin görünürlüğünü sağla */
.main-content.sales-mode[b-xmgvl7knjf] {
    z-index: 1 !important;
    /* Ana içerik düşük kalırken, sidebar yüksek */
}

/* Absolute positioned badges */
.badge-absolute-container[b-xmgvl7knjf] {
    position: absolute !important;
    z-index: 9999999 !important;
}

/* Badge to always be visible */
.badge-always-visible[b-xmgvl7knjf] {
    z-index: 9999999 !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 0.65rem !important;
    padding: 0.25em 0.5em !important;
}

/* Sales pages need extra high z-index on all badges */
body[url*="/sales/"] .badge-always-visible[b-xmgvl7knjf],
.sales-page .badge-always-visible[b-xmgvl7knjf],
.sales-mode .badge-always-visible[b-xmgvl7knjf] {
    z-index: 9999999 !important;
    position: relative !important;
}

/* Bildirim kaynağı ikonları için stiller */
.notification-source-icon[b-xmgvl7knjf] {
    object-fit: contain;
    max-width: 100%;
    max-height: 100%;
    border-radius: 50%;
    background-color: white;
    padding: 2px;
}

/* Notification source text */
.notification-source[b-xmgvl7knjf] {
    font-size: 0.7rem;
    opacity: 0.7;
    font-style: italic;
}

/* Bildirim geçmişi paneli için stiller */
.notification-history-panel[b-xmgvl7knjf] {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5) !important;
    border-width: 2px !important;
    max-height: 80vh !important;
    overflow-y: auto !important;
}

/* Arama alanı için özel stil */
.notification-history-panel .input-group-sm input[b-xmgvl7knjf] {
    background-color: rgba(33, 37, 41, 0.8) !important;
}

/* Arama alanı odaklandığında */
.notification-history-panel .input-group-sm input:focus[b-xmgvl7knjf] {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    border-color: #86b7fe;
}

/* Layout container styles */
.layout-container[b-xmgvl7knjf] {
    height: 100vh;
    display: flex;
    overflow: hidden;
}

/* Fix for TableSales blank screen issue */
.table-sales-container[b-xmgvl7knjf] {
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* When container is empty, show a loading indicator */
.table-sales-container:empty[b-xmgvl7knjf]::before {
    content: "Yükleniyor...";
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    font-size: 1.5rem;
    color: #666;
}
/* /Components/Pages/AccountManagement/AddAccount.razor.rz.scp.css */
body[b-55ed8p73c1] {
}
/* /Components/Pages/AccountManagement/Index.razor.rz.scp.css */
.dashboard-card[b-tbg7kx3muu] {
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    border: 1px solid #ddd;
    border-radius: 10px;
}

    .dashboard-card:hover[b-tbg7kx3muu] {
        transform: scale(1.05);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    }

    .dashboard-card .card-body i[b-tbg7kx3muu] {
        color: #007bff;
    }

    .dashboard-card .card-body h5[b-tbg7kx3muu] {
        margin: 0;
        font-size: 1.25rem;
        font-weight: bold;
    }
/* /Components/Pages/Dashboard/Home.razor.rz.scp.css */
/* General Page Styles */
body[b-1hnnpfz9ei] {
    background-color: #f0f2f5; /* Light gray background for the page */
    color: #333;
}

.dashboard-container-fluid[b-1hnnpfz9ei] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.dashboard-header h1 i[b-1hnnpfz9ei] {
    vertical-align: middle;
}

.dashboard-header p[b-1hnnpfz9ei] {
    font-size: 1.1rem;
    color: #555;
}

.dashboard-header[b-1hnnpfz9ei] {
    text-align: left;
    margin-bottom: 2rem; /* Increased margin for more separation after header */
    padding-bottom: 0.5rem;  /* Adjusted padding, border removed */
    /* border-bottom: 1px solid #dee2e6; */ /* Removed border */
}

/* 1366x768 Dashboard Optimizasyonu - Düzen korunarak sadece boyut küçültme */
@media (max-width: 1366px) and (max-height: 768px) {
    /* Ana container'ı biraz küçült */
    .dashboard-container-fluid[b-1hnnpfz9ei] {
        padding: 2.5rem !important;
    }
    
    /* Dashboard header'ı hafifçe küçült */
    .dashboard-header[b-1hnnpfz9ei] {
        margin-bottom: 1.5rem !important;
    }
    
    .dashboard-header h2[b-1hnnpfz9ei] {
        font-size: 1.8rem !important;
    }
    
    .dashboard-header p[b-1hnnpfz9ei] {
        font-size: 1rem !important;
    }
    
    /* Quick stat kartları - boyut korunarak küçültme */
    .quick-stats .card-body[b-1hnnpfz9ei] {
        padding: 1rem !important;
    }
    
    .quick-stats .card-body i[b-1hnnpfz9ei] {
        font-size: 2.5rem !important;
    }
    
    .quick-stats .card-title[b-1hnnpfz9ei] {
        font-size: 1rem !important;
    }
    
    .quick-stats .card-text.fs-4[b-1hnnpfz9ei] {
        font-size: 1.4rem !important;
    }
    
    /* Buton gruplarını daha çok küçült - sığması için */
    .quick-stats .btn-group-sm .btn[b-1hnnpfz9ei] {
        font-size: 0.65rem !important;
        padding: 0.15rem 0.35rem !important;
        line-height: 1.2 !important;
    }
    
    /* Buton grup container'ını optimize et */
    .quick-stats .btn-group[b-1hnnpfz9ei] {
        width: 100% !important;
        display: flex !important;
    }
    
    .quick-stats .btn-group .btn[b-1hnnpfz9ei] {
        flex: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    
    /* Chart yüksekliklerini hafifçe azalt */
    .mud-chart[b-1hnnpfz9ei] {
        height: 250px !important;
        max-height: 250px !important;
    }
    
    /* Chart container'ı için hafif küçültme */
    .card-body > div[style*="height: 300px"][b-1hnnpfz9ei] {
        height: 250px !important;
    }
    
    .card-body > div > div[style*="height: 300px"][b-1hnnpfz9ei] {
        height: 250px !important;
    }
    
    /* Loading state'leri hafifçe küçült */
    div[style*="height: 300px"][style*="background: #f8f9fa"][b-1hnnpfz9ei] {
        height: 250px !important;
    }
    
    /* Top products listesi - hafif küçültme */
    .list-group-item[b-1hnnpfz9ei] {
        padding: 0.6rem 0.8rem !important;
        font-size: 0.9rem !important;
    }
    
    .list-group-item .badge[b-1hnnpfz9ei] {
        font-size: 0.8rem !important;
    }
    
    /* Order stats text'leri */
    .col-md-6 p[b-1hnnpfz9ei] {
        font-size: 0.9rem !important;
    }
    
    /* Donut chart hafif küçültme */
    .col-md-6 > div[style*="200px"][b-1hnnpfz9ei] {
        width: 180px !important;
        height: 180px !important;
    }
    
    /* Son hareketler hafif küçültme */
    .recent-activity-list[b-1hnnpfz9ei] {
        max-height: 300px !important;
    }
    
    .recent-activity-list .list-group-item[b-1hnnpfz9ei] {
        padding: 0.4rem 0.5rem !important;
    }
    
    .recent-activity-list .list-group-item h6[b-1hnnpfz9ei] {
        font-size: 0.85rem !important;
    }
    
    .recent-activity-list .list-group-item p[b-1hnnpfz9ei] {
        font-size: 0.8rem !important;
    }
    
    /* Chart buton grupları */
    .card-header .btn-group-sm .btn[b-1hnnpfz9ei] {
        font-size: 0.75rem !important;
        padding: 0.25rem 0.6rem !important;
    }
    
    /* Icon boyutları hafif küçültme */
    .card-header i[b-1hnnpfz9ei] {
        font-size: 1rem !important;
    }
}

/* Card Styles */
.card[b-1hnnpfz9ei] {
    border: none; /* Remove default card border */
    border-radius: 0.75rem; /* Softer rounded corners */
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.card:hover[b-1hnnpfz9ei] {
    transform: translateY(-5px); /* Slight lift on hover */
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15) !important; /* Enhanced shadow on hover */
}

.card-header[b-1hnnpfz9ei] {
    background-color: #ffffff; /* Cleaner card header */
    border-bottom: 1px solid #e9ecef; /* Subtle border for header */
    font-weight: 600;
}

.card-header .card-title i[b-1hnnpfz9ei] {
    margin-right: 0.5rem;
}

/* Quick Stats Card Specific Styles */
.bg-primary[b-1hnnpfz9ei] {
    background-color: #007bff !important;
}

.bg-success[b-1hnnpfz9ei] {
    background-color: #28a745 !important;
}

.bg-info[b-1hnnpfz9ei] {
    background-color: #17a2b8 !important;
}

.bg-warning[b-1hnnpfz9ei] {
    background-color: #ffc107 !important;
    color: #212529 !important; /* Darker text for yellow background */
}

.bg-secondary[b-1hnnpfz9ei] {
    background-color: #6c757d !important;
}

.bg-danger[b-1hnnpfz9ei] {
    background-color: #dc3545 !important;
}

.text-white .card-title[b-1hnnpfz9ei],
.text-white .card-text[b-1hnnpfz9ei] {
    color: #fff !important;
}

.text-white i[b-1hnnpfz9ei] {
    color: rgba(255, 255, 255, 0.8);
}

/* Animation for Quick Stat Cards */
.card-hover-animation i[b-1hnnpfz9ei] {
    transition: transform 0.3s ease;
}

.card-hover-animation:hover i[b-1hnnpfz9ei] {
    transform: scale(1.1);
}

/* List Group for Top Products */
.list-group-item[b-1hnnpfz9ei] {
    border-color: #e9ecef; /* Match card header border */
}

.list-group-item .badge[b-1hnnpfz9ei] {
    font-size: 0.9em;
}

/* Button Styles */
.btn-outline-danger[b-1hnnpfz9ei] {
    transition: all 0.3s ease;
}

.btn-outline-danger:hover[b-1hnnpfz9ei] {
    background-color: #dc3545;
    color: #fff;
}

/* Placeholder Styles */
.chart-placeholder[b-1hnnpfz9ei] {
    height: 300px;
    background: #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    color: #6c757d;
    font-style: italic;
}

.order-type-chart-placeholder[b-1hnnpfz9ei] {
    height: 150px;
    background: #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1rem;
    border-radius: 0.5rem;
    color: #6c757d;
    font-style: italic;
}

/* Custom color for Peak Hours icon */
.text-purple[b-1hnnpfz9ei] {
    color: #6f42c1 !important; /* Bootstrap purple */
}

/* Recent Activity List Styles */
.recent-activity-list .list-group-item[b-1hnnpfz9ei] {
    border-left: 0;
    border-right: 0;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.recent-activity-list .list-group-item:first-child[b-1hnnpfz9ei] {
    border-top: 0;
}

.recent-activity-list .list-group-item:last-child[b-1hnnpfz9ei] {
    border-bottom: 0;
}

.recent-activity-list h6 i[b-1hnnpfz9ei] {
    font-size: 1.1em;
}

/* Animation for stat cards */
.stat-value-wrapper[b-1hnnpfz9ei] {
    min-height: 2.5em; /* Adjust based on fs-4 font size, approx 1.5rem * 1.2 line-height + some buffer */
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; /* Needed if you ever want to overlay text during transition */
    overflow: hidden; /* Prevents text from briefly appearing outside card during fast clicks if not positioned absolutely */
}

.card-text-animated[b-1hnnpfz9ei] {
    margin-bottom: 0; /* Override default paragraph margin */
    /* Common styling for the animated text can go here if needed */
}

.card-text-animated.slide-fade-out[b-1hnnpfz9ei] {
    animation: slideFadeOutEffect-b-1hnnpfz9ei 0.3s ease-out forwards;
}

.card-text-animated.slide-fade-in[b-1hnnpfz9ei] {
    animation: slideFadeInEffect-b-1hnnpfz9ei 0.3s ease-in forwards;
}

@keyframes slideFadeOutEffect-b-1hnnpfz9ei {
    from { opacity: 1; transform: translateX(0); }
    to { opacity: 0; transform: translateX(-20px); }
}

@keyframes slideFadeInEffect-b-1hnnpfz9ei {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

/* Responsive Adjustments - Retaining existing media queries and building upon them */

/* Original dashboard-container, header, widgets, widget, widget-header, widget-content styles are removed as the new structure is different.
   If any specific styles from those are needed for other components, they should be managed separately. */

/* 6-card layout responsive adjustments */
@media (max-width: 1399px) { /* xl breakpoint */
    .quick-stats .col-xl-2[b-1hnnpfz9ei] {
        flex: 0 0 auto;
        width: 16.666667%; /* 6 cards per row on xl screens */
    }
}

@media (max-width: 1199px) { /* lg breakpoint */
    .quick-stats .col-lg-4[b-1hnnpfz9ei] {
        flex: 0 0 auto;
        width: 33.333333%; /* 3 cards per row on lg screens */
    }
}

@media (max-width: 991px) { /* md breakpoint */
    .quick-stats .col-md-6[b-1hnnpfz9ei] {
        flex: 0 0 auto;
        width: 50%; /* 2 cards per row on md screens */
    }
}

@media (max-width: 767px) { /* sm breakpoint */
    .quick-stats .col-md-6[b-1hnnpfz9ei] {
        flex: 0 0 auto;
        width: 100%; /* 1 card per row on sm screens */
    }
}

/* Small screens (tablets, 1366px and below might be too large, adjusting to Bootstrap breakpoints) */
@media (max-width: 992px) { /* lg breakpoint */
    .dashboard-header h1[b-1hnnpfz9ei] {
        font-size: 2.2rem;
    }
    .dashboard-header p[b-1hnnpfz9ei] {
        font-size: 1rem;
    }
    .display-4[b-1hnnpfz9ei] {
        font-size: 2.8rem;
    }
}

/* Extra small screens (phones, 768px and below) */
@media (max-width: 768px) { /* md breakpoint */
    .dashboard-header h1[b-1hnnpfz9ei] {
        font-size: 1.8rem;
    }
    .dashboard-header p[b-1hnnpfz9ei] {
        font-size: 0.9rem;
    }
    .display-4[b-1hnnpfz9ei] {
        font-size: 2.2rem;
    }
    .quick-stats .col-lg-3[b-1hnnpfz9ei] {
        margin-bottom: 1rem; /* Add some space between stacked cards */
    }
    .card-body p[b-1hnnpfz9ei],
    .card-body .fs-4[b-1hnnpfz9ei] {
        font-size: 1.1rem !important; /* Adjust font sizes for readability */
    }
    .card-body h5[b-1hnnpfz9ei] {
        font-size: 1rem;
    }
    .list-group-item[b-1hnnpfz9ei] {
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) { /* sm breakpoint */
    .dashboard-container-fluid[b-1hnnpfz9ei] {
        padding: 1rem !important; /* Reduce padding on very small screens */
    }
    .display-4[b-1hnnpfz9ei] {
        font-size: 2rem;
    }
     .card-body .fs-4[b-1hnnpfz9ei] {
        font-size: 1rem !important;
    }
}

/* MudBlazor Chart Customizations */
.mud-chart[b-1hnnpfz9ei] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.mud-chart-legend[b-1hnnpfz9ei] {
    font-size: 0.875rem;
    margin-top: 1rem;
}

.mud-chart-legend-item[b-1hnnpfz9ei] {
    margin-right: 1rem;
    margin-bottom: 0.5rem;
}

/* Chart container responsive adjustments */
@media (max-width: 768px) {
    .mud-chart[b-1hnnpfz9ei] {
        font-size: 0.8rem;
    }
    
    .mud-chart-legend[b-1hnnpfz9ei] {
        font-size: 0.75rem;
    }
}

/* Custom chart colors to match dashboard theme */
.chart-primary[b-1hnnpfz9ei] { color: #007bff; }
.chart-success[b-1hnnpfz9ei] { color: #28a745; }
.chart-info[b-1hnnpfz9ei] { color: #17a2b8; }
.chart-warning[b-1hnnpfz9ei] { color: #ffc107; }
.chart-danger[b-1hnnpfz9ei] { color: #dc3545; }

/* Loading state for charts */
.chart-loading[b-1hnnpfz9ei] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    background: #f8f9fa;
    border-radius: 0.5rem;
    color: #6c757d;
    font-style: italic;
}

.chart-loading i[b-1hnnpfz9ei] {
    font-size: 2rem;
    margin-bottom: 0.5rem;
    opacity: 0.7;
}

/* Chart button groups */
.chart-controls[b-1hnnpfz9ei] {
    margin-bottom: 1rem;
}

.chart-controls .btn-group-sm .btn[b-1hnnpfz9ei] {
    font-size: 0.8rem;
    padding: 0.25rem 0.75rem;
}

/* Peak Hours Chart specific styling */
.peak-hours-chart[b-1hnnpfz9ei] {
    font-size: 0.9rem;
}

.peak-hours-chart .mud-chart-legend[b-1hnnpfz9ei] {
    display: none; /* Tek seri olduğu için legend'ı gizle */
}

/* Recent Activity compact styling */
.recent-activity-list .list-group-item[b-1hnnpfz9ei] {
    padding: 0.5rem 0.25rem;
}

.recent-activity-list .list-group-item h6[b-1hnnpfz9ei] {
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.recent-activity-list .list-group-item p[b-1hnnpfz9ei] {
    font-size: 0.8rem;
    margin-bottom: 0;
}

/* Responsive adjustments for new layout */
@media (max-width: 992px) {
    .peak-hours-chart[b-1hnnpfz9ei] {
        font-size: 0.8rem;
    }
    
    .recent-activity-list .list-group-item h6[b-1hnnpfz9ei] {
        font-size: 0.85rem;
    }
    
    .recent-activity-list .list-group-item p[b-1hnnpfz9ei] {
        font-size: 0.75rem;
    }
}
/* /Components/Pages/Login/LoginPage.razor.rz.scp.css */
/* site.css veya benzeri global CSS dosyanıza ekleyin */
input[type=password][b-u397jg3uq7]::-ms-reveal,
input[type=password][b-u397jg3uq7]::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

/* 1366x768 Login Page Optimizasyonu - Düzen korunarak sadece boyut küçültme */
@media (max-width: 1366px) and (max-height: 768px) {
    /* Logo görsellerini biraz küçült */
    .d-none.d-md-flex.col-md-3.bg-light img[b-u397jg3uq7] {
        max-width: 90% !important;
        max-height: 90% !important;
    }
    
    /* PIN/Şifre label'ını küçült */
    .mb-3.w-100.text-center label.fw-bold.fs-5[b-u397jg3uq7] {
        font-size: 1.25rem !important;
    }
    
    /* Password input'u küçült */
    input.form-control.fs-5.fw-bold[b-u397jg3uq7] {
        font-size: 1.3rem !important;
        height: 45px !important;
        max-width: 280px !important;
    }
    
    /* Keypad container'ını küçült */
    .row.gx-2.gy-2[b-u397jg3uq7] {
        max-width: 280px !important;
    }
    
    /* Keypad butonlarını küçült - düzen aynı kalacak */
    .row.gx-2.gy-2 .btn[b-u397jg3uq7] {
        font-size: 1.6rem !important;
        padding: 0.7rem 0.5rem !important;
        height: 55px !important;
    }
    
    /* Giriş butonu */
    .col-12.mt-2 .btn.btn-success[b-u397jg3uq7] {
        font-size: 1.3rem !important;
        height: 55px !important;
    }
    
    /* Sil butonu */
    .col-8 .btn.btn-danger[b-u397jg3uq7] {
        font-size: 1.3rem !important;
        height: 55px !important;
    }
    
    /* Terminal IP text'i */
    .mt-4 small.text-muted[b-u397jg3uq7] {
        font-size: 0.85rem !important;
    }
    
    /* Error message */
    .mt-3.text-danger.fw-bold.fs-5[b-u397jg3uq7] {
        font-size: 1.1rem !important;
    }
    
    /* Modal optimizasyonu */
    .modal-dialog.modal-dialog-centered.modal-lg[b-u397jg3uq7] {
        max-width: 550px !important;
    }
    
    .modal-content.shadow-lg.rounded-4.p-4[b-u397jg3uq7] {
        padding: 2rem !important;
    }
    
    .modal-header.bg-danger.text-white h4.modal-title[b-u397jg3uq7] {
        font-size: 1.4rem !important;
    }
    
    .modal-body i.bi.bi-exclamation-triangle.display-3[b-u397jg3uq7] {
        font-size: 3.5rem !important;
    }
    
    .modal-body p.fs-4.fw-bold[b-u397jg3uq7] {
        font-size: 1.2rem !important;
    }
}
/* /Components/Pages/NotificationTest.razor.rz.scp.css */
/* Toast Mesajı */
.toast-message[b-8iah8e6717] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    animation: fadeInOut 3s ease-in-out;
}

.toast-success[b-8iah8e6717] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-8iah8e6717] {
    background-color: #dc3545; /* Kırmızı */
}
/* /Components/Pages/Reporting/Index.razor.rz.scp.css */
.reporting-header[b-uqyfwora73] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.reporting-buttons[b-uqyfwora73] {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 2rem;
}

.report-btn[b-uqyfwora73] {
    background: #007bff;
    color: #fff;
    border: none;
    border-radius: 0.7rem;
    padding: 0.5rem 1.2rem;
    font-size: 0.98rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

    .report-btn:hover[b-uqyfwora73] {
        background: #2563eb;
    }

.reporting-cards-row[b-uqyfwora73] {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
}

.report-card-medium[b-uqyfwora73] {
    background: #fff;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 1.5rem 2rem;
    min-width: 260px;
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transition: box-shadow 0.2s, transform 0.2s;
}

.skeleton-card[b-uqyfwora73] {
    height: 80px;
    background: linear-gradient(90deg, #ececec 25%, #f3f3f3 50%, #ececec 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-uqyfwora73 1.2s infinite linear;
    border-radius: 0.7rem;
    width: 100%;
}

@keyframes skeleton-loading-b-uqyfwora73 {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.xreport-summary[b-uqyfwora73] {
    font-size: 1.1rem;
    line-height: 2.2;
}

.icon-area[b-uqyfwora73] {
    font-size: 2.2rem;
    color: #4f8cff;
    margin-bottom: 0.7rem;
}

.report-divider[b-uqyfwora73] {
    border-bottom: 2px solid #e0e0e0;
    margin: 0 0 1.2rem 0;
}

.reporting-filters[b-uqyfwora73] {
    display: flex;
    gap: 1.2rem;
    margin-bottom: 1.2rem;
    align-items: center;
}

.filter-btn[b-uqyfwora73] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #f4f6fa;
    border-radius: 0.7rem;
    padding: 0.3rem 1.1rem 0.3rem 0.7rem;
    font-size: 1rem;
    font-weight: 500;
    color: #333;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}

.switch[b-uqyfwora73] {
    position: relative;
    display: inline-block;
    width: 34px;
    height: 18px;
}

    .switch input[b-uqyfwora73] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider[b-uqyfwora73] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    border-radius: 18px;
    transition: .4s;
}

.switch input:checked + .slider[b-uqyfwora73] {
    background-color: #4f8cff;
}

.slider[b-uqyfwora73]:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    border-radius: 50%;
    transition: .4s;
}

.switch input:checked + .slider[b-uqyfwora73]:before {
    transform: translateX(16px);
}

.open-tables-info[b-uqyfwora73] {
    margin-top: 1.2rem;
    font-size: 1.05rem;
    color: #007bff;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.totals-row[b-uqyfwora73] {
    display: flex;
    justify-content: center;
    gap: 0.5rem 0.8rem;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.total-card[b-uqyfwora73] {
    background: #fff;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 0.8rem 0.8rem 1rem 0.8rem;
    min-width: 120px;
    max-width: 170px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: box-shadow 0.2s, transform 0.2s;
    margin-bottom: 0.5rem;
}

.total-icon[b-uqyfwora73] {
    font-size: 2.5rem;
    margin-bottom: 0.7rem;
}

.total-title[b-uqyfwora73] {
    font-size: 1.01rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #333;
}

.total-amount[b-uqyfwora73] {
    font-size: 1.15rem;
    font-weight: bold;
    color: #222;
}

.detail-card[b-uqyfwora73] {
    background: #fff;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 0.8rem 0.8rem 1rem 0.8rem;
    margin-top: 0.5rem;
    min-width: 320px;
    max-width: 380px;
}

.sold-products-card[b-uqyfwora73] {
    background: #fff;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 0.8rem 0.8rem 1rem 0.8rem;
    margin-top: 0.5rem;
    min-width: 320px;
    max-width: 380px;
    height: 530px; /* Sol kartla aynı boyut */
    display: flex;
    flex-direction: column;
}

.detail-title[b-uqyfwora73] {
    font-size: 1.01rem;
    font-weight: 600;
    margin-bottom: 1.1rem;
    color: #333;
    text-align: center;
}

.detail-row[b-uqyfwora73] {
    display: flex;
    justify-content: space-between;
    font-size: 0.97rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid #f0f0f0;
}

    .detail-row:last-child[b-uqyfwora73] {
        border-bottom: none;
    }

.breakdown-row.excluded[b-uqyfwora73] {
    text-decoration: line-through;
    opacity: 0.5;
    cursor: pointer;
}

.breakdown-row[b-uqyfwora73] {
    cursor: pointer;
    transition: background 0.15s;
}

    .breakdown-row:hover[b-uqyfwora73] {
        background: #f4f6fa;
    }

.sold-products-table[b-uqyfwora73] {
    border-collapse: separate;
    border-spacing: 0 0.35rem;
    width: 100%;
}

.sold-products-container[b-uqyfwora73] {
    flex: 1;
    overflow-y: auto;
    padding-right: 0.2rem;
    margin-bottom: 0.5rem;
}

.sold-products-total-row[b-uqyfwora73] {
    border-top: 2px solid #eee;
    padding-top: 0.5rem;
    margin-top: 0.5rem;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sold-products-container[b-uqyfwora73]::-webkit-scrollbar {
    width: 6px;
}

.sold-products-container[b-uqyfwora73]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.sold-products-container[b-uqyfwora73]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.sold-products-container[b-uqyfwora73]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

.sold-products-th[b-uqyfwora73] {
    font-weight: 700;
    font-size: 1.07rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #e0e0e0;
    background: #f8fafc;
}

.sold-products-row[b-uqyfwora73] {
    background: #f9f9fb;
    border-radius: 0.5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.03);
    border-bottom: 1px solid #ececec;
    transition: background 0.15s;
}

    .sold-products-row td[b-uqyfwora73] {
        padding: 0.45rem 0.5rem;
    }

    .sold-products-row:hover[b-uqyfwora73] {
        background: #f1f5fa;
    }

.sold-products-qty[b-uqyfwora73] {
    padding-right: 2.2rem !important;
}

.sold-products-total[b-uqyfwora73] {
    padding-left: 1.2rem !important;
}

.takeout-platform-card[b-uqyfwora73] {
    min-width: 120px;
    max-width: 150px;
    padding: 0.7rem 0.7rem 1rem 0.7rem;
    align-items: center;
    text-align: center;
    font-size: 0.97rem;
}

.totals-row[b-uqyfwora73] {
    gap: 0.5rem 0.8rem;
}

.detail-card[b-uqyfwora73], .total-card[b-uqyfwora73] {
    min-width: 120px;
    max-width: 170px;
    padding: 0.8rem 0.8rem 1rem 0.8rem;
    font-size: 0.97rem;
}

.total-title[b-uqyfwora73], .detail-title[b-uqyfwora73] {
    font-size: 1.01rem;
}

.total-amount[b-uqyfwora73] {
    font-size: 1.15rem;
}

.detail-row[b-uqyfwora73], .sold-products-row td[b-uqyfwora73] {
    font-size: 0.97rem;
}

.detail-card-colored-header[b-uqyfwora73] {
    border-top: 4px solid transparent; /* Başlangıçta transparan */
}

/* Kart Detayları Özet Stilleri */
.card-details-summary[b-uqyfwora73] {
    animation: slideIn-b-uqyfwora73 0.3s ease-out;
}

@keyframes slideIn-b-uqyfwora73 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.card-type-section[b-uqyfwora73] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card-type-section:hover[b-uqyfwora73] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.15) !important;
}

.card-item[b-uqyfwora73] {
    transition: background-color 0.15s ease;
}

.card-item:hover[b-uqyfwora73] {
    background-color: rgba(255,255,255,0.1) !important;
    border-radius: 5px;
}

@media (max-width: 1200px) {
    .takeout-platform-card[b-uqyfwora73], .detail-card[b-uqyfwora73], .total-card[b-uqyfwora73] {
        min-width: 100px;
        max-width: 120px;
    }

    .totals-row[b-uqyfwora73] {
        gap: 0.4rem 0.6rem;
        justify-content: flex-start;
    }

    /* Tablet için kart detayları */
    .card-details-summary[b-uqyfwora73] {
        max-width: 500px !important;
    }
    
    .card-type-section[b-uqyfwora73] {
        min-width: 220px !important;
    }
}

@media (max-width: 900px) {
    .takeout-platform-card[b-uqyfwora73], .detail-card[b-uqyfwora73], .total-card[b-uqyfwora73] {
        min-width: 90px;
        max-width: 100%;
    }

    .totals-row[b-uqyfwora73] {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    /* Kart detayları mobil responsive */
    .card-details-content[b-uqyfwora73] {
        flex-direction: column !important;
        gap: 1rem !important;
    }
    
    .card-type-section[b-uqyfwora73] {
        min-width: 100% !important;
        max-width: 100% !important;
    }
}

.takeout-flex-row[b-uqyfwora73] {
    justify-content: space-between !important;
    gap: 0.7rem 0 !important;
}

.takeout-platform-card-mini[b-uqyfwora73] {
    width: 15%;
    min-width: 140px;
    max-width: 220px;
    padding: 0.8rem 0.7rem 1rem 0.7rem;
    align-items: center;
    text-align: center;
    font-size: 1.01rem;
    box-sizing: border-box;
}

@media (max-width: 1200px) {
    .takeout-platform-card-mini[b-uqyfwora73] {
        width: 30%;
        min-width: 120px;
        max-width: 100%;
        font-size: 0.97rem;
    }

    .takeout-flex-row[b-uqyfwora73] {
        flex-wrap: wrap;
        gap: 0.5rem 0;
    }
    
    /* Tablet için sidebar boyutu */
    .card-details-summary-sidebar[b-uqyfwora73] {
        min-width: 220px;
        max-width: 250px;
    }
    
    .card-details-summary-sidebar .card-type-section[b-uqyfwora73] {
        min-width: 200px !important;
    }
}

@media (max-width: 900px) {
    .takeout-platform-card-mini[b-uqyfwora73] {
        width: 48%;
        min-width: 100px;
        max-width: 100%;
        font-size: 0.95rem;
    }

    .takeout-flex-row[b-uqyfwora73] {
        flex-wrap: wrap;
    }
    
    /* Mobilde sidebar'ı üste taşı */
    .card-details-summary-sidebar[b-uqyfwora73] {
        min-width: 100%;
        max-width: 100%;
        margin-bottom: 1rem;
    }
    
    .card-details-summary-sidebar .card-details-content[b-uqyfwora73] {
        flex-direction: row !important;
        gap: 0.8rem !important;
    }
    
    .card-details-summary-sidebar .card-type-section[b-uqyfwora73] {
        min-width: 180px !important;
        flex: 1;
    }
}

/* Kart toggle icon stilleri */
.card-toggle-icon[b-uqyfwora73] {
    transition: all 0.2s ease;
}

.card-toggle-icon:hover[b-uqyfwora73] {
    color: #0056b3 !important;
    transform: scale(1.2);
}

/* Kart Detayları Sidebar Stilleri */
.card-details-summary-sidebar[b-uqyfwora73] {
    background: #fff;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 0.8rem;
    min-width: 240px;
    max-width: 280px;
    animation: slideInLeft-b-uqyfwora73 0.3s ease-out;
}

@keyframes slideInLeft-b-uqyfwora73 {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.card-details-summary-sidebar .card-type-section[b-uqyfwora73] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card-details-summary-sidebar .card-type-section:hover[b-uqyfwora73] {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.15) !important;
}

.card-details-summary-sidebar .card-item[b-uqyfwora73] {
    transition: background-color 0.15s ease;
}

.card-details-summary-sidebar .card-item:hover[b-uqyfwora73] {
    background-color: rgba(255,255,255,0.1) !important;
    border-radius: 4px;
}

/* Modern Payment Cards */
.modern-payment-card[b-uqyfwora73] {
    background: linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%);
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.modern-payment-card[b-uqyfwora73]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #007bff 0%, #6610f2 100%);
}

.modern-payment-card.credit-card[b-uqyfwora73]::before {
    background: linear-gradient(90deg, #007bff 0%, #0056b3 100%);
}

.modern-payment-card.meal-card[b-uqyfwora73]::before {
    background: linear-gradient(90deg, #ffc107 0%, #fd7e14 100%);
}

.modern-payment-card:hover[b-uqyfwora73] {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(0,0,0,0.15);
}

.card-header[b-uqyfwora73] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 1rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.card-header i[b-uqyfwora73] {
    font-size: 1.4rem;
    color: #007bff;
}

.meal-card .card-header i[b-uqyfwora73] {
    color: #ffc107;
}

.card-header span:nth-child(2)[b-uqyfwora73] {
    font-weight: 600;
    font-size: 1.1rem;
    color: #333;
    flex: 1;
}

.total-badge[b-uqyfwora73] {
    background: linear-gradient(135deg, #007bff 0%, #6610f2 100%);
    color: white;
    padding: 0.4rem 0.8rem;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(0,123,255,0.3);
}

.meal-card .total-badge[b-uqyfwora73] {
    background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
    box-shadow: 0 2px 8px rgba(255,193,7,0.3);
}

.card-items[b-uqyfwora73] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.payment-item[b-uqyfwora73] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.8rem 1rem;
    background: rgba(0,123,255,0.05);
    border-radius: 10px;
    border-left: 3px solid #007bff;
    transition: all 0.2s ease;
}

.meal-card .payment-item[b-uqyfwora73] {
    background: rgba(255,193,7,0.05);
    border-left-color: #ffc107;
}

.payment-item:hover[b-uqyfwora73] {
    transform: translateX(5px);
    background: rgba(0,123,255,0.1);
}

.meal-card .payment-item:hover[b-uqyfwora73] {
    background: rgba(255,193,7,0.1);
}

.payment-item .card-name[b-uqyfwora73] {
    font-weight: 500;
    color: #495057;
}

.payment-item .card-amount[b-uqyfwora73] {
    font-weight: 600;
    color: #007bff;
    background: rgba(255,255,255,0.8);
    padding: 0.3rem 0.6rem;
    border-radius: 8px;
}

.meal-card .payment-item .card-amount[b-uqyfwora73] {
    color: #ffc107;
}

/* Compact Payment Cards */
.compact-payment-card[b-uqyfwora73] {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border-radius: 12px;
    padding: 1rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    border: 1px solid rgba(255,255,255,0.2);
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.compact-payment-card[b-uqyfwora73]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #007bff 0%, #6610f2 100%);
}

.compact-payment-card.credit-card[b-uqyfwora73]::before {
    background: linear-gradient(90deg, #007bff 0%, #0056b3 100%);
}

.compact-payment-card.meal-card[b-uqyfwora73]::before {
    background: linear-gradient(90deg, #ffc107 0%, #fd7e14 100%);
}

.compact-payment-card:hover[b-uqyfwora73] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
}

.compact-card-header[b-uqyfwora73] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.8rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.compact-card-header i[b-uqyfwora73] {
    font-size: 1.1rem;
    color: #007bff;
}

.meal-card .compact-card-header i[b-uqyfwora73] {
    color: #ffc107;
}

.compact-card-header span:nth-child(2)[b-uqyfwora73] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #333;
    flex: 1;
}

.compact-badge[b-uqyfwora73] {
    background: linear-gradient(135deg, #007bff 0%, #6610f2 100%);
    color: white;
    padding: 0.25rem 0.6rem;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    box-shadow: 0 1px 4px rgba(0,123,255,0.3);
}

.meal-card .compact-badge[b-uqyfwora73] {
    background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
    box-shadow: 0 1px 4px rgba(255,193,7,0.3);
}

.compact-card-items[b-uqyfwora73] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.compact-payment-item[b-uqyfwora73] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.8rem;
    background: rgba(0,123,255,0.04);
    border-radius: 8px;
    border-left: 2px solid #007bff;
    transition: all 0.15s ease;
}

.meal-card .compact-payment-item[b-uqyfwora73] {
    background: rgba(255,193,7,0.04);
    border-left-color: #ffc107;
}

.compact-payment-item:hover[b-uqyfwora73] {
    transform: translateX(3px);
    background: rgba(0,123,255,0.08);
}

.meal-card .compact-payment-item:hover[b-uqyfwora73] {
    background: rgba(255,193,7,0.08);
}

.compact-card-name[b-uqyfwora73] {
    font-weight: 500;
    font-size: 0.85rem;
    color: #495057;
}

.compact-card-amount[b-uqyfwora73] {
    font-weight: 600;
    font-size: 0.8rem;
    color: #007bff;
    background: rgba(255,255,255,0.7);
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
}

.meal-card .compact-card-amount[b-uqyfwora73] {
    color: #ffc107;
}

/* Modern Card Detail Items */
.card-detail-item[b-uqyfwora73] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 1rem;
    margin: 0.3rem 0;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 10px;
    border-left: 4px solid #007bff;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.06);
    position: relative;
    overflow: hidden;
}

.card-detail-item[b-uqyfwora73]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0,123,255,0.02) 0%, rgba(0,123,255,0.05) 100%);
    transform: translateX(-100%);
    transition: transform 0.3s ease;
}

.card-detail-item:hover[b-uqyfwora73]::before {
    transform: translateX(0);
}

.card-detail-item:hover[b-uqyfwora73] {
    transform: translateY(-2px) translateX(3px);
    box-shadow: 0 4px 12px rgba(0,123,255,0.15);
    border-left-color: #0056b3;
    border-left-width: 5px;
}

.card-name[b-uqyfwora73] {
    font-size: 0.95rem;
    color: #495057;
    font-weight: 500;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
}

.card-amount[b-uqyfwora73] {
    font-size: 0.95rem;
    color: #ffffff;
    font-weight: 600;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    padding: 0.3rem 0.8rem;
    border-radius: 15px;
    box-shadow: 0 2px 6px rgba(40, 167, 69, 0.2);
    position: relative;
    z-index: 1;
    transition: all 0.2s ease;
}

.card-detail-item:hover .card-amount[b-uqyfwora73] {
    transform: scale(1.05);
    box-shadow: 0 3px 8px rgba(40, 167, 69, 0.3);
}

/* Mobile Responsive için Payment Cards */
@media (max-width: 1024px) {
    .compact-payment-card[b-uqyfwora73] {
        padding: 0.8rem;
        margin-bottom: 0.8rem;
    }
    
    .compact-card-header[b-uqyfwora73] {
        gap: 0.5rem;
        margin-bottom: 0.6rem;
    }
    
    .compact-card-header i[b-uqyfwora73] {
        font-size: 1rem;
    }
    
    .compact-badge[b-uqyfwora73] {
        padding: 0.2rem 0.5rem;
        font-size: 0.75rem;
    }
    
    .modern-payment-card[b-uqyfwora73] {
        padding: 1.2rem;
        margin-bottom: 1rem;
    }
    
    .card-header[b-uqyfwora73] {
        gap: 0.6rem;
        margin-bottom: 0.8rem;
    }
    
    .card-header i[b-uqyfwora73] {
        font-size: 1.2rem;
    }
    
    .total-badge[b-uqyfwora73] {
        padding: 0.3rem 0.6rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 768px) {
    .compact-payment-card[b-uqyfwora73] {
        padding: 0.7rem;
        border-radius: 10px;
        min-width: 100%;
        margin-bottom: 0.6rem;
    }
    
    .compact-card-header[b-uqyfwora73] {
        flex-direction: row;
        align-items: center;
        gap: 0.4rem;
    }
    
    .compact-card-header span:nth-child(2)[b-uqyfwora73] {
        font-size: 0.9rem;
    }
    
    .compact-badge[b-uqyfwora73] {
        padding: 0.2rem 0.4rem;
        font-size: 0.7rem;
    }
    
    .compact-payment-item[b-uqyfwora73] {
        padding: 0.4rem 0.6rem;
    }
    
    .compact-card-name[b-uqyfwora73] {
        font-size: 0.8rem;
    }
    
    .compact-card-amount[b-uqyfwora73] {
        font-size: 0.75rem;
        padding: 0.15rem 0.4rem;
    }
    
    .modern-payment-card[b-uqyfwora73] {
        padding: 1rem;
        border-radius: 12px;
        min-width: 100%;
        margin-bottom: 0.8rem;
    }
    
    .card-header[b-uqyfwora73] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .card-header span:nth-child(2)[b-uqyfwora73] {
        font-size: 1rem;
    }
    
    .total-badge[b-uqyfwora73] {
        align-self: flex-end;
        padding: 0.25rem 0.5rem;
        font-size: 0.8rem;
    }
    
    .payment-item[b-uqyfwora73] {
        padding: 0.6rem 0.8rem;
    }
    
    .payment-item .card-name[b-uqyfwora73] {
        font-size: 0.9rem;
    }
    
    .payment-item .card-amount[b-uqyfwora73] {
        font-size: 0.85rem;
        padding: 0.2rem 0.5rem;
    }
    
    .card-detail-item[b-uqyfwora73] {
        padding: 0.5rem 0.8rem;
        margin: 0.25rem 0;
        border-radius: 8px;
    }
    
    .card-name[b-uqyfwora73], .card-amount[b-uqyfwora73] {
        font-size: 0.9rem;
    }
    
    .card-amount[b-uqyfwora73] {
        padding: 0.25rem 0.6rem;
        border-radius: 12px;
    }
}
/* /Components/Pages/Reporting/PaymentDetailsCard.razor.rz.scp.css */
.payment-details-container[b-4zs6zmmhdf] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    margin: 1.5rem 0 2rem 0;
    justify-content: center;
}

.payment-type-card[b-4zs6zmmhdf] {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    flex: 1;
    min-width: 280px;
    max-width: 350px;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}

.payment-type-card:hover[b-4zs6zmmhdf] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.payment-type-header[b-4zs6zmmhdf] {
    padding: 1rem 1.2rem;
    color: white;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    font-size: 1.05rem;
    font-weight: 600;
}

.payment-type-header i[b-4zs6zmmhdf] {
    font-size: 1.3rem;
}

.payment-type-body[b-4zs6zmmhdf] {
    padding: 0.8rem 1.2rem 0.5rem;
    flex-grow: 1;
}

.payment-detail-row[b-4zs6zmmhdf] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0.95rem;
}

.payment-detail-row:last-child[b-4zs6zmmhdf] {
    border-bottom: none;
}

.payment-type-total[b-4zs6zmmhdf] {
    background-color: #f8f9fa;
    padding: 0.8rem 1.2rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #e9ecef;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .payment-details-container[b-4zs6zmmhdf] {
        flex-direction: column;
        align-items: center;
    }
    
    .payment-type-card[b-4zs6zmmhdf] {
        width: 100%;
        max-width: 100%;
    }
}
/* /Components/Pages/Sales/QuickSales/Index.razor.rz.scp.css */
/* Mobil Üst Menü */
.mobile-top-menu[b-1g4bdrie5f] {
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.cart-badge[b-1g4bdrie5f] {
    position: absolute;
    top: -5px;
    right: -5px;
    transform: translate(0, 0);
    font-size: 0.7rem;
}

/* Ürün Grid Tasarımı */
.product-grid[b-1g4bdrie5f] {
    /* TEMEL DEĞİŞİKLİKLER: */
    flex-grow: 1; /* Bu, .product-grid'in .product-container içinde kalan tüm dikey boşluğu almasını sağlar */
    overflow-y: auto; /* İçerik sığmazsa dikey kaydırma çubuğu ekler */
    overflow-x: hidden; /* Yatay kaydırmayı engeller (genellikle istenmez) */

    /* MEVCUT STİLLERİNİZ (Bunları koruyun veya ihtiyaca göre uyarlayın): */
    /* Örneğin, ürün kartlarını sıralamak için kullandığınız grid veya flex tanımları: */
    display: grid; /* Veya display: flex; flex-wrap: wrap; */
    /* Aşağıdakiler örnektir, kendi kart boyutlarınıza ve boşluklarınıza göre ayarlayın */
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); 
    gap: 0.4rem; 
    padding: 1rem; /* Kenar boşlukları */

    /* ÖNEMLİ: Eğer .product-grid için sabit bir height veya max-height tanımınız varsa, 
       bunları kaldırın veya aşağıdaki gibi auto/none yapın: */
    /* height: auto; */
    /* max-height: none; */

    /* İsteğe Bağlı: Daha hoş görünümlü kaydırma çubukları */
    scrollbar-width: thin; /* Firefox */
    scrollbar-color: #6c757d #f8f9fa; /* Firefox: çubuk ve arka plan rengi */
}
/* Webkit tabanlı tarayıcılar (Chrome, Edge, Safari) için kaydırma çubuğu stilleri */
.product-grid[b-1g4bdrie5f]::-webkit-scrollbar {
    width: 8px;
}

.product-grid[b-1g4bdrie5f]::-webkit-scrollbar-track {
    background: #f8f9fa; /* Kaydırma çubuğu arka planı */
    border-radius: 10px;
}

.product-grid[b-1g4bdrie5f]::-webkit-scrollbar-thumb {
    background: #6c757d; /* Kaydırma çubuğu rengi */
    border-radius: 10px;
}

.product-grid[b-1g4bdrie5f]::-webkit-scrollbar-thumb:hover {
    background: #5a6268; /* Kaydırma çubuğu hover rengi */
}

.product-card[b-1g4bdrie5f] {
    border: 1px solid #ddd; 
    border-radius: 5px;
    background-color: #fff;
    margin: 0;
    padding: 5px;
    display: flex;
    flex-direction: column; /* Ana yön dikey */
    align-items: center; /* Yatayda her şeyi ortala */
    /* justify-content: center; Bu satırı kaldırıyoruz veya space-between yapacağız */
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    overflow: hidden;
    min-height: 120px; 
    text-align: center;
}
.product-name[b-1g4bdrie5f] {
    font-weight: bold;
    color: black;
}
.product-image-container[b-1g4bdrie5f] { /* Eğer resmi bir div içinde sarmalıyorsak bu sınıfı kullanın */
    width: 100%;
    height: 70px; /* Resim için sabit bir yükseklik verelim, kart yüksekliğine göre ayarlayın */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px; /* Resim ile başlık arası boşluk */
    overflow: hidden; /* Bu konteyner dışına taşan resmi gizle */
}
/* Ürün Resmi */
/* Ürün resmi için sarmalayıcı div (.product-image sınıfı sizin Razor'da kullandığınız) */
.product-image[b-1g4bdrie5f] { 
    width: 100%;
    height: 0; 
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0; 
    overflow: hidden;
    transition: height 0.3s ease, margin-bottom 0.3s ease;
    flex-shrink: 0; /* Resim alanı küçülmesin (içerik sıkışırsa) */
}

.product-image.has-image[b-1g4bdrie5f] {
    height: 60px; 
    margin-bottom: 5px;
}

.product-image img[b-1g4bdrie5f] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

/* Yeni sarmalayıcı div için stil */
.product-details-wrapper[b-1g4bdrie5f] {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Dikey ortalama */
    align-items: center;     /* Yatay ortalama */
    flex-grow: 1;
    width: 100%;
    overflow: hidden;
    padding: 0 4px; /* Uzun isimler için biraz nefes alanı */
    text-align: center;
}

.product-title[b-1g4bdrie5f] {
    font-weight: bold;
    color: black;
    margin: 0;
    padding: 0;
    white-space: normal; /* Satır kaymasına izin ver */
    overflow: hidden;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%; /* Tüm wrapper alanını kaplasın */
    text-wrap: balance; /* Opsiyonel: Çok satırlı ise daha dengeli dağıtır (tarayıcı desteği yeni) */
}

/* Ürün Fiyatı */
.product-price[b-1g4bdrie5f] {
    font-size: 0.9rem;
    font-weight: bold;
    color: #000;
    margin-top: auto; /* Fiyatı kartın en altına iteler (eğer product-card justify-content: space-between ise) */
                     /* Veya margin-top: 5px; gibi sabit bir değer */
    padding: 0;
    text-align: center;
}
/* Ürün Grupları Grid Yapısı */
.group-grid[b-1g4bdrie5f] {
    display: grid;
    grid-template-columns: repeat(8, 1fr); /* 8 sütunlu grid yapısı */
    gap: 5px; /* Kartlar arasında küçük boşluk */
    padding: 5px; /* İç boşluk */
    margin: 0; /* Dış boşluk yok */
    height: auto; /* Otomatik yükseklik */
    overflow: visible; /* Taşma durumunda görünür kalsın */
    max-height: 190px; /* Maksimum yüksekliği artır - iki satır için */
    margin-bottom: 5px; /* Alt boşluk */
}

/* Ürün Grubu Kart Tasarımı */
.group-card[b-1g4bdrie5f] {
    height: 90px; /* Kart yüksekliği */
    border: 1px solid #ddd;
    border-radius: 5px; /* Hafif köşe yuvarlatma */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    margin: 0; /* Dış boşluk yok */
}

.group-card:hover[b-1g4bdrie5f] {
    transform: translateY(-2px); /* Hoverda hafif yukarı kalkma efekti */
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1); /* Hafif gölge */
}

.group-card.active[b-1g4bdrie5f] {
    background-color: #007bff;
    color: white;
    border-color: #0062cc;
}

.group-card.active .group-card-title[b-1g4bdrie5f] {
    color: white;
}

/* Ürün Grubu Kart İçeriği */
.group-card-body[b-1g4bdrie5f] {
    padding: 5px; /* İç boşluk */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}

/* Ürün Grubu Kart Başlığı */
.group-card-title[b-1g4bdrie5f] {
    font-size: 13px; /* Daha küçük yazı boyutu */
    font-weight: bold;
    margin: 0 auto; /* Ortala */
    white-space: normal; /* Metni wrap et */
    overflow: visible; /* Taşma görünsün */
    max-width: 100%; /* Maksimum genişlik */
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Maksimum 3 satır göster */
    -webkit-box-orient: vertical;
    text-align: center;
    line-height: 1.2; /* Satır aralığı */
    word-break: break-word; /* Uzun kelimeleri kır */
    hyphens: auto; /* Gerekirse heceleme yap */
}

/* Sepetteki satırların renk geçişleri */
.table-row[b-1g4bdrie5f] {
    transition: background-color 0.3s ease;
}

.table-row:hover[b-1g4bdrie5f] {
    background-color: #f1f1f1;
}

.table-row.selected[b-1g4bdrie5f] {
    background-color: #007bff;
    color: white;
}

.table[b-1g4bdrie5f] {
    font-size: 14px; /* Daha küçük yazı boyutu */
}

.table th[b-1g4bdrie5f], .table td[b-1g4bdrie5f] {
    padding: 4px 6px; /* Daha az iç boşluk */
    font-size: 13px; /* Satır içi yazıları küçült */
}

/* Mobil sepet tablosu */
.mobile-cart-table[b-1g4bdrie5f] {
    width: 100%;
    font-size: 12px;
}

.mobile-cart-table th[b-1g4bdrie5f], 
.mobile-cart-table td[b-1g4bdrie5f] {
    padding: 3px;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.total-price-section h3[b-1g4bdrie5f] {
    font-size: 18px; /* Toplam tutar kısmını küçültelim */
}

/* Sepet başlığı */
h4.mb-0[b-1g4bdrie5f] {
    font-size: 16px; /* Başlığı küçült */
}

/* Ödeme butonları */
/* Ödeme Seçenekleri Kapsayıcı - Dikey */
.payment-options[b-1g4bdrie5f] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px; /* Butonlar arasında boşluk */
    padding: 5px; /* Kapsayıcı iç boşluğu */
    width: 100%;
}

/* Ödeme Seçenekleri Kapsayıcı - Yatay */
.payment-options-horizontal[b-1g4bdrie5f] {
    display: flex;
    flex-wrap: wrap; /* Butonların yan yana sığmaması durumunda alt satıra geçmesini sağlar */
    justify-content: center; /* Butonları yatayda ortalar */
    gap: 8px; /* Butonlar arasında boşluk */
    padding: 5px; /* Kapsayıcı iç boşluğu */
    width: 100%;
}

/* Ödeme Butonları */
.payment-button[b-1g4bdrie5f] {
    font-size: 14px; /* Varsayılan yazı boyutu */
    padding: 8px 12px; /* İç boşluk */
    min-width: 120px; /* Buton genişliği */
    border-radius: 8px; /* Köşe yuvarlama */
    transition: all 0.3s ease; /* Yumuşak geçiş */
    display: flex; /* İkon ve yazıyı hizalamak için flexbox */
    align-items: center; /* Dikey hizalama */
    justify-content: center; /* Yatay hizalama */
    gap: 8px; /* İkon ve yazı arasında boşluk */
    text-align: center; /* İçerik merkezde */
    margin: 3px;
}

.payment-button i[b-1g4bdrie5f] {
    font-size: 1.2rem; /* İkon boyutu */
    line-height: 1; /* Dikey hizalamayı iyileştirir */
    vertical-align: middle; /* Dikey hizalama */
}

.payment-button span[b-1g4bdrie5f] {
    display: inline-block; /* Yazıyı düzgün hizalamak için */
    vertical-align: middle; /* Orta hizalama */
    line-height: 1; /* Dikey hizalamayı iyileştirir */
}

/* Buton tıklama ve odaklanma durumları - rengi kalıcı tutmasın */
.payment-button:focus[b-1g4bdrie5f] {
    outline: none; /* Odaklanma çizgisini kaldır */
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); /* Hafif odaklanma gölgesi */
}

/* Aktif buton stilleri - tıklama anını gösterip bırakma */
.payment-button:active[b-1g4bdrie5f] {
    transform: translateY(2px); /* Basılma hissi vermek için hafif aşağı iner */
}

/* Yeşil buton başlangıç ve odaklanma durumları */
.btn-outline-success[b-1g4bdrie5f] {
    border-color: #28a745;
    color: #28a745;
}

.btn-outline-success:hover[b-1g4bdrie5f] {
    background-color: rgba(40, 167, 69, 0.1); /* Hafif yeşil hover efekti */
    color: #28a745;
}

.btn-outline-success:active[b-1g4bdrie5f] {
    background-color: rgba(40, 167, 69, 0.2); /* Daha belirgin basılma efekti */
    transform: translateY(2px);
}

/* Yeşil dolu buton (seçili durum) */
.btn-success[b-1g4bdrie5f] {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
    color: white !important;
}

.btn-success:active[b-1g4bdrie5f] {
    transform: translateY(2px);
    opacity: 0.9;
}

/* Mavi buton başlangıç ve odaklanma durumları */
.btn-outline-primary[b-1g4bdrie5f] {
    border-color: #007bff;
    color: #007bff;
}

.btn-outline-primary:hover[b-1g4bdrie5f] {
    background-color: rgba(0, 123, 255, 0.1); /* Hafif mavi hover efekti */
    color: #007bff;
}

.btn-outline-primary:active[b-1g4bdrie5f] {
    background-color: rgba(0, 123, 255, 0.2); /* Daha belirgin basılma efekti */
    transform: translateY(2px);
}

/* Mavi dolu buton (seçili durum) */
.btn-primary[b-1g4bdrie5f] {
    background-color: #007bff !important;
    border-color: #007bff !important;
    color: white !important;
}

.btn-primary:active[b-1g4bdrie5f] {
    transform: translateY(2px);
    opacity: 0.9;
}

/* Sarı buton başlangıç ve odaklanma durumları */
.btn-outline-warning[b-1g4bdrie5f] {
    border-color: #ffc107;
    color: #ffc107;
}

.btn-outline-warning:hover[b-1g4bdrie5f] {
    background-color: rgba(255, 193, 7, 0.1); /* Hafif sarı hover efekti */
    color: #ffc107;
}

.btn-outline-warning:active[b-1g4bdrie5f] {
    background-color: rgba(255, 193, 7, 0.2); /* Daha belirgin basılma efekti */
    transform: translateY(2px);
}

/* Sarı dolu buton (seçili durum) */
.btn-warning[b-1g4bdrie5f] {
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
    color: #212529 !important;
}

.btn-warning:active[b-1g4bdrie5f] {
    transform: translateY(2px);
    opacity: 0.9;
}

/* Kırmızı buton özel stillemesi */
.btn-outline-danger[b-1g4bdrie5f] {
    border-color: #dc3545;
    color: #dc3545;
}

.btn-outline-danger:hover[b-1g4bdrie5f] {
    background-color: rgba(220, 53, 69, 0.1); /* Hafif kırmızı hover efekti */
    color: #dc3545;
}

.btn-outline-danger:active[b-1g4bdrie5f] {
    background-color: rgba(220, 53, 69, 0.2); /* Daha belirgin basılma efekti */
    transform: translateY(2px);
}

.btn-danger:active[b-1g4bdrie5f] {
    transform: translateY(2px);
    opacity: 0.9;
}

/* Gri buton özel stillemesi */
.btn-outline-secondary[b-1g4bdrie5f] {
    border-color: #6c757d;
    color: #6c757d;
}

.btn-outline-secondary:hover[b-1g4bdrie5f] {
    background-color: rgba(108, 117, 125, 0.1); /* Hafif gri hover efekti */
    color: #6c757d;
}

.btn-outline-secondary:active[b-1g4bdrie5f] {
    background-color: rgba(108, 117, 125, 0.2); /* Daha belirgin basılma efekti */
    transform: translateY(2px);
}

.btn-secondary:active[b-1g4bdrie5f] {
    transform: translateY(2px);
    opacity: 0.9;
}

/* Mavi buton özel stillemesi */
.btn-outline-info[b-1g4bdrie5f] {
    border-color: #17a2b8;
    color: #17a2b8;
}

.btn-outline-info:hover[b-1g4bdrie5f] {
    background-color: rgba(23, 162, 184, 0.1); /* Hafif mavi hover efekti */
    color: #17a2b8;
}

.btn-outline-info:active[b-1g4bdrie5f] {
    background-color: rgba(23, 162, 184, 0.2); /* Daha belirgin basılma efekti */
    transform: translateY(2px);
}

.btn-info:active[b-1g4bdrie5f] {
    transform: translateY(2px);
    opacity: 0.9;
}

.toast-message[b-1g4bdrie5f] {
    position: fixed;
    top: 20px; /* Üstten 20px boşluk */
    left: 50%; /* Ortada */
    transform: translateX(-50%); /* X ekseninde ortalama */
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 1rem;
    z-index: 1050; /* Önde görünmesi için */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    transition: opacity 0.3s ease-in-out;
}

.toast-success[b-1g4bdrie5f] {
    background-color: #28a745; /* Başarılı yeşil */
}

.toast-error[b-1g4bdrie5f] {
    background-color: #dc3545; /* Hata kırmızısı */
}
.form-check-input[b-1g4bdrie5f] {
    width: 20px;
    height: 20px;
    margin-top: 0.25rem;
}
.list-group-item[b-1g4bdrie5f] {
    border: none;
    padding: 0.8rem 0 0.8rem 2.5rem; /* Sol tarafta daha fazla boşluk bırak */
    font-size: 0.95rem;
    word-wrap: break-word;
    white-space: normal;
    position: relative; /* İkonun pozisyonunu yönetmek için */
}

    .list-group-item[b-1g4bdrie5f]::before {
        content: "\f0a9"; /* Örnek Font Awesome simge kodu */
        font-family: "Font Awesome 5 Free"; /* Simge için kullanılan font */
        font-weight: 900; /* Bold simge */
        position: absolute; /* İkonu bağımsız konumlandır */
        top: 50%; /* Dikey olarak ortala */
        left: 0.5rem; /* Sol boşluk */
        transform: translateY(-50%); /* Dikey ortalamayı tamamla */
        font-size: 1.2rem; /* Simge boyutunu ayarla */
        color: #007bff; /* Simge rengi */
        z-index: 1; /* İkonun görünür kalmasını sağla */
    }

    .list-group-item strong[b-1g4bdrie5f] {
        font-size: 1rem;
        color: #333;
        display: block;
        margin-bottom: 0.5rem;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .list-group-item ul[b-1g4bdrie5f] {
        margin: 0;
        padding-left: 0.5rem; /* Daha iyi hizalama */
    }

        .list-group-item ul li[b-1g4bdrie5f] {
            font-size: 0.9rem;
            color: #555;
            text-overflow: ellipsis;
            white-space: normal;
            word-break: break-word;
            line-height: 1.5;
        }

            .list-group-item ul li:hover[b-1g4bdrie5f] {
                color: #007bff;
                cursor: pointer;
            }

@keyframes fadeInOut-b-1g4bdrie5f {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }

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

    90% {
        opacity: 1;
    }

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

/* Modal arka planı */
.modal-backdrop[b-1g4bdrie5f] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.modal-content[b-1g4bdrie5f] {
    width: 90%;
    max-width: 500px;
}

/* Modal başlık */
.modal-title[b-1g4bdrie5f] {
    font-size: 2rem;
    font-weight: bold;
}

/* Büyük butonlar (modal içi +/- butonları vs.) */
.btn-lg[b-1g4bdrie5f] {
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .btn-lg i[b-1g4bdrie5f] {
        font-size: 2rem;
    }

/* Metin kutusu boyutu */
input[type="text"][b-1g4bdrie5f] {
    height: 60px;
    text-align: center;
    font-size: 1.5rem;
    border: 2px solid #ddd;
    border-radius: 5px;
}

/* Modal içindeki seçili satır rengi */
.modal-content .table-row.selected[b-1g4bdrie5f] {
    background-color: #007bff;
    color: white;
}

.table-row[b-1g4bdrie5f] {
    cursor: pointer; /* Tıklanabilirlik için el imleci */
    transition: background-color 0.3s; /* Yumuşak renk geçişi */
}

    .table-row.bg-primary[b-1g4bdrie5f] {
        background-color: #007bff !important; /* Mavi arka plan */
        color: white; /* Beyaz yazı */
    }

    .table-row.bg-success[b-1g4bdrie5f] {
        background-color: #28a745 !important; /* Yeşil arka plan */
        color: white; /* Beyaz yazı */
    }

.header[b-1g4bdrie5f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd; /* Alt çizgi */
}

    .header .border-end[b-1g4bdrie5f] {
        border-right: 2px solid #fff; /* Orta çizgi */
    }

    .header .text-center[b-1g4bdrie5f] {
        cursor: pointer;
        transition: all 0.2s ease-in-out;
    }
.quantity-bar[b-1g4bdrie5f] {
    height: calc(100vh - 80px); /* Header yüksekliğine göre */
    border-left: 2px solid #ddd;
}

    .quantity-bar button[b-1g4bdrie5f] {
        width: 100%;
        text-align: center;
    }

.custom-row[b-1g4bdrie5f] {
    --bs-gutter-x: 0.1rem; /* Sütunlar arasındaki yatay boşluk */
    --bs-gutter-y: 0.1rem; /* Sütunlar arasındaki dikey boşluk */
}

.search-box[b-1g4bdrie5f] {
    position: absolute; /* Sadece ürün grid kapsayıcısına bağlı */
    bottom: 0; /* Alt kısma yapışır */
    left: 0; /* Sol tarafa hizalanır */
    right: 0; /* Sağ tarafa hizalanır */
    padding: 5px 10px; /* Küçük iç boşluk */
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1); /* Hafif gölge */
    z-index: 10; /* Üstte kalmasını sağlar */
}

.search-input[b-1g4bdrie5f] {
    font-size: 14px; /* Daha kompakt bir görünüm */
    height: 36px; /* Daha küçük textbox */
    border-radius: 4px; /* Hafif yuvarlatma */
}

.product-container[b-1g4bdrie5f] {
    position: relative; /* Kapsayıcıyı bağlama alanı yapar */
    height: 100%; /* Ürünler kısmının tamamını kaplar */
    overflow: hidden; /* Taşmaları engeller */
}

/* DataGrid Varsayılan */
.datagrid[b-1g4bdrie5f] {
    font-size: 16px; /* Varsayılan yazı boyutu */
    border: 1px solid #ccc;
    width: 100%; /* Genişlik */
    table-layout: auto;
    transition: all 0.3s ease; /* Yumuşak geçiş */
}
.payment-button[b-1g4bdrie5f] {
    font-size: 16px; /* Varsayılan yazı boyutu */
    padding: 15px 20px; /* Varsayılan iç boşluk */
    min-width: 200px; /* Buton genişliği */
    border-radius: 10px; /* Buton köşe yuvarlama */
    transition: all 0.3s ease; /* Yumuşak geçiş */
}

    .payment-button i[b-1g4bdrie5f] {
        font-size: 1.5rem; /* İkon boyutu */
    }

/* Ekran 1366px ve Daha Küçük */
@media (max-width: 1366px) {
    /* Ürün Grid */
    .product-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(3, 1fr); /* Sütun sayısı 3'e düşsün */
        gap: 1px; /* Kartlar arası boşluk azalır */
    }

    /* Ürün Kartları */
    .product-card[b-1g4bdrie5f] {
        min-height: 70px; /* Kart yüksekliğini küçült */
        padding: 5px; /* İç boşluğu azalt */
    }

    .product-image[b-1g4bdrie5f] {
        height: 40px; /* Görsel yüksekliği küçült */
    }

    .product-title[b-1g4bdrie5f] {
        font-size: 12px; /* Yazı boyutunu küçült */
    }

    .product-price[b-1g4bdrie5f] {
        font-size: 10px; /* Fiyat yazı boyutunu küçült */
    }

    /* Ürün Grupları */
    .group-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(8, 1fr); /* 8 sütun korunsun */
        gap: 5px;
        max-height: 210px; /* 1366x768 için maksimum yüksekliği artır */
        overflow-y: auto; /* İçerik sığmazsa kaydırma çubuğu göster */
    }

    .group-card[b-1g4bdrie5f] {
        height: 100px; /* 1366x768 için yüksekliği artır, daha fazla metin sığsın */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .group-card-title[b-1g4bdrie5f] {
        font-size: 12px; /* 1366x768 için yazı boyutunu daha da küçült */
        -webkit-line-clamp: 4; /* 1366x768 için bir satır daha ekle */
        line-height: 1.1; /* Satır aralığını biraz daha sıkılaştır */
        max-height: 4.4em; /* Maksimum 4 satır yüksekliği */
        word-break: break-word; /* Uzun kelimeleri kır */
        overflow: hidden; /* Taşmayı gizle */
    }
    .datagrid[b-1g4bdrie5f] {
        font-size: 14px; /* DataGrid yazı boyutu küçülür */
        width: 90%; /* DataGrid genişliği azaltılır */
    }

    .payment-button[b-1g4bdrie5f] {
        font-size: 14px; /* Yazı boyutunu küçült */
        padding: 10px 15px; /* Daha küçük iç boşluk */
        min-width: 150px; /* Buton genişliği küçült */
        border-radius: 8px; /* Köşe yuvarlama biraz azalt */
    }

    .payment-button i[b-1g4bdrie5f] {
        font-size: 1.2rem; /* İkon boyutunu küçült */
    }

    .search-box[b-1g4bdrie5f] {
        padding: 5px 8px; /* Daha dar iç boşluk */
    }

    .search-input[b-1g4bdrie5f] {
        font-size: 12px; /* Yazı boyutunu küçült */
        height: 32px; /* Daha küçük yükseklik */
        border-radius: 4px; /* Hafif yuvarlatma */
    }
}

/* Ekran 1024px ve Daha Küçük */
@media (max-width: 1024px) {
    /* Ürün Grid */
    .product-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(2, 1fr); /* Sütun sayısı 2'ye düşsün */
        gap: 8px; /* Daha az boşluk */
    }

    /* Ürün Kartları */
    .product-card[b-1g4bdrie5f] {
        min-height: 80px; /* Kart yüksekliği daha da küçült */
        padding: 3px; /* Daha az iç boşluk */
    }

    .product-image[b-1g4bdrie5f] {
        height: 50px; /* Görsel yüksekliğini daha da küçült */
    }

    .product-title[b-1g4bdrie5f] {
        font-size: 10px; /* Daha küçük yazı boyutu */
    }

    .product-price[b-1g4bdrie5f] {
        font-size: 8px; /* Daha küçük fiyat yazısı */
    }

    /* Ürün Grupları */
    .group-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(2, 1fr); /* 2 sütun */
    }

    .group-card[b-1g4bdrie5f] {
        height: 80px; /* Daha küçük grup kartı yüksekliği */
    }

    .group-card-title[b-1g4bdrie5f] {
        font-size: 10px; /* Daha küçük yazı boyutu */
    }

    .datagrid[b-1g4bdrie5f] {
        font-size: 12px; /* DataGrid yazı boyutu daha küçük */
        width: 85%; /* DataGrid genişliği daha da daraltılır */
    }

    .search-box[b-1g4bdrie5f] {
        padding: 4px 6px; /* Daha da dar iç boşluk */
    }

    .search-input[b-1g4bdrie5f] {
        font-size: 10px; /* Daha küçük yazı boyutu */
        height: 28px; /* Daha kısa yükseklik */
        border-radius: 3px; /* Hafif yuvarlatma */
    }
}

/* Ekran 768px ve Daha Küçük */
@media (max-width: 768px) {
    /* Ürün Grid */
    .product-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(3, 1fr); /* Mobilde 3 sütun */
        gap: 3px; /* Kartlar arası küçük boşluk */
        padding: 3px;
    }

    /* Ürün Kartları */
    .product-card[b-1g4bdrie5f] {
        min-height: 80px; /* Kart yüksekliği */
        padding: 3px; /* İç boşluk */
    }

    .product-image[b-1g4bdrie5f] {
        height: 40px; /* Görsel yüksekliği */
    }

    .product-title[b-1g4bdrie5f] {
        font-size: 10px; /* Yazı boyutu */
        margin-top: 3px;
    }

    .product-price[b-1g4bdrie5f] {
        font-size: 10px; /* Fiyat yazı boyutu */
        font-weight: bold;
    }

    /* Ürün Grupları */
    .group-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(4, 1fr); /* Mobil için 4 sütun */
        max-height: none; /* Mobilde yükseklik sınırı yok */
    }

    .group-card[b-1g4bdrie5f] {
        height: 60px; /* Grup kartı yüksekliği */
    }

    .group-card-title[b-1g4bdrie5f] {
        font-size: 10px; /* Yazı boyutu */
    }

    /* Arama kutusu */
    .search-box[b-1g4bdrie5f] {
        padding: 5px;
        position: sticky;
        bottom: 0;
        background-color: #f8f9fa;
        z-index: 100;
        box-shadow: 0 -2px 5px rgba(0,0,0,0.1);
    }

    .search-input[b-1g4bdrie5f] {
        font-size: 12px;
        height: 32px;
        border-radius: 16px;
    }
    
    /* Ödeme butonları */
    .payment-options-horizontal[b-1g4bdrie5f] {
        flex-wrap: wrap;
        justify-content: center;
        gap: 5px;
    }
    
    .payment-button[b-1g4bdrie5f] {
        margin-bottom: 3px;
        font-size: 12px;
        padding: 6px;
        min-width: 100px;
    }
    
    .payment-button i[b-1g4bdrie5f] {
        font-size: 1rem;
    }
    
    /* Sepet tablosu */
    .mobile-cart-table th[b-1g4bdrie5f], 
    .mobile-cart-table td[b-1g4bdrie5f] {
        padding: 2px;
        font-size: 10px;
    }
    
    /* Toplam fiyat */
    .total-price-section h3[b-1g4bdrie5f] {
        font-size: 14px;
    }
}

/* Küçük mobil cihazlar için ek düzenlemeler */
@media (max-width: 576px) {
    .product-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .group-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(3, 1fr); /* Küçük mobil için 3 sütun */
    }
    
    .product-card[b-1g4bdrie5f] {
        min-height: 70px;
    }
    
    .product-title[b-1g4bdrie5f] {
        font-size: 9px;
    }
    
    .product-price[b-1g4bdrie5f] {
        font-size: 9px;
    }
    
    .group-card[b-1g4bdrie5f] {
        height: 50px;
    }
    
    .group-card-title[b-1g4bdrie5f] {
        font-size: 9px;
    }
    
    /* Mobil sepet tablosu için daha kompakt görünüm */
    .mobile-cart-table th:nth-child(4)[b-1g4bdrie5f],
    .mobile-cart-table td:nth-child(4)[b-1g4bdrie5f] {
        display: none; /* Fiyat sütununu gizle */
    }
    
    .payment-text[b-1g4bdrie5f] {
        display: none; /* Ödeme butonlarında sadece ikonları göster */
    }
    
    .payment-button[b-1g4bdrie5f] {
        min-width: 80px;
        padding: 6px;
    }
    
    .payment-button i[b-1g4bdrie5f] {
        margin-right: 0;
        font-size: 1.2rem;
    }
    
    /* Ödeme butonları için daha kompakt görünüm */
    .payment-options-horizontal[b-1g4bdrie5f] {
        gap: 4px;
    }
    
    .payment-button[b-1g4bdrie5f] {
        min-width: 80px;
        padding: 6px;
        margin: 2px;
    }
    
    .payment-text[b-1g4bdrie5f] {
        font-size: 11px;
    }
}

/* Çok küçük ekranlar için */
@media (max-width: 400px) {
    .payment-text[b-1g4bdrie5f] {
        display: none; /* Ödeme butonlarında sadece ikonları göster */
    }
    
    .payment-button[b-1g4bdrie5f] {
        min-width: 40px;
        padding: 8px;
    }
    
    .payment-button i[b-1g4bdrie5f] {
        margin-right: 0;
        font-size: 1.2rem;
    }
}

/* Responsive Düzenlemeler */
@media (max-width: 1920px) {
    .group-grid[b-1g4bdrie5f] {
        grid-template-columns: repeat(8, 1fr); /* 1920 için 8 sütun */
    }
    
    .group-card[b-1g4bdrie5f] {
        height: 75px;
    }
    
    .group-card-title[b-1g4bdrie5f] {
        font-size: 12px;
    }
}

/* Responsive Sepet Tasarımı - Sayfa Yapısı */
.quicksale-container[b-1g4bdrie5f] {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
}

/* Sol kolon (sepet) margin düzeltmesi */
.quicksale-container .col-lg-4[b-1g4bdrie5f] {
    margin-left: 0;
    padding-left: 10px; /* Sepeti sağa doğru kaydır */
    border-left: 0;
}

/* Sepet başlığı kutusu düzenlemesi */
.quicksale-container .col-lg-4 .p-2.border-bottom[b-1g4bdrie5f] {
    padding-left: 15px !important; /* Başlık metnini sağa kaydır */
}

/* Responsive düzenleme - 1366px ve daha küçük ekranlar */
@media (max-width: 1366px) {
    .quicksale-container .col-lg-4[b-1g4bdrie5f] {
        padding-left: 8px; /* Küçük ekranlarda biraz daha az padding */
    }
    
    .quicksale-container .col-lg-4 .p-2.border-bottom[b-1g4bdrie5f] {
        padding-left: 12px !important;
    }
}

/* Mobil ekranlar için düzenleme */
@media (max-width: 768px) {
    .quicksale-container .col-lg-4[b-1g4bdrie5f] {
        padding-left: 0; /* Mobilde padding'i kaldır */
    }
    
    .quicksale-container .col-lg-4 .p-2.border-bottom[b-1g4bdrie5f] {
        padding-left: 10px !important;
    }
}

/* Sepet ve ürün grupları başlık hizalaması - Ortak kurallar */
.col-lg-4 .p-2.border-bottom.d-flex.justify-content-between.align-items-center.cart-header[b-1g4bdrie5f],
.d-flex.justify-content-between.align-items-center.border-bottom.p-2[b-1g4bdrie5f] {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    border-bottom: 1px solid #dee2e6 !important;
    box-sizing: border-box !important;
    padding: 0 15px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 100 !important; /* Z-index ekledik sol menü arkasında kalmaması için */
}

/* Sepet başlığı için stil düzenlemesi - Beyaz arka plan */
.col-lg-4 .p-2.border-bottom.d-flex.justify-content-between.align-items-center.cart-header[b-1g4bdrie5f] {
    background-color: #ffffff !important; /* Sepet başlığı beyaz arka plan */
}

/* Ürün grupları başlık div'ine özel stil (çizgiyi genişletmek için) */
.d-flex.justify-content-between.align-items-center.border-bottom.p-2[b-1g4bdrie5f] {
    margin-left: -15px !important; /* Sola taşarak genişlet */
    padding-left: 30px !important; /* İçeriği orijinal yerinde tut */
    width: calc(100% + 15px) !important; /* Genişliği artır */
    background-color: #f8f9fa !important; /* Ürün grupları başlığı gri arka plan */
}

/* Başlık metni (hem sepet hem ürün grupları) */
.cart-header h4.mb-0[b-1g4bdrie5f],
.d-flex.justify-content-between.align-items-center.border-bottom.p-2 h4.mb-0[b-1g4bdrie5f] {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* İkonlar (hem sepet hem ürün grupları) */
.cart-header i[b-1g4bdrie5f],
.d-flex.justify-content-between.align-items-center.border-bottom.p-2 i[b-1g4bdrie5f] {
    font-size: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

/* İçerik alanları (hem sepet hem ürün grupları) - Yükseklik ayarlamaları */
.col-lg-4 .flex-grow-1.p-2.overflow-auto[b-1g4bdrie5f],
.col-lg-8 .flex-grow-1.p-2.overflow-auto[b-1g4bdrie5f] {
    flex-grow: 1 !important;
    padding: 0 !important; 
    margin: 0 !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Sağ panel arka plan rengi ve kenarlığı */
.col-lg-8.bg-light.d-flex.flex-column.h-100[b-1g4bdrie5f] {
    background-color: #f8f9fa !important; /* Açık gri arka plan */
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-left: 1px solid #dee2e6 !important; /* Sol kenarlık */
}

/* Sol panel arka plan rengi */
.col-lg-4.bg-white.text-dark.d-flex.flex-column.h-100[b-1g4bdrie5f] {
    background-color: #ffffff !important; /* Beyaz arka plan */
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    box-shadow: 0 0 8px rgba(0,0,0,0.1) !important; /* Gölge ekledik - panel ayrımı için */
    z-index: 50 !important; /* Sol panel için z-index ekledik */
}

/* Ürün grupları grid ve ürünlerin yüksekliğini ayarlama */
.col-lg-8 .flex-grow-1.p-2.overflow-auto[b-1g4bdrie5f] {
    max-height: calc(100vh - 170px) !important; /* Ekran yüksekliğinden başlık ve diğer alanları çıkar */
}

/* Ürünler bölümü başlığı için stil - Açık gri arka plan */
.d-flex.justify-content-between.align-items-center.border-top.p-2[b-1g4bdrie5f] {
    background-color: #f8f9fa !important; /* Ürünler başlığı gri arka plan */
    padding: 0 15px !important;
    height: 56px !important;
    border-top: 1px solid #dee2e6 !important;
    z-index: 10 !important;
}

/* Ürün grupları kısmı için tam arka plan */
.group-grid[b-1g4bdrie5f] {
    background-color: #f8f9fa !important; /* Ürün grupları alanı gri arka plan */
    max-height: 140px !important; /* Daha az yer kaplasın */
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 10px !important;
    border-bottom: 1px solid #dee2e6 !important;
}

/* Ürünler grid konteyneri için arka plan */
.product-grid[b-1g4bdrie5f] {
    background-color: #f8f9fa !important; /* Ürünler grid alanı gri arka plan */
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    padding: 10px !important;
}

/* Tablo */
.col-lg-4 .flex-grow-1.p-2.overflow-auto .table-sm.mobile-cart-table.table[b-1g4bdrie5f] {
    margin: 0 !important;
    width: 100% !important;
    table-layout: fixed !important; /* Sabit genişlik dağılımı için */
}

/* Tablo başlığı - Sticky yaparak kaydırmada görünür kalmasını sağlıyoruz */
.col-lg-4 .table-sm.mobile-cart-table.table thead[b-1g4bdrie5f] {
    position: sticky !important;
    top: 0 !important;
    background-color: white !important;
    z-index: 20 !important;
    box-shadow: 0 2px 3px rgba(0,0,0,0.1) !important; /* Hafif gölge ekledik */
}

/* Tablo hücreleri */
.col-lg-4 .table-sm.mobile-cart-table.table th[b-1g4bdrie5f],
.col-lg-4 .table-sm.mobile-cart-table.table td[b-1g4bdrie5f] {
    padding: 6px 8px !important; /* Daha geniş iç boşluk */
    line-height: 1.3 !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* İndeks (sıra numarası) sütunu genişlik ayarı */
.col-lg-4 .table-sm.mobile-cart-table.table th:first-child[b-1g4bdrie5f],
.col-lg-4 .table-sm.mobile-cart-table.table td:first-child[b-1g4bdrie5f] {
    width: 40px !important; /* İndeks sütunu genişliği */
    text-align: center !important;
}

/* Ürün adı sütunu - En geniş alan */
.col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(2)[b-1g4bdrie5f],
.col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(2)[b-1g4bdrie5f] {
    width: 40% !important; /* Ürün adı sütunu genişliği */
}

/* Adet sütunu */
.col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(3)[b-1g4bdrie5f],
.col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(3)[b-1g4bdrie5f] {
    width: 15% !important; /* Adet sütunu genişliği */
    text-align: center !important;
}

/* Fiyat sütunu */
.col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(4)[b-1g4bdrie5f],
.col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(4)[b-1g4bdrie5f] {
    width: 20% !important; /* Fiyat sütunu genişliği */
    text-align: right !important;
}

/* Toplam sütunu */
.col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(5)[b-1g4bdrie5f],
.col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(5)[b-1g4bdrie5f] {
    width: 25% !important; /* Toplam sütunu genişliği */
    text-align: right !important;
}

/* Sepet panelinin sol kenar boşluğunu düzelt */
.quicksale-container .col-lg-4[b-1g4bdrie5f] {
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: 0 !important;
}

/* Alt ödeme bölümü */
.col-lg-4 .p-2.border-top.bg-light[b-1g4bdrie5f] {
    padding: 10px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    border-top: 1px solid #dee2e6 !important;
    background-color: #f8f9fa !important; /* Ödeme alanı için açık gri */
}

/* Toplam fiyat ve ödeme butonları */
.col-lg-4 .total-price-section.mb-2[b-1g4bdrie5f] {
    margin-bottom: 10px !important;
}

.col-lg-4 h5.mb-2.text-center[b-1g4bdrie5f] {
    margin-bottom: 10px !important;
    font-weight: 500 !important;
}

.col-lg-4 .payment-options-horizontal[b-1g4bdrie5f] {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 !important;
}

/* Ürün grupları kartlarını küçült */
.group-card[b-1g4bdrie5f] {
    height: 70px !important; /* Daha küçük yükseklik */
}

/* Datagrid yazı boyutu */
.table-sm.mobile-cart-table.table th[b-1g4bdrie5f],
.table-sm.mobile-cart-table.table td[b-1g4bdrie5f] {
    font-size: 15px !important; /* Datagrid yazı boyutu artırıldı */
}

/* Grup kartları ve ürün kartları yazı boyutu */
.group-card-title[b-1g4bdrie5f],
.product-title[b-1g4bdrie5f] {
    font-size: 15px !important; /* Grid yazı boyutu artırıldı */
}

/* Ürün fiyatları yazı boyutu */
.product-price[b-1g4bdrie5f] {
    font-size: 15px !important; /* Fiyat yazı boyutu artırıldı */
}

/* Tablodaki seçili satır için stil */
.table-row.selected[b-1g4bdrie5f] {
    background-color: #007bff !important;
    color: white !important;
}

.table-row:hover[b-1g4bdrie5f] {
    background-color: #f1f1f1 !important;
    cursor: pointer !important;
}

/* İki panel arası renk farkını daha belirgin hale getir - Border ekle */
@media (min-width: 992px) {
    .col-lg-4[b-1g4bdrie5f] {
        border-right: 1px solid #dee2e6 !important;
    }
    
    .col-lg-8[b-1g4bdrie5f] {
        border-left: 1px solid #dee2e6 !important;
    }
}

/* Mobil görünüm düzenlemeleri */
@media (max-width: 991px) {
    .quicksale-container .col-lg-4[b-1g4bdrie5f] {
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    
    /* İndeks sütununun genişliğini azalt */
    .col-lg-4 .table-sm.mobile-cart-table.table th:first-child[b-1g4bdrie5f],
    .col-lg-4 .table-sm.mobile-cart-table.table td:first-child[b-1g4bdrie5f] {
        width: 30px !important;
    }
    
    /* Adet sütunu genişliğini azalt */
    .col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(3)[b-1g4bdrie5f],
    .col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(3)[b-1g4bdrie5f] {
        width: 12% !important;
    }
    
    /* Fiyat ve toplam sütunlarını daralt */
    .col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(4)[b-1g4bdrie5f],
    .col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(4)[b-1g4bdrie5f],
    .col-lg-4 .table-sm.mobile-cart-table.table th:nth-child(5)[b-1g4bdrie5f],
    .col-lg-4 .table-sm.mobile-cart-table.table td:nth-child(5)[b-1g4bdrie5f] {
        width: 20% !important;
    }
}
/* /Components/Pages/Sales/TableSales/Index.razor.rz.scp.css */
/* 1366x768: Ürün düzenleme modali buton kenarlarını dikdörtgenleştir */
@media (max-width: 1366px) and (max-height: 768px) {
    /* Ürün düzenleme modali: tüm butonları keskin dikdörtgen yap */
    .product-edit-modal-content .btn[b-wuh4en1aet],
    .product-edit-modal-content .btn-lg[b-wuh4en1aet],
    .product-edit-modal-content .btn-outline-primary[b-wuh4en1aet],
    .product-edit-modal-content .btn-outline-success[b-wuh4en1aet],
    .product-edit-modal-content .btn-outline-warning[b-wuh4en1aet],
    .product-edit-modal-content .btn-outline-danger[b-wuh4en1aet],
    .product-edit-modal-content .btn-outline-secondary[b-wuh4en1aet],
    .product-edit-modal-content .btn-primary[b-wuh4en1aet],
    .product-edit-modal-content .btn-success[b-wuh4en1aet],
    .product-edit-modal-content .btn-warning[b-wuh4en1aet],
    .product-edit-modal-content .btn-danger[b-wuh4en1aet],
    .product-edit-modal-content .btn-secondary[b-wuh4en1aet] {
        border-radius: 0 !important;
    }

    /* +/- butonlarına ek garanti (inline stil taşıdıkları için) */
    .product-edit-modal-content .btn[style*="width: 60px"][style*="height: 60px"][b-wuh4en1aet] {
        border-radius: 0 !important;
    }

    /* Sayı girişi ve textarea da dikdörtgen */
    .product-edit-modal-content .form-control[b-wuh4en1aet],
    .product-edit-modal-content input.form-control[b-wuh4en1aet],
    .product-edit-modal-content textarea.form-control[b-wuh4en1aet] {
        border-radius: 0 !important;
    }
}

/* Force rectangular buttons specifically for Product Edit modal on 1366x768, override late rules */
@media (max-width: 1366px) and (max-height: 768px) {
    .modal-backdrop .modal-content.product-edit-modal-content .btn[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-lg[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-primary[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-success[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-warning[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-danger[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-secondary[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-primary[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-success[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-warning[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-danger[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-secondary[b-wuh4en1aet] {
        border-radius: 0 !important;
    }

    /* Override circular +/- buttons defined elsewhere */
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-danger.btn-lg[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-success.btn-lg[b-wuh4en1aet] {
        border-radius: 0 !important;
    }

    /* Inputs */
    .modal-backdrop .modal-content.product-edit-modal-content .form-control[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content input.form-control[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content textarea.form-control[b-wuh4en1aet] {
        border-radius: 0 !important;
    }

    /* Normalize heights to match keyboard button/textarea */
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-danger.btn-lg[b-wuh4en1aet],
    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-success.btn-lg[b-wuh4en1aet] {
        width: 50px !important;
        height: 50px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .modal-backdrop .modal-content.product-edit-modal-content input[type="number"].form-control.text-center[b-wuh4en1aet] {
        height: 50px !important;
        line-height: 50px !important;
    }

    .modal-backdrop .modal-content.product-edit-modal-content .btn-outline-secondary[b-wuh4en1aet] { /* keyboard button */
        min-width: 50px !important;
        height: 50px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .modal-backdrop .modal-content.product-edit-modal-content textarea.form-control[b-wuh4en1aet] {
        height: 50px !important;
    }

    /* Action buttons (İskonto Yap / İkram Yap / Ödenmez / İptal Et) */
    .modal-backdrop .modal-content.product-edit-modal-content .btn-lg.flex-grow-1[b-wuh4en1aet] {
        height: 50px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Bottom action buttons (Kapat / Kaydet) */
    .modal-backdrop .modal-content.product-edit-modal-content .d-flex.justify-content-end .btn.btn-lg[b-wuh4en1aet] {
        height: 50px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}
/* === OVERRIDE: Zayi (Waste) Content Styles === */
.cart-item-waste-content[b-wuh4en1aet] {
    background-color: #FFF3E0 !important; /* Çok açık turuncu arkaplan */
    color: #E65100 !important; /* Koyu turuncu yazı */
    font-weight: 500 !important;
    padding: 0.4rem 0.5rem !important;
    font-size: 0.85rem !important;
    border-left: 3px solid #FF8C00 !important; /* Dark Orange sol kenarlık */
}

.cart-item-waste-content i[b-wuh4en1aet] {
    color: #FF8C00 !important; /* Dark Orange ikon rengi */
    margin-right: 0.4rem !important;
}

.cart-item-waste-content span[b-wuh4en1aet] {
    color: #E65100 !important; /* Koyu turuncu yazı rengi */
}

/* === OVERRIDE: Zayi Butonları için Özel Stiller === */
/* Zayi butonları için özel CSS sınıfları */
.btn-waste[b-wuh4en1aet] {
    background-color: #FF8C00 !important; /* Dark Orange arkaplan */
    border-color: #E67E22 !important; /* Daha koyu turuncu kenar */
    color: white !important;
}

.btn-waste:hover[b-wuh4en1aet] {
    background-color: #E67E22 !important; /* Hover'da daha koyu turuncu */
    border-color: #D35400 !important;
    color: white !important;
}

.btn-waste:focus[b-wuh4en1aet], .btn-waste:active[b-wuh4en1aet] {
    background-color: #D35400 !important;
    border-color: #C0392B !important;
    color: white !important;
}

.group-section[b-wuh4en1aet] {
    background-color: #f8f9fa;
    padding: 10px 15px; /* Daha fazla iç boşluk */
    max-height: 140px; /* Yüksekliği artır */
    overflow-y: auto; /* Gerekirse dikey kaydırma */
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px; /* Butonlar arası boşluğu artır */
    border-bottom: 1px solid #dee2e6; /* Alt kenar çizgisi */
    box-shadow: 0 2px 4px rgba(0,0,0,0.05); /* Hafif gölge ekle */
}

.group-button[b-wuh4en1aet] {
    font-size: 0.9rem;
    padding: 5px 10px;
    margin: 2px; 
    transition: all 0.2s ease-in-out;
    height: auto;
    white-space: nowrap;
}

    .group-button:hover[b-wuh4en1aet] {
        background-color: #007bff;
        color: #fff;
    }

/* Masa grupları butonları için özel stillemeler */
.group-section .btn[b-wuh4en1aet] {
    border-radius: 30px !important; /* Oval butonlar */
    padding: 10px 20px !important; /* Daha fazla iç boşluk */
    margin: 5px !important; /* Butonlar arası yeterli boşluk */
    font-weight: bold !important; /* Yazıyı kalınlaştırma */
    font-size: 1rem !important; /* Yazı boyutunu büyüt */
    min-width: 120px !important; /* Minimum genişlik */
    position: relative !important; /* Badge pozisyonu için */
    transition: all 0.2s ease-in-out !important; /* Yumuşak geçiş */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important; /* Hafif gölge */
    border-width: 2px !important; /* Kenar kalınlığını artır */
    overflow: visible !important; /* Badge'in dışarı taşmasına izin ver */
}

.group-section .btn:hover[b-wuh4en1aet] {
    transform: scale(1.03) !important; /* Sadece hafif büyüme efekti */
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important; /* Gölge efekti devam ediyor */
    z-index: 1 !important; /* Hover durumunda diğer butonların önüne geç */
}
/* Yeni eklenen ürünler ve eski ürünler arasındaki ayırıcı çizgi */
.new-items-separator-row td[b-wuh4en1aet] {
    padding: 0 !important; 
    border: none !important; 
    height: 10px; 
    line-height: 10px;
    /* Mavi çizginin altındaki varsayılan gri çizgiyi kaldırmak için (çakışmayı önle) */
    border-bottom: none !important; 
}

.new-items-separator-row td[b-wuh4en1aet]::before {
    content: "";
    display: block;
    width: 100%;
    border-top: 2px solid #007bff !important; 
    margin-top: 5px; 
    margin-bottom: 5px; 
}

/* Detay satırlarının (opsiyon/yorum) kendi aralarında çizgi olmasın */
.cart-item-detail-row td[b-wuh4en1aet] {
    border: none !important;
}
.new-items-separator-row + tr.table-row td[b-wuh4en1aet] {
    border-top: none !important;
}
.group-section .btn:active[b-wuh4en1aet] {
    transform: scale(0.98) !important; /* Tıklama anında hafif küçültme efekti, yukarı çıkma yok */
    box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important; /* Daha az gölge */
}

.group-section .btn-primary[b-wuh4en1aet] {
    background-color: #007bff !important; /* Seçili buton rengi */
    border-color: #0062cc !important; /* Daha koyu kenar rengi */
    color: #fff !important; /* Beyaz yazı */
}

.group-section .btn-outline-primary[b-wuh4en1aet] {
    color: #007bff !important; /* Seçili olmayan buton yazı rengi */
    border-color: #007bff !important; 
    background-color: rgba(255, 255, 255, 0.9) !important; /* Hafif beyaz arkaplan */
}

.group-section .btn-outline-primary:hover[b-wuh4en1aet] {
    background-color: rgba(0, 123, 255, 0.1) !important; /* Hover durumunda hafif mavi arkaplan */
}

/* Badge konumu ve stili düzenlemesi */
.table-count-badge[b-wuh4en1aet] {
    font-size: 0.7rem !important; /* Badge yazı boyutu biraz daha küçük */
    padding: 3px 5px !important; /* Badge iç boşluğu daha da azalt */
    position: absolute !important; /* Pozisyonu absolute olarak belirle */
    transform: none !important; /* Bootstrap'ın transform etkisini kaldır */
    box-shadow: 0 1px 3px rgba(0,0,0,0.2) !important; /* Daha hafif gölge */
    font-weight: bold !important; /* Yazıyı kalınlaştır */
    min-width: 30px !important; /* Minimum genişliği azalt */
    z-index: 9999 !important; /* En üstte görünmesi için çok yüksek z-index değeri */
    right: -5px !important; /* Sağa doğru konum ayarla */
    top: -5px !important; /* Üst konum ayarla */
    border: 2px solid white !important; /* Beyaz kenarlık kalınlığını artır */
}

/* Badge pozisyonunu buton pozisyonundan bağımsız hale getir */
.position-relative[b-wuh4en1aet] {
    position: relative !important;
    z-index: 1 !important; /* Buton z-index değeri badge'den düşük olmalı */
}

/* Grup butonlarının hover durumunda bile badge'leri üstte tut */
.group-section .btn:hover[b-wuh4en1aet] {
    z-index: 1 !important; /* Hover durumunda buton z-index değerini 1'e ayarla */
}

/* Badge'ler için ek stil düzenlemeleri */
.group-section .btn .table-count-badge[b-wuh4en1aet] {
    z-index: 9999 !important; /* Badge'in z-index değerini tekrar belirt */
    pointer-events: none !important; /* Badge tıklamalarını butona geçir */
}

.group-section .btn-primary .table-count-badge[b-wuh4en1aet] {
    background-color: #dc3545 !important; /* Aktif buton için kırmızı badge */
}

.group-section .btn-outline-primary .table-count-badge.bg-danger[b-wuh4en1aet] {
    background-color: #dc3545 !important; /* Pasif buton için kırmızı badge */
}

.group-section .btn-outline-primary .table-count-badge.bg-success[b-wuh4en1aet] {
    background-color: #28a745 !important; /* Pasif buton için yeşil badge */
}
/* Wizard Modal Fullscreen Styles */
.wizard-modal-fullscreen-backdrop[b-wuh4en1aet] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Default for wizard */
    z-index: 1070; 
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    display: block;
    overflow: hidden;
}

/* Backdrop: Semi-transparent like other modals */
div.modal-backdrop.fullscreen-modal-backdrop.cancellation-reason-modal-backdrop.show[b-wuh4en1aet] {
    background-color: transparent !important;
    opacity: 1 !important;
    z-index: 1080 !important;
}

/* Modal Panel: Light background, dark text */
.fullscreen-modal-content-dark[b-wuh4en1aet] {
    background-color: #ffffff !important; /* White panel background */
    color: #212529 !important; /* Dark text */
    border: 1px solid #dee2e6 !important; /* Standard light border */
    border-radius: 0.3rem !important;
    width: 70vw;
    max-width: 700px; /* Suitable max-width for content */
    height: auto;
    max-height: 90vh; /* Prevent modal from being too tall */
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 0.3rem 0.7rem rgba(0, 0, 0, 0.15) !important; /* Standard shadow */
    margin: 1rem auto !important; /* Center with some margin */
}

.cancellation-reason-modal-content .modal-header[b-wuh4en1aet] {
    background-color: #f8f9fa; /* Light grey header */
    color: #212529;
    border-bottom: 1px solid #dee2e6;
    padding: 0.8rem 1.2rem; /* Adjusted padding */
}

.cancellation-reason-modal-content .modal-header .modal-title[b-wuh4en1aet] {
    font-size: 1.2rem; /* Clear title size */
    color: #212529;
    font-weight: 500;
}

.cancellation-reason-modal-content .modal-header .btn-close[b-wuh4en1aet] {
    filter: none; /* No color inversion */
    opacity: 0.6;
}
.cancellation-reason-modal-content .modal-header .btn-close:hover[b-wuh4en1aet] {
    opacity: 0.9;
}

.cancellation-reason-modal-content .modal-body[b-wuh4en1aet] {
    padding: 0.75rem 1rem;
    overflow-y: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    background-color: #ffffff; /* Ensure body is white */
}

.cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet] {
    background-color: #ffffff !important; /* White textarea */
    color: #212529 !important; /* Dark text */
    border: 1px solid #ced4da !important; /* Standard input border */
    font-size: 1rem;
    min-height: 60px;
    max-height: 100px;
    margin-bottom: 0.75rem;
    width: 100%;
    box-sizing: border-box;
    padding: 0.5rem 0.75rem;
    resize: none; /* Disable manual resize */
}

.cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet]::placeholder {
    color: #6c757d;
}

/* Light Theme Responsive On-Screen Keyboard */
.cancellation-reason-modal-content .on-screen-keyboard[b-wuh4en1aet] {
    display: flex;
    flex-direction: column;
    padding: 0.3rem;
    background-color: #f0f2f5 !important; /* Light keyboard tray background */
    border: 1px solid #d8dde3; /* Light border for tray */
    border-radius: 5px;
    margin-top: auto; /* Pushes keyboard to bottom of modal-body flex container */
    width: 100%;
    box-sizing: border-box;
}

.cancellation-reason-modal-content .keyboard-row[b-wuh4en1aet] {
    display: flex;
    justify-content: center;
    margin-bottom: 0.25rem;
    width: 100%;
}

.cancellation-reason-modal-content .keyboard-key[b-wuh4en1aet] {
    background-color: #ffffff !important; /* White keys */
    color: #343a40 !important; /* Dark grey text */
    border: 1px solid #bcc3ca !important; /* Slightly darker border for keys */
    border-radius: 4px;
    padding: 0.35rem;
    margin: 0.18rem;
    font-size: 0.85rem;
    font-weight: 400;
    flex-grow: 1;
    flex-basis: 0;
    min-width: 30px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.1s, border-color 0.1s, transform 0.05s;
    text-align: center;
    line-height: 1;
    box-shadow: 0 1px 1px rgba(0,0,0,0.05); /* Subtle shadow for keys */
}

.cancellation-reason-modal-content .keyboard-key:hover[b-wuh4en1aet] {
    background-color: #e9ecef !important;
    border-color: #adb5bd !important;
}

.cancellation-reason-modal-content .keyboard-key:active[b-wuh4en1aet] {
    background-color: #dee2e6 !important;
    transform: scale(0.96);
}

.cancellation-reason-modal-content .keyboard-key.key-space[b-wuh4en1aet] {
    flex-grow: 4;
    background-color: #f8f9fa !important; /* Slightly different for space */
}
.cancellation-reason-modal-content .keyboard-key.key-space:hover[b-wuh4en1aet] {
    background-color: #e2e6ea !important;
}

.cancellation-reason-modal-content .keyboard-key.key-backspace[b-wuh4en1aet],
.cancellation-reason-modal-content .keyboard-key.key-caps[b-wuh4en1aet] {
    flex-grow: 1.5;
    background-color: #e9ecef !important; /* Function key differentiation */
    font-weight: 500;
}
.cancellation-reason-modal-content .keyboard-key.key-backspace:hover[b-wuh4en1aet],
.cancellation-reason-modal-content .keyboard-key.key-caps:hover[b-wuh4en1aet] {
    background-color: #d8dde2 !important;
}

.cancellation-reason-modal-content .keyboard-key i[b-wuh4en1aet] {
    font-size: 1.05rem;
}

.cancellation-reason-modal-content .keyboard-key.key-caps.active[b-wuh4en1aet] {
    background-color: #0d6efd !important; /* Bootstrap primary blue */
    color: white !important;
    border-color: #0a58ca !important;
}

.cancellation-reason-modal-content .modal-footer[b-wuh4en1aet] {
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
    padding: 0.75rem 1.25rem;
    display: flex;
    justify-content: space-between;
}
.cancellation-reason-modal-backdrop .modal-dialog.modal-fullscreen[b-wuh4en1aet] {
    background-color: transparent !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}
/* DELETE THESE RULES from the <style> tag in Index.razor */
.on-screen-keyboard[b-wuh4en1aet] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
}

.keyboard-key[b-wuh4en1aet] {
    flex: 1 0 10%;
    margin: 5px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    transition: background-color 0.2s;
}

.keyboard-key:hover[b-wuh4en1aet] {
    background-color: #f0f0f0;
}

.keyboard-key.active[b-wuh4en1aet] {
    background-color: #007bff;
    color: #fff;
}

.keyboard-key.capslock[b-wuh4en1aet] {
    background-color: #ffc107;
    color: #000;
}

.keyboard-key.capslock.active[b-wuh4en1aet] {
    background-color: #007bff;
    color: #fff;
}

.keyboard-key.space[b-wuh4en1aet] {
    flex: 1 0 30%;
}

.keyboard-key.enter[b-wuh4en1aet] {
    flex: 1 0 20%;
}
.modal-backdrop[b-wuh4en1aet] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050;
}

.modal-content[b-wuh4en1aet] {
    background: white;
    padding: 2rem;
    border-radius: 10px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    width: 100%;
    max-width: 500px;
}

/* Input alanındaki ok tuşlarını gizle */
input[type="number"][b-wuh4en1aet]::-webkit-outer-spin-button,
input[type="number"][b-wuh4en1aet]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"][b-wuh4en1aet] {
    -moz-appearance: textfield;
}
.wizard-modal-fullscreen-content[b-wuh4en1aet] {
    position: absolute;
    top: 50%; /* Center vertically */
    left: 50%; /* Center horizontally */
    transform: translate(-50%, -50%); /* Precise centering */
    background-color: #f8f9fa;
    width: calc(100% - 40px); /* More margin for smaller screens */
    height: calc(100% - 40px);
    max-width: 1400px; /* Slightly reduced max-width */
    max-height: 900px; /* Max height to prevent overly tall modals */
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.5);
    box-sizing: border-box;
    border-radius: 0.5rem;
}

.wizard-modal-header[b-wuh4en1aet] {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background-color: #343a40;
    color: #fff;
    flex-shrink: 0;
    box-sizing: border-box;
    border-radius: 0.5rem 0.5rem 0 0;
    height: 70px; /* Fixed height */
}

.wizard-product-info .wizard-product-name[b-wuh4en1aet] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 500;
}

.wizard-product-info .wizard-product-price[b-wuh4en1aet] {
    margin: 0;
    font-size: 1rem;
    opacity: 0.8;
}

.wizard-close-button[b-wuh4en1aet] {
    background-color: transparent;
    border: none;
    font-size: 1.5rem;
    color: #fff;
    opacity: 0.9;
}
.btn-close.wizard-close-button[b-wuh4en1aet] { /* Specificity for bootstrap btn-close */
    filter: invert(1) grayscale(100%) brightness(200%); /* Makes bootstrap default X white */
}


.wizard-modal-body[b-wuh4en1aet] {
    position: relative;
    display: flex;
    flex: 1;
    overflow: hidden;
    padding: 0.75rem;
    gap: 0.75rem;
    box-sizing: border-box;
    width: 100%;
    max-height: calc(100% - 150px); /* Subtract header + footer height */
}

.wizard-options-panel[b-wuh4en1aet] {
    flex: 2;
    min-width: 0;
    max-width: 70%;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    background-color: #fff;
    border-radius: 0.25rem;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    box-sizing: border-box;
}

.wizard-group-header[b-wuh4en1aet] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.wizard-group-name[b-wuh4en1aet] {
    font-size: 1.25rem;
    font-weight: 500;
    margin:0;
}

.wizard-required-text[b-wuh4en1aet] {
    font-size: 0.9rem;
    color: #dc3545; /* Red for required */
}

.wizard-step-indicator[b-wuh4en1aet] {
    font-size: 0.9rem;
    color: #6c757d; /* Muted color */
}

.wizard-options-grid[b-wuh4en1aet] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); /* 180px'den 100px'e düşürüldü */
    gap: 0.5rem;
    box-sizing: border-box;
    padding: 0.5rem;
}

.wizard-option-item[b-wuh4en1aet] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-align: center;
    min-height: 50px; /* 80px'den 50px'e düşürüldü */
    box-sizing: border-box;
}

.wizard-option-item:hover[b-wuh4en1aet] {
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

.wizard-option-item.selected[b-wuh4en1aet] {
    background-color: #007bff;
    color: #fff;
    border-color: #007bff;
}

.wizard-option-item .wizard-option-name[b-wuh4en1aet] {
    font-weight: 500;
    font-size: 0.9rem; /* Yazı boyutu küçültüldü */
    margin-bottom: 0.2rem;
}

.wizard-option-item .wizard-option-price[b-wuh4en1aet] {
    font-size: 0.8rem; /* Yazı boyutu küçültüldü */
    opacity: 0.8;
}

.wizard-option-item.selected .wizard-option-price[b-wuh4en1aet] {
    opacity: 1;
}

.wizard-summary-panel[b-wuh4en1aet] {
    flex: 1;
    min-width: 0;
    max-width: 30%;
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    border-radius: 0.25rem;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    box-sizing: border-box;
    overflow: hidden;
}

.wizard-selected-options-container[b-wuh4en1aet] {
    flex: 1;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
    min-height: 0;
}

.wizard-quantity-section[b-wuh4en1aet] {
    position: relative;
    padding: 0.75rem 0 0 0;
    flex-shrink: 0;
    box-sizing: border-box;
}

.wizard-summary-title[b-wuh4en1aet] {
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 0.75rem;
}
.wizard-selected-options-list[b-wuh4en1aet] {
    max-height: none; /* Let container handle scrolling */
    overflow: visible;
    font-size: 0.9rem;
}
.wizard-selected-options-list strong[b-wuh4en1aet] {
    font-weight: 500;
}
.wizard-selected-options-list ul ul[b-wuh4en1aet] {
    font-size: 0.85rem;
    color: #495057;
}


.wizard-quantity-controls[b-wuh4en1aet] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.wizard-quantity-button[b-wuh4en1aet] {
    width: 45px;
    height: 45px;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    transition: all 0.2s;
}

.wizard-quantity-value[b-wuh4en1aet] {
    font-size: 1.5rem;
    font-weight: bold;
    min-width: 60px;
    text-align: center;
}

.wizard-error-message[b-wuh4en1aet] {
    flex-shrink: 0; /* Prevent error message from shrinking */
    margin-top: 0.5rem;
    box-sizing: border-box; /* Added for consistency */
}

.wizard-modal-footer[b-wuh4en1aet] {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
    flex-shrink: 0;
    box-sizing: border-box;
    height: 80px;
    border-radius: 0 0 0.5rem 0.5rem;
}

.wizard-nav-button[b-wuh4en1aet] {
    font-size: 1rem;
    padding: 0.6rem 1.2rem; /* Larger padding for touch */
    min-width: 120px; /* Minimum width for buttons */
}
.wizard-nav-button i[b-wuh4en1aet] {
    margin-right: 0.5rem;
}
.fullscreen-modal-backdrop[b-wuh4en1aet] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    overflow-y: auto;
    padding: 1rem;
}

.fullscreen-modal-content[b-wuh4en1aet] {
    background-color: #fff;
    border-radius: 1rem;
    box-shadow: 0 0 20px rgba(0,0,0,0.2);
    padding: 2rem 1.5rem;
    max-width: 600px;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
}
.payment-ui .modal-body[b-wuh4en1aet] {
    overflow: hidden;
}

.payment-panel[b-wuh4en1aet] {
    border-left: 1px solid #dee2e6;
}

.payment-panel-content[b-wuh4en1aet]::-webkit-scrollbar {
    width: 8px;
}

.payment-panel-content[b-wuh4en1aet]::-webkit-scrollbar-track {
    background: transparent;
}

.payment-panel-content[b-wuh4en1aet]::-webkit-scrollbar-thumb {
    background-color: #c1c1c1;
    border-radius: 4px;
}

.payment-panel-content[b-wuh4en1aet]::-webkit-scrollbar-thumb:hover {
    background-color: #a8a8a8;
}

.payment-ui .table-row td[b-wuh4en1aet] {
    padding: 0.4rem;
    vertical-align: middle;
}

.payment-ui .table thead[b-wuh4en1aet] {
    z-index: 1;
}

.payment-ui .btn-group-sm > .btn[b-wuh4en1aet] {
    padding: .25rem .5rem;
    font-size: .875rem;
    border-radius: .2rem;
}

.payment-ui .btn-group-sm > .btn i[b-wuh4en1aet] {
    vertical-align: middle;
}

@media (max-width: 991.98px) {
    .payment-ui .modal-body > .row[b-wuh4en1aet] {
        flex-direction: column;
    }

    .payment-ui .row > .col-lg-7[b-wuh4en1aet] {
         height: 50vh !important;
         order: 1;
    }
    .payment-ui .row > .col-lg-5[b-wuh4en1aet] {
         height: calc(100vh - 58px - 50vh) !important; /* Full height minus header and top part */
         order: 2;
    }

    .payment-panel[b-wuh4en1aet] {
        border-left: none;
        border-top: 1px solid #dee2e6;
        margin-top: 1rem;
    }
}
/* === 1366x768 RESPONSIVE OPTIMIZATIONS === */
/* Bu düzenlemeler 1920x1080'i hiç etkilemez, sadece 1366x768 ekranları optimize eder */

@media (max-width: 1366px) {
    /* ANA LAYOUT - Daha compakt yapı */
    body[b-wuh4en1aet], html[b-wuh4en1aet] {
        font-size: 14px !important; /* Genel font boyutunu küçült */
    }
    
    /* MASA GRUPLARI SEKSİYONU */
    .group-section[b-wuh4en1aet] {
        padding: 6px 10px !important; /* Daha az iç boşluk */
        max-height: 110px !important; /* Daha düşük yükseklik */
        gap: 4px !important; /* Daha az boşluk */
    }
    
    .group-section .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük yazı */
        padding: 6px 12px !important; /* Daha az iç boşluk */
        min-width: 95px !important; /* Daha dar minimum genişlik */
        margin: 2px !important; /* Daha az dış boşluk */
        line-height: 1.2 !important; /* Satır yüksekliğini azalt */
    }
    
    .table-count-badge[b-wuh4en1aet] {
        font-size: 0.6rem !important; /* Daha küçük badge */
        padding: 1px 3px !important; /* Daha az iç boşluk */
        min-width: 18px !important; /* Daha küçük minimum genişlik */
        right: -3px !important; /* Konumu ayarla */
        top: -3px !important; /* Konumu ayarla */
    }
    
    /* ÜRÜN GRID VE KARTLARI */
    .product-grid[b-wuh4en1aet] {
        gap: 0.25rem !important; /* Ürünler arası boşluğu azalt */
        padding: 0.4rem !important; /* Grid'in genel iç boşluğunu azalt */
        grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important; /* Daha küçük kart genişliği */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 85px !important; /* Daha düşük minimum yükseklik */
        padding: 3px !important; /* Daha az iç boşluk */
    }

    .product-image.has-image[b-wuh4en1aet] {
        height: 40px !important; /* Resim yüksekliğini azalt */
        margin-bottom: 2px !important;
    }

    .product-title[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Ürün başlık fontunu küçült */
        line-height: 1.1 !important; /* Satır yüksekliğini azalt */
        margin-bottom: 2px !important;
    }

    .product-price[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Fiyat fontunu küçült */
        margin-bottom: 1px !important;
    }
    
    /* MASA KARTLARI */
    .table-card[b-wuh4en1aet] {
        width: 140px !important; /* Daha dar masa kartları */
        height: 180px !important; /* Daha kısa masa kartları */
        margin: 5px !important; /* Daha az dış boşluk */
        font-size: 0.7rem !important; /* Daha küçük font */
    }
    
    .responsive-table-card[b-wuh4en1aet] {
        padding: 8px !important; /* Daha az iç boşluk */
    }
    
    .responsive-table-card h5[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük başlık */
        margin-bottom: 4px !important;
    }
    
    .responsive-table-card .small[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük küçük yazılar */
        line-height: 1.1 !important;
    }
    
    /* MASA BAŞLIK BİLGİLERİ */
    .mesa-title[b-wuh4en1aet] {
        font-size: 1rem !important; /* Daha küçük masa başlığı */
        padding: 0.3rem 0.5rem !important;
    }
    
    .masa-info-box[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük bilgi kutusu */
        padding: 0.2rem 0.4rem !important;
    }
    
    /* BUTONLAR */
    .btn-square[b-wuh4en1aet] {
        width: 35px !important; /* Daha küçük square butonlar */
        height: 35px !important;
        font-size: 0.8rem !important;
    }
    
    .btn-lg[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Büyük butonları küçült */
        padding: 0.4rem 0.8rem !important;
    }
    
    /* SEPET PANELİ */
    .mobile-cart-table th[b-wuh4en1aet],
    .mobile-cart-table td[b-wuh4en1aet] {
        padding: 3px !important; /* Daha az cell padding */
        font-size: 0.75rem !important; /* Daha küçük tablo yazısı */
    }
    
    /* MODAL VE WIZARD */
    .wizard-modal-body[b-wuh4en1aet] {
        padding: 0.8rem !important; /* Daha az modal padding */
    }
    
    .wizard-option-item[b-wuh4en1aet] {
        padding: 0.4rem !important; /* Daha az option padding */
        font-size: 0.8rem !important;
    }
    
    .wizard-quantity-button[b-wuh4en1aet] {
        width: 35px !important; /* Daha küçük quantity butonlar */
        height: 35px !important;
        font-size: 0.8rem !important;
    }
    
    /* PAYMENT OPTIONS */
    .payment-options .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük ödeme butonları */
        padding: 0.4rem 0.6rem !important;
    }
    
    /* ACCORDION */
    .accordion-button[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük accordion başlıkları */
        padding: 0.6rem 1rem !important;
    }
}

@media (max-width: 768px) {
    .fs-big[b-wuh4en1aet] {
        font-size: 1.8rem;
    }
    .wizard-modal-body[b-wuh4en1aet] {
        flex-direction: column;
        overflow-y: auto; /* Allow body scroll on small screens if needed */
    }

    .wizard-options-panel[b-wuh4en1aet] {
        flex: 2;
        min-height: 50vh;
    }

    .wizard-summary-panel[b-wuh4en1aet] {
        flex: 1;
        min-height: 30vh;
    }

    .wizard-quantity-section[b-wuh4en1aet] {
        padding: 0.5rem 0;
    }

    .wizard-quantity-button[b-wuh4en1aet] {
        width: 45px;
        height: 45px;
    }

    .wizard-modal-footer[b-wuh4en1aet] {
        height: 70px;
        padding: 0.5rem;
        gap: 0.5rem;
    }

    .wizard-options-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); /* Mobilde daha da küçük */
        gap: 0.4rem;
        padding: 0.4rem;
    }
    .wizard-nav-button[b-wuh4en1aet] {
        flex-grow: 1; /* Allow buttons to take available space */
        min-width: 100px;
    }
    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 0.25rem;
        padding: 0.3rem;
    }
    .product-card[b-wuh4en1aet] {
        min-height: 90px;
    }
    .product-image.has-image[b-wuh4en1aet] {
        height: 40px;
    }
}

@media (min-width: 769px) {
    .fs-big[b-wuh4en1aet] {
        font-size: 2.2rem;
    }
}
/* Responsive düzenlemeler - 768px ekranlar için */
@media (max-width: 768px) {
    .group-section .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha da küçük yazı */
        padding: 7px 14px !important; /* Daha da az iç boşluk */
        min-width: 100px !important; /* Daha da az minimum genişlik */
        margin: 3px !important; /* Daha az dış boşluk */
    }
    
    .table-count-badge[b-wuh4en1aet] {
        font-size: 0.6rem !important; /* Daha da küçük badge */
        padding: 2px 3px !important; /* Daha da az iç boşluk */
        min-width: 22px !important; /* Daha da küçük minimum genişlik */
        right: -3px !important; /* Konumu ayarla */
        top: -3px !important; /* Konumu ayarla */
    }
}

/* Mobil Üst Menü */
.mobile-top-menu[b-wuh4en1aet] {
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.cart-badge[b-wuh4en1aet] {
    position: absolute;
    top: -8px;
    right: -8px;
    font-size: 0.7rem;
}

/* Mobil Sepet Tablosu */
.mobile-cart-table[b-wuh4en1aet] {
    width: 100%;
    font-size: 14px;
}

.mobile-cart-table th[b-wuh4en1aet], 
.mobile-cart-table td[b-wuh4en1aet] {
    padding: 4px;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Specific padding for product name cell */
.mobile-cart-table td.product-name-cell[b-wuh4en1aet] {
    padding-left: 8px !important; 
}

/* Specific padding for options and comment content cells */
.mobile-cart-table td.cart-item-options-content[b-wuh4en1aet],
.mobile-cart-table td.cart-item-comment-content[b-wuh4en1aet] {
    padding-left: 0 !important; /* Text will start right after the icon's margin */
}

/* İkonların hizasını ve metinle arasını daha iyi ayarlamak için */
.cart-item-options-content i[b-wuh4en1aet],
.cart-item-comment-content i[b-wuh4en1aet] {
    vertical-align: middle; /* İkonu metinle ortala */
    /* margin-right: 4px; zaten me-1 var, bu daha hassas olabilir */
}

.cart-item-options-content span[b-wuh4en1aet],
.cart-item-comment-content span[b-wuh4en1aet] {
    vertical-align: middle; /* Metni ikonla ortala */
}
.mobile-cart-table tbody tr td[b-wuh4en1aet] {
    border-top: none !important; 
    border-bottom: none !important;
}
.mobile-cart-table tbody tr.table-row td[b-wuh4en1aet] {
    border-bottom: 1px solid #f0f0f0 !important; /* Her table-row altına varsayılan ince gri çizgi */
}
/* Masalar Alanı (Alt Bölüm) */
.table-section[b-wuh4en1aet] {
    padding: 5px; /* Genel boşluk azaldı */
    display: flex;
    flex-wrap: wrap; /* Kartların alt alta kayması */
    gap: 2px; /* Kartlar arasındaki boşluk azaldı */
    justify-content: flex-start; /* Sola yasla */
    overflow-y: auto; /* Dikey kaydırma */
    height: calc(100vh - 130px); /* Masa grupları çıkarılarak hesaplanan yükseklik */
}

/* Masa Kartı */
.table-card[b-wuh4en1aet] {
    width: 120px; /* Kart genişliğini küçülttük */
    height: 120px; /* Kart yüksekliğini küçülttük */
    border: 1px solid #ccc;
    border-radius: 5px; /* Hafif köşe yuvarlatma */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    margin: 1px; /* Kartlar arasındaki boşluk daha da az */
}

.responsive-table-card[b-wuh4en1aet] {
    width: 150px; /* Desktop için eski boyut */
    min-height: 130px; /* Biraz daha yüksek */
    border-radius: 20px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 10px; /* Biraz daha fazla iç boşluk */
    overflow: visible; /* Taşan içeriğin görünmesine izin ver */
    margin: 2px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border: 1px solid #ddd;
    background-color: #007bff; /* Mavi arka plan */
    position: relative; /* Gösterge için position relative eklendi */
}

.responsive-table-card h5[b-wuh4en1aet],
.responsive-table-card .small[b-wuh4en1aet],
.responsive-table-card .text-danger[b-wuh4en1aet],
.responsive-table-card .text-secondary[b-wuh4en1aet] {
    position: relative; /* Pozisyon ayarı */
    z-index: 1; /* Diğer elementlerin üzerinde görünmesi için */
    margin: 3px 0; /* Marjin düzenlemesi */
    max-width: 100%; /* Maksimum genişlik */
    word-break: break-word; /* Uzun kelimeleri kır */
}

.responsive-table-card h5[b-wuh4en1aet] {
    font-size: 15px; /* Biraz daha büyük yazı boyutu */
    line-height: 1.5; /* Satır yüksekliği arttı */
    margin-bottom: 8px;
    text-align: center;
    width: 100%;
    overflow: visible; /* Taşan içeriğin görünmesine izin ver */
    white-space: normal; /* Yazının birden fazla satıra bölünmesine izin ver */
    font-weight: bold;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.responsive-table-card hr[b-wuh4en1aet] {
    width: 100%; /* Tam genişlik */
    height: 2px; /* Yeterince kalın ama fazla değil */
    border: none; /* Kenarlık yok */
    margin: 5px 0; /* Marjinleri azaltarak hizalamayı iyileştir */
    padding: 0; /* Padding'i kaldır */
    opacity: 0.8; /* Netlik için */
    position: relative; /* Pozisyonlama ekle */
    left: 0; /* Sol kenara hizala */
    right: 0; /* Sağ kenara hizala */
}

.responsive-table-card .small[b-wuh4en1aet] {
    font-size: 12px; /* Daha küçük yazı boyutu */
    line-height: 1.5; /* Daha dar satır aralığı */
    margin-bottom: 4px; /* Daha fazla boşluk */
    width: 100%;
    overflow: visible; /* Taşan içeriğin görünmesine izin ver */
    white-space: normal; /* Yazının birden fazla satıra bölünmesine izin ver */
    font-weight: 500;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
    position: relative; /* Pozisyon ayarı */
    z-index: 2; /* Diğer elementlerin üzerinde görünmesi için */
}

.responsive-table-card .text-danger[b-wuh4en1aet],
.responsive-table-card .text-secondary[b-wuh4en1aet] {
    font-size: 14px; /* Biraz daha büyük yazı boyutu */
    line-height: 1.7; /* Satır yüksekliği arttı */
    font-weight: bold;
    margin-top: 8px;
    text-align: center;
    width: 100%;
    overflow: visible; /* Taşan içeriğin görünmesine izin ver */
    white-space: normal; /* Yazının birden fazla satıra bölünmesine izin ver */
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.responsive-table-card .text-danger[b-wuh4en1aet] {
    display: none; /* Açık yazısını gizle */
}

/* Masa Kartı Hover Efekti */
.table-card:hover[b-wuh4en1aet] {
    transform: translateY(-2px); /* Hoverda hafif yukarı kalkma efekti */
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1); /* Hafif gölge */
}

/* Kart İçindeki Yazı */
.table-card h6[b-wuh4en1aet] {
    font-size: 0.75rem; /* Yazı boyutunu küçülttük */
    margin: 0;
    padding: 0;
    text-align: center;
}

/* Ürün Grid Tasarımı */
.product-grid[b-wuh4en1aet] {
    overflow-y: auto;
    flex-grow: 1;
    padding: 0.2rem 0.2rem 50px 0.2rem;
    overflow-x: hidden; 
    display: flex; 
    flex-wrap: wrap; 
    align-items: flex-start; 
    align-content: flex-start;
    justify-content: flex-start; 
    gap: 0.3rem; /* Küçültüldü */
}

.product-card[b-wuh4en1aet] {
    border: 1px solid #777;
    border-radius: 3px;
    background-color: #fff;
    margin: 0;
    padding: 3px;
    display: flex;
    flex-direction: column; 
    align-items: center; 
    cursor: pointer;
    overflow: hidden;
    min-height: 120px; 
    height: 120px;     
    width: 120px;      
    text-align: center;
}

.product-name[b-wuh4en1aet] {
    font-weight: bold;
    color: black;
}
.product-image-container[b-wuh4en1aet] { /* Eğer resmi bir div içinde sarmalıyorsan bu sınıfı kullanın */
    width: 100%;
    height: 70px; /* Resim için sabit bir yükseklik verelim, kart yüksekliğine göre ayarlayın */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px; /* Resim ile başlık arası boşluk */
    overflow: hidden; /* Bu konteyner dışına taşan resmi gizle */
}
/* Ürün Resmi */
/* Ürün resmi için sarmalayıcı div (.product-image sınıfı sizin Razor'da kullandığınız) */
.product-image.has-image[b-wuh4en1aet] {
    width: 100%;
    height: 55px; 
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 3px;
    overflow: hidden;
    flex-shrink: 0;
}

.product-image img[b-wuh4en1aet] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}



/* Yeni sarmalayıcı div için stil */
.product-details-wrapper[b-wuh4en1aet] {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Değişti: space-between ile başlık ortada, fiyat altta */
    align-items: center; 
    flex-grow: 1;
    width: 100%;
    overflow: hidden;
    padding: 0 1px;
    text-align: center;
    min-height: 0;
    height: 100%; /* Tam yükseklik kullan */
}

.product-title[b-wuh4en1aet] {
    font-weight: bold;
    color: black;
    margin: 0;
    padding: 0;
    white-space: normal; 
    text-align: center;
    width: 100%;
    height: auto;
    line-height: 1.1;
    word-break: break-word;
    font-size: 12px; /* Biraz büyütüldü */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 1; /* Orta alanda büyüsün */
}

/* Ürün Fiyatı */
.product-price[b-wuh4en1aet] {
    font-size: 11px; /* Biraz büyütüldü */
    font-weight: bold;
    color: #000;
    padding: 0;
    text-align: center;
    width: 100%;
    margin-top: auto; /* Alt tarafa yapıştır */
}



/* REMOVED: Rule that was explicitly showing price for Product Cards WITH Images */
/* .product-card:has(.product-image.has-image) .product-price {
    display: block; 
} */

/* Ürün Grupları Grid Yapısı */
.group-grid[b-wuh4en1aet] {
    display: grid; 
    grid-template-columns: repeat(8, 1fr); 
    gap: 5px; 
    padding: 5px; /* Base padding, pt-3 from Razor will override padding-top */
    margin: 0; 
    height: auto; 
    overflow-y: auto; /* Enable vertical scroll for the grid itself */
    max-height: 206px; /* For 2 rows of 90px cards + 5px gap + 16px padding-top (pt-3) + 5px padding-bottom */
    margin-bottom: 5px; 
    flex-shrink: 0; /* ADDED: Prevent this section from shrinking */
}

/* Ürün Grubu Kart Tasarımı */
.group-card[b-wuh4en1aet] {
    height: 90px; /* Kart yüksekliği */
    border: 1px solid #777;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    /* Transition kaldırıldı - performans için */
    margin: 0;
    /* Performance optimizations */
    will-change: auto;
    contain: layout style;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Ürün Grubu Kart İçeriği */
.group-card-body[b-wuh4en1aet] {
    padding: 5px; /* İç boşluk */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}

/* Ürün Grubu Kart Başlığı */
.group-card-title[b-wuh4en1aet] {
    font-size: 13px; /* Daha küçük yazı boyutu */
    font-weight: bold;
    margin: 0 auto; /* Ortala */
    white-space: normal; /* Metni wrap et */
    overflow: visible; /* Taşma görünsün */
    max-width: 100%; /* Maksimum genişlik */
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Maksimum 3 satır göster */
    -webkit-box-orient: vertical;
    text-align: center;
    line-height: 1.2; /* Satır aralığı */
    word-break: break-word; /* Uzun kelimeleri kır */
    hyphens: auto; /* Gerekirse heceleme yap */
}

.table[b-wuh4en1aet] {
    font-size: 14px;
}

/* Sepetteki satırların renk geçişleri */
.table-row[b-wuh4en1aet] {
    transition: background-color 0.3s ease;
}

    .table-row:hover[b-wuh4en1aet] {
        background-color: #f1f1f1;
    }

    .table-row.selected[b-wuh4en1aet] {
        background-color: #007bff;
        color: white;
    }

/* Tablo sütun genişlik ayarları */
table.table th[b-wuh4en1aet], table.table td[b-wuh4en1aet] {
    word-wrap: break-word;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 4px 6px; /* Daha az iç boşluk */
    font-size: 13px; /* Satır içi yazıları küçült */
}

/* Desktop görünümünde tablo sütun genişlikleri */
@media (min-width: 992px) {
    table.table th[b-wuh4en1aet], table.table td[b-wuh4en1aet] {
        width: auto;
        padding: 0.75rem;
    }
    
    .mobile-cart-table[b-wuh4en1aet] {
        font-size: 1rem;
    }
}

/* Ödeme Seçenekleri Kapsayıcı */
.payment-options[b-wuh4en1aet] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Butonları yatayda ortalar */
    gap: 15px; /* Butonlar arasında boşluk */
    padding: 10px; /* Kapsayıcı iç boşluğu */
}

/* 1920x1080 için payment options iki satır düzeni */
.payment-buttons-container[b-wuh4en1aet] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

/* 1920x1080'de İskonto ve Cari butonlarını ikinci satıra geçir */
.payment-buttons-container .payment-button:nth-child(6)[b-wuh4en1aet],
.payment-buttons-container .payment-button:nth-child(7)[b-wuh4en1aet] {
    flex-basis: calc(50% - 2px); /* İkinci satırda 2 buton yarı yarıya */
    margin-top: 8px; /* Üst satırdan biraz aralık */
}

/* Ödeme Butonları - Dokunmatik Ekran İçin Optimize Edilmiş */
.btn-sm.payment-button[b-wuh4en1aet] {
    font-size: 0.9rem;
    padding: 0.5rem 0.75rem;
    margin: 0.2rem;
    border-radius: 6px;
    transition: background-color 0.2s;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-width: 110px;
    min-height: 45px;
}

.btn-sm.payment-button:hover[b-wuh4en1aet] {
    transform: translateY(-2px);
    box-shadow: 0 3px 5px rgba(0,0,0,0.15);
}

.btn-sm.payment-button i[b-wuh4en1aet] {
    font-size: 1.1rem;
}

/* Parçalı Ödeme Butonu Özel Stil - Kaldırıldı */
.btn-outline-info.payment-button[b-wuh4en1aet]::after {
    display: none;
}

/* Toast Mesajı */
.toast-message[b-wuh4en1aet] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    animation: fadeInOut-b-wuh4en1aet 3s ease-in-out;
}

.toast-success[b-wuh4en1aet] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-wuh4en1aet] {
    background-color: #dc3545; /* Kırmızı */
}

/* Ödeme işlemleri için özel toast stili */
.toast-payment[b-wuh4en1aet] {
    font-size: 18px;
    font-weight: bold;
    padding: 16px 30px;
    animation: fadeInOut-b-wuh4en1aet 5s ease-in-out !important;
    border: 2px solid white;
    border-radius: 10px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.4);
    min-width: 350px;
}

.toast-success.toast-payment[b-wuh4en1aet] {
    background-color: #1e7e34; /* Daha koyu yeşil */
}

.toast-error.toast-payment[b-wuh4en1aet] {
    background-color: #bd2130; /* Daha koyu kırmızı */
}

@keyframes fadeInOut-b-wuh4en1aet {
    0% { opacity: 0; transform: translateX(-50%) translateY(-20px); }
    10% { opacity: 1; transform: translateX(-50%) translateY(0); }
    90% { opacity: 1; transform: translateX(-50%) translateY(0); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-20px); }
}

.form-check-input[b-wuh4en1aet] {
    width: 20px;
    height: 20px;
    margin-top: 0.25rem;
}

.list-group-item[b-wuh4en1aet] {
    border: none;
    padding: 0.8rem 0 0.8rem 2.5rem; /* Sol tarafta daha fazla boşluk bırak */
    font-size: 0.95rem;
    word-wrap: break-word;
    white-space: normal;
    position: relative; /* İkonun pozisyonunu yönetmek için */
}

    .list-group-item[b-wuh4en1aet]::before {
        content: "\f0a9"; /* Örnek Font Awesome simge kodu */
        font-family: "Font Awesome 5 Free"; /* Simge için kullanılan font */
        font-weight: 900; /* Bold simge */
        position: absolute; /* İkonu bağımsız konumlandır */
        top: 50%; /* Dikey olarak ortala */
        left: 0.5rem; /* Sol boşluk */
        transform: translateY(-50%); /* Dikey ortalamayı tamamla */
        font-size: 1.2rem; /* Simge boyutunu ayarla */
        color: #007bff; /* Simge rengi */
        z-index: 1; /* İkonun görünür kalmasını sağla */
    }

    .list-group-item strong[b-wuh4en1aet] {
        font-size: 1rem;
        color: #333;
        display: block;
        margin-bottom: 0.5rem;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .list-group-item ul[b-wuh4en1aet] {
        margin: 0;
        padding-left: 0.5rem; /* Daha iyi hizalama */
    }

        .list-group-item ul li[b-wuh4en1aet] {
            font-size: 0.9rem;
            color: #555;
            text-overflow: ellipsis;
            white-space: normal;
            word-break: break-word;
            line-height: 1.5;
        }

            .list-group-item ul li:hover[b-wuh4en1aet] {
                color: #007bff;
                cursor: pointer;
            }

/* Modal arka planı */
.modal-backdrop[b-wuh4en1aet] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: transparent !important; /* settings mantığı: karartma yok */
    z-index: 1050 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 1366x768 için sipariş aksiyon butonları daha kompakt */
@media (max-width: 1366px) and (max-height: 768px) {
    .order-actions-row[b-wuh4en1aet] {
        flex-wrap: wrap;
        gap: 0.5rem !important;
    }
    .order-action-btn[b-wuh4en1aet] {
        min-width: 110px !important;
        height: 44px !important;
        padding: 0.4rem 0.6rem !important;
        font-size: 0.9rem !important;
        line-height: 1.1 !important;
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
    }
    .order-action-btn .btn-text[b-wuh4en1aet] { display: inline-flex; flex-direction: column; line-height: 1.05; }
    .order-action-btn .btn-text span:last-child[b-wuh4en1aet] { margin-top: -2px; }
    .order-action-btn i[b-wuh4en1aet] { font-size: 1.1rem !important; }

    /* Modal içerik yüksekliği/kenar boşlukları - 1366x768 için */
    .modal-content[b-wuh4en1aet] {
        max-width: 92% !important;
        max-height: 85vh !important;
    }
    /* Ödeme modalı tam ekran ama iç padding azalt */
    div[style*="z-index: 1050;"] .modal-content[b-wuh4en1aet] {
        height: 100vh !important;
        padding: 0.5rem !important;
    }
}

/* Modal içeriği */
.modal-content[b-wuh4en1aet] {
    background-color: #fff !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    width: auto !important;
    max-width: 90% !important;
    max-height: 90vh !important;
    margin: 0 auto !important;
    overflow-y: auto !important;
    position: relative !important;
    z-index: 1051 !important;
}

/* Ödeme modalı için özel stil - Tam ekran genişliği */
div[style*="z-index: 1050;"] .modal-content[b-wuh4en1aet] {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

/* Mobil ekranlar için modal ayarları */
@media (max-width: 767px) {
    .modal-content[b-wuh4en1aet] {
        max-width: 95%;
        max-height: 95vh;
        margin: 0 auto;
    }
}

/* Çok küçük ekranlar için daha kompakt modal */
@media (max-width: 480px) {
    .modal-content[b-wuh4en1aet] {
        max-width: 98%;
        max-height: 98vh;
        margin: 0 auto;
    }
}

/* Modal başlık */
.modal-title[b-wuh4en1aet] {
    font-size: 2rem;
    font-weight: bold;
}

/* Büyük butonlar (modal içi +/- butonları vs.) */
.btn-lg[b-wuh4en1aet] {
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .btn-lg i[b-wuh4en1aet] {
        font-size: 2rem;
    }

/* Metin kutusu boyutu */
input[type="text"][b-wuh4en1aet] {
    height: 60px;
    text-align: center;
    font-size: 1.5rem;
    border: 2px solid #ddd;
    border-radius: 5px;
}

/* Modal içindeki seçili satır rengi */
.modal-content .table-row.selected[b-wuh4en1aet] {
    background-color: #007bff;
    color: white;
}

.table-row[b-wuh4en1aet] {
    cursor: pointer; /* Tıklanabilirlik için el imleci */
    transition: background-color 0.3s; /* Yumuşak renk geçişi */
}

    .table-row.bg-primary[b-wuh4en1aet] {
        background-color: #007bff !important; /* Mavi arka plan */
        color: white; /* Beyaz yazı */
    }

    .table-row.bg-success[b-wuh4en1aet] {
        background-color: #28a745 !important; /* Yeşil arka plan */
        color: white; /* Beyaz yazı */
    }

.header[b-wuh4en1aet] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: none !important; /* Alt çizgiyi kaldır */
    position: relative; /* Pozisyon özelliği ekle */
}

.header[b-wuh4en1aet]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #dee2e6;
    z-index: 5;
    }

.quantity-bar[b-wuh4en1aet] {
    height: calc(100vh - 80px); /* Header yüksekliğine göre */
    border-left: 2px solid #ddd;
}

    .quantity-bar button[b-wuh4en1aet] {
        width: 100%;
        text-align: center;
    }

.custom-row[b-wuh4en1aet] {
    --bs-gutter-x: 0.1rem; /* Sütunlar arasındaki yatay boşluk */
    --bs-gutter-y: 0.1rem; /* Sütunlar arasındaki dikey boşluk */
}

.search-box[b-wuh4en1aet] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 5px 10px;
    background-color: #fff;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
    z-index: 10;
}

.search-input[b-wuh4en1aet] {
    font-size: 14px;
    height: 36px;
    border-radius: 4px;
}

.product-container[b-wuh4en1aet] {
    position: relative; /* For absolute search-box */
    display: flex;      /* Ensured */
    flex-direction: column; /* Ensured */
    flex-grow: 1;       /* Ensured - to fill space in col-lg-7 after groups */
    overflow: hidden;   /* Ensured - to contain search-box and grid scrolling properly */

    border-top: 1px solid #dee2e6; 
    padding-top: 1rem;    
    margin-top: 1rem;     
    /* padding-bottom: 46px; */ /* REMOVED - search-box will occupy this, grid will get padding */
}

/* DataGrid Varsayılan */
.datagrid[b-wuh4en1aet] {
    font-size: 16px; /* Varsayılan yazı boyutu */
    border: 1px solid #ccc;
    width: 100%; /* Genişlik */
    table-layout: auto;
    transition: all 0.3s ease; /* Yumuşak geçiş */
}

/* 1366x768 Ekran için Özel Ayarlar */
@media (max-width: 1366px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(7, 1fr); 
        gap: 5px;
        max-height: 226px; /* For 2 rows of 100px cards + 5px gap + 16px padding-top (pt-3) + 5px padding-bottom */
        /* overflow-y: auto; is inherited */
    }

    .group-card[b-wuh4en1aet] {
        height: 100px; /* 1366x768 için yüksekliği artır, daha fazla metin sığsın */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .group-card-title[b-wuh4en1aet] {
        font-size: 12px; /* 1366x768 için yazı boyutunu biraz küçült */
        -webkit-line-clamp: 4; /* 1366x768 için bir satır daha ekle */
        line-height: 1.1; /* Satır aralığını biraz daha sıkılaştır */
        max-height: 4.4em; /* Maksimum 4 satır yüksekliği */
        word-break: break-word; /* Uzun kelimeleri kır */
        overflow: hidden; /* Taşmayı gizle */
    }

    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(4, 1fr); /* 4 sütuna çıkar */
        gap: 4px; /* Boşlukları azalt */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 90px; /* Kart yüksekliğini azalt */
        padding: 4px; /* İç boşluğu azalt */
    }

    .product-title[b-wuh4en1aet] {
        font-size: 11px; /* Yazı boyutunu küçült */
        line-height: 1.3; /* Satır aralığını artır */
        margin: 3px 0; /* Marjinleri azalt */
    }

    .product-price[b-wuh4en1aet] {
        font-size: 11px; /* Fiyat yazı boyutunu küçült */
    }
}

/* Tablet için Özel Ayarlar (768px - 1024px) */
/* Assuming the MQ for .group-grid that sets 4 columns corresponds to 80px group-card height */
@media (max-width: 1024px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(4, 1fr); 
        max-height: 186px; /* For 2 rows of 80px cards + 5px gap + 16px pt + 5px pb */
    }

    .group-card[b-wuh4en1aet] {
        height: 70px; /* Kart yüksekliğini azalt */
    }

    .group-card-title[b-wuh4en1aet] {
        font-size: 11px; /* Yazı boyutunu küçült */
        -webkit-line-clamp: 2; /* En fazla 2 satır */
    }

    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(3, 1fr); /* 3 sütuna düşür */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 85px; /* Kart yüksekliğini azalt */
    }

    .product-title[b-wuh4en1aet] {
        font-size: 10px; /* Yazı boyutunu küçült */
    }

    .product-price[b-wuh4en1aet] {
        font-size: 10px; /* Fiyat yazı boyutunu küçült */
    }
    }

/* Mobil için Özel Ayarlar (768px altı) */
@media (max-width: 767px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(3, 1fr); 
        gap: 3px; 
        max-height: 154px; /* For 2 rows of 65px cards + 3px gap + 16px pt + 5px pb */
    }

    .group-card[b-wuh4en1aet] {
        height: 65px; /* Kart yüksekliğini azalt */
    }

    .group-card-title[b-wuh4en1aet] {
        font-size: 10px; /* Yazı boyutunu küçült */
        line-height: 1.2; /* Satır aralığını azalt */
        padding: 0 2px; /* Kenar boşluklarını azalt */
    }

    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(2, 1fr); /* 2 sütuna düşür */
        gap: 3px; /* Boşlukları azalt */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 80px; /* Kart yüksekliğini azalt */
        padding: 3px; /* İç boşluğu azalt */
    }

    .product-title[b-wuh4en1aet] {
        font-size: 10px; /* Yazı boyutunu küçült */
        margin: 2px 0; /* Marjinleri azalt */
    }

    .product-price[b-wuh4en1aet] {
        font-size: 9px; /* Fiyat yazı boyutunu küçült */
    }
    }

/* Dikey Ekran (Portrait) için Özel Ayarlar */
@media (orientation: portrait) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(3, 1fr); 
        max-height: 186px; /* For 2 rows of 80px cards + 5px gap + 16px pt + 5px pb */
    }

    .group-card[b-wuh4en1aet] {
        height: 80px; /* Kart yüksekliğini artır */
    }

    .group-card-title[b-wuh4en1aet] {
        font-size: 11px; /* Yazı boyutunu artır */
        line-height: 1.3; /* Satır aralığını artır */
        -webkit-line-clamp: 3; /* 3 satıra izin ver */
    }

    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(2, 1fr); /* 2 sütun */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 100px; /* Kart yüksekliğini artır */
    }

    .product-title[b-wuh4en1aet] {
        font-size: 11px; /* Yazı boyutunu artır */
        line-height: 1.3; /* Satır aralığını artır */
    }

    .product-price[b-wuh4en1aet] {
        font-size: 10px; /* Fiyat yazı boyutunu artır */
    }
}

/* Küçük Mobil Cihazlar için Özel Ayarlar */
@media (max-width: 480px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(2, 1fr); 
        gap: 2px; 
        max-height: 143px; /* For 2 rows of 60px cards + 2px gap + 16px pt + 5px pb */
    }
    
    .group-card[b-wuh4en1aet] {
        height: 60px; /* Kart yüksekliğini azalt */
    }
    
    .group-card-title[b-wuh4en1aet] {
        font-size: 9px; /* Yazı boyutunu küçült */
        -webkit-line-clamp: 2; /* 2 satırla sınırla */
    }

    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(2, 1fr); /* 2 sütun */
        gap: 2px; /* Boşlukları azalt */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 70px; /* Kart yüksekliğini azalt */
    }

    .product-title[b-wuh4en1aet] {
        font-size: 9px; /* Yazı boyutunu küçült */
    }

    .product-price[b-wuh4en1aet] {
        font-size: 8px; /* Fiyat yazı boyutunu küçült */
    }
}

/* Split Payment Section */
.split-payment-section[b-wuh4en1aet] {
    background-color: #f8f9fa;
    border-radius: 8px;
    padding: 15px;
    margin-top: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    animation: slideDown-b-wuh4en1aet 0.3s ease-out;
}

@keyframes slideDown-b-wuh4en1aet {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.split-payment-section input[type="number"][b-wuh4en1aet] {
    font-size: 1.1rem;
    height: 45px;
    text-align: center;
    border: 2px solid #ddd;
    border-radius: 5px;
    transition: border-color 0.3s;
}

.split-payment-section input[type="number"]:focus[b-wuh4en1aet] {
    border-color: #007bff;
    box-shadow: none;
}

.split-payment-section label[b-wuh4en1aet] {
    font-weight: 500;
    color: #495057;
    margin-bottom: 5px;
}

.split-payment-section .btn-success[b-wuh4en1aet] {
    font-size: 1.1rem;
    padding: 12px;
    transition: all 0.3s;
}

.split-payment-section .btn-success:disabled[b-wuh4en1aet] {
    background-color: #6c757d;
    border-color: #6c757d;
    opacity: 0.65;
}

/* Kapat Butonu */
.btn-secondary.btn-lg[b-wuh4en1aet] {
    min-width: 200px;
    padding: 12px 20px;
    font-size: 1.1rem;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.btn-secondary.btn-lg:hover[b-wuh4en1aet] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

.btn-secondary.btn-lg i[b-wuh4en1aet] {
    font-size: 1.3rem;
}

/* Accordion Özelleştirmeleri */
.accordion-button[b-wuh4en1aet] {
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    background-color: #f8f9fa;
}

.accordion-button:not(.collapsed)[b-wuh4en1aet] {
    background-color: #e9ecef;
    color: #212529;
    box-shadow: none;
}

.accordion-button:focus[b-wuh4en1aet] {
    box-shadow: none;
    border-color: rgba(0,0,0,.125);
}

.accordion-body[b-wuh4en1aet] {
    padding: 0.5rem;
}

/* Toplam tutar badge'i için özel stil */
.accordion-button .badge.bg-primary[b-wuh4en1aet] {
    padding: 0.5rem 0.75rem;
    font-size: 1.1rem;
    font-weight: bold;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Ödeme Butonları Grid Yapısı - Accordion İçindeki Butonlar */
.d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 0.5rem !important;
    justify-content: center !important;
}

/* Ödeme Modalı Butonları - Yatay Diziliş */
.d-flex.gap-3.justify-content-center.mb-3.flex-wrap[b-wuh4en1aet] {
    display: flex !important; /* Grid yerine flex kullan */
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
    justify-content: center !important;
}

@media (max-width: 1366px) {
    .d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        gap: 0.4rem !important;
    }
    
    /* Modal butonları için flex ayarları */
    .d-flex.gap-3.justify-content-center.mb-3.flex-wrap[b-wuh4en1aet] {
        gap: 0.4rem !important;
    }
}

@media (max-width: 1024px) {
    .d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
        gap: 0.3rem !important;
    }
    
    /* Modal butonları için flex ayarları */
    .d-flex.gap-3.justify-content-center.mb-3.flex-wrap[b-wuh4en1aet] {
        gap: 0.3rem !important;
    }
}

@media (max-width: 768px) {
    .d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(85px, 1fr));
        gap: 0.25rem !important;
    }
    
    /* Modal butonları için flex ayarları */
    .d-flex.gap-3.justify-content-center.mb-3.flex-wrap[b-wuh4en1aet] {
        gap: 0.25rem !important;
    }
}

@media (max-width: 576px) {
    .d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
        gap: 0.2rem !important;
    }
    
    /* Modal butonları için flex ayarları */
    .d-flex.gap-3.justify-content-center.mb-3.flex-wrap[b-wuh4en1aet] {
        gap: 0.2rem !important;
    }
}

@media (max-width: 400px) {
    .d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(75px, 1fr));
        gap: 0.15rem !important;
    }
    
    /* Modal butonları için flex ayarları */
    .d-flex.gap-3.justify-content-center.mb-3.flex-wrap[b-wuh4en1aet] {
        gap: 0.15rem !important;
    }
}

/* === ÖZEL 1366x768 RESOLUTION OPTİMİZASYONU === */
@media (max-width: 1367px) and (max-height: 769px) {
    /* LAYOUT YÜKSEKLİK OPTİMİZASYONU */
    .tablesales-list[b-wuh4en1aet] {
        height: 100vh !important;
        max-height: 100vh !important;
    }
    
    /* GRUP SEKSİYONU - Daha da kompakt */
    .group-section[b-wuh4en1aet] {
        max-height: 75px !important; /* Daha da düşük yükseklik */
        padding: 2px 4px !important;
    }
    
    .group-section .btn[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha da küçük yazı */
        padding: 2px 4px !important; /* Minimal padding */
        min-width: 65px !important; /* Daha da dar */
        margin: 1px !important; /* Minimal margin */
        line-height: 1 !important;
        height: 25px !important; /* Sabit yükseklik */
    }
    
         /* MASA SECTION - Kalan alanı maksimize et */
     .table-section[b-wuh4en1aet] {
         max-height: calc(100vh - 120px) !important; /* 1366x768 için daha küçük */
         height: calc(100vh - 120px) !important; /* Sabit yükseklik */
         padding: 2px !important; /* 1920x1080 ile aynı */
         overflow-y: auto !important;
         flex: none !important; /* Flex'i kapat ki genişlemesin */
         border-bottom: none !important; /* Alt çizgiyi kaldır */
     }
     
     /* BG-LIGHT ALANINI OVERRIDE ET */
     .tablesales-list .bg-light[b-wuh4en1aet] {
         background-color: transparent !important; /* bg-light'ı şeffaf yap */
     }
     
     .tablesales-list[b-wuh4en1aet] {
         background-color: white !important; /* Ana arka planı beyaz */
     }
    
         .table-card.responsive-table-card.border[b-wuh4en1aet] {
         width: 130px !important; /* Daha dar - daha çok masa sığsın */
         height: 120px !important; /* Daha kısa - daha çok masa sığsın */
         margin: 4px !important; /* Daha az boşluk */
         font-size: 0.75rem !important; /* Biraz daha küçük yazı */
         padding: 6px !important; /* Daha az padding */
     }

         .responsive-table-card[b-wuh4en1aet] {
         padding: 8px !important; /* Normal iç boşluk */
     }

         .responsive-table-card h5[b-wuh4en1aet] {
         font-size: 1rem !important; /* Normal h5 boyutu */
         margin-bottom: 8px !important;
         line-height: 1.2 !important;
     }
     
     .responsive-table-card .small[b-wuh4en1aet] {
         font-size: 0.8rem !important; /* Normal small boyutu */
         line-height: 1.2 !important;
     }
    
         /* MASA KARTLARI İÇERİSİNDEKİ BİLGİLER */
     .responsive-table-card .masa-bilgi[b-wuh4en1aet] {
         margin-bottom: 4px !important; /* Normal margin */
         font-size: 0.8rem !important; /* Normal yazı boyutu */
         line-height: 1.3 !important;
     }
     
     .responsive-table-card hr[b-wuh4en1aet] {
         margin: 8px 0 !important; /* Normal margin */
         height: 3px !important; /* Normal kalınlık */
     }
     
     /* INLINE STYLE'LARI OVERRIDE ET */
     .responsive-table-card .w-100[style*="font-size: 0.8rem"][b-wuh4en1aet] {
         font-size: 0.8rem !important; /* Inline style'ı override et */
     }
     
     .responsive-table-card h5.fw-bold.fs-6[b-wuh4en1aet] {
         font-size: 0.9rem !important; /* Masa adı büyük */
     }
     
     /* KAPALI MASA İÇİN YÜKSEK BOŞ ALAN DÜZELTMESİ */
     .w-100.d-flex.align-items-center.justify-content-center[style*="height: 100px"][b-wuh4en1aet] {
         height: 40px !important; /* Çok daha kısa */
     }
     
     /* SEPET PANELİ - Sol taraf optimizasyonu */
    .col-lg-5.bg-white.text-dark.d-flex.flex-column.h-100[b-wuh4en1aet] {
        display: flex !important;
        flex-direction: column !important;
        height: 100vh !important;
        overflow: hidden !important;
    }
    
    .flex-grow-1.p-2.overflow-auto[b-wuh4en1aet] {
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        max-height: calc(100vh - 180px) !important; /* Accordion için yer bırak */
        padding: 0.3rem !important; /* Daha az padding */
    }
    
    .p-2.border-top.bg-light[b-wuh4en1aet] {
        flex: 0 0 auto !important;
        padding: 0.3rem !important; /* Daha az padding */
    }
    
    /* MASA BAŞLIĞINDAKİ BUTONLAR - 1366x768 İÇİN OPTİMİZE */
    /* Kişi sayısı ve masa taşıma butonları (btn-sm) */
    .p-2.border-top.bg-light .btn-sm[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Küçük yazı boyutu */
        padding: 0.3rem 0.5rem !important; /* Kompakt padding */
        min-height: 30px !important; /* Daha kısa butonlar */
        min-width: 70px !important; /* Daha dar butonlar */
        white-space: nowrap !important;
        border-radius: 4px !important;
        line-height: 1.1 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    
    /* Sipariş tamamla butonları (btn-success, btn-primary) */
    .p-2.border-top.bg-light .btn-success[b-wuh4en1aet],
    .p-2.border-top.bg-light .btn-primary[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Biraz daha büyük yazı */
        padding: 0.4rem 0.6rem !important; /* Orta padding */
        min-height: 32px !important; /* Orta yükseklik */
        min-width: 100px !important; /* Daha dar butonlar */
        white-space: nowrap !important;
        border-radius: 4px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-height: 1.1 !important;
        max-width: 150px !important; /* Maksimum genişlik sınırı */
    }
    
    /* Masa butonlarındaki ikonlar */
    .p-2.border-top.bg-light .btn i[b-wuh4en1aet] {
        font-size: 0.6rem !important; /* Küçük ikonlar */
        margin-right: 3px !important;
    }
    
    /* Masa açma input'u için */
    .p-2.border-top.bg-light .input-group-sm .form-control-sm[b-wuh4en1aet] {
        font-size: 0.7rem !important;
        height: 28px !important;
    }
    
    .p-2.border-top.bg-light .input-group-text[b-wuh4en1aet] {
        font-size: 0.65rem !important;
        padding: 0.3rem 0.5rem !important;
    }
    
    /* ACCORDION - Alt kısım optimizasyonu */
    .accordion#paymentAccordion[b-wuh4en1aet] {
        position: relative !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 10 !important;
        background-color: white !important;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1) !important;
        margin-top: auto !important;
    }
    
    .accordion-button[b-wuh4en1aet] {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.6rem !important;
        line-height: 1.1 !important;
    }
    
    /* PRODUCT GRID - Sağ taraf optimizasyonu */
.product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fill, minmax(95px, 1fr)) !important;
        gap: 0.15rem !important;
        padding: 0.2rem !important;
}

.product-card[b-wuh4en1aet] {
        min-height: 70px !important;
        padding: 2px !important;
}

.product-image.has-image[b-wuh4en1aet] {
        height: 32px !important;
        margin-bottom: 1px !important;
}

.product-title[b-wuh4en1aet] {
        font-size: 0.65rem !important;
        line-height: 0.95 !important;
        margin-bottom: 1px !important;
    }

.product-price[b-wuh4en1aet] {
        font-size: 0.6rem !important;
    }
    
    /* GRUP KARTLARI - Çok kompakt */
.group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fill, minmax(85px, 1fr)) !important;
        gap: 3px !important;
        padding: 3px !important;
        max-height: 75px !important;
    }

.group-card[b-wuh4en1aet] {
        min-height: 30px !important;
    }

.group-card-body[b-wuh4en1aet] {
        padding: 2px !important;
    }

.group-card-title[b-wuh4en1aet] {
        font-size: 0.6rem !important;
        line-height: 0.95 !important;
        white-space: normal;
    word-wrap: break-word;
    }
    
    /* MODAL VE DİĞER ELEMENTLERİ OPTİMİZE ET */
.modal-content[b-wuh4en1aet] {
        font-size: 0.8rem !important;
    }
    
.btn-lg[b-wuh4en1aet] {
        font-size: 0.8rem !important;
        padding: 0.25rem 0.5rem !important;
        line-height: 1.1 !important;
    }
    
    /* TABLO STİLLERİ */
    .mobile-cart-table th[b-wuh4en1aet],
    .mobile-cart-table td[b-wuh4en1aet] {
        padding: 1px 2px !important;
        font-size: 0.65rem !important;
        line-height: 1 !important;
    }
    
    /* ÖDEME SEÇENEKLERI BUTONLARI - 1366x768 İÇİN KÜÇÜLTME */
    .accordion-body .btn-sm.payment-button[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük yazı */
        padding: 0.25rem 0.4rem !important; /* Daha az padding */
        min-width: 70px !important; /* Daha dar minimum genişlik */
        min-height: 30px !important; /* Daha düşük minimum yükseklik */
        margin: 0.1rem !important; /* Daha az margin */
        border-radius: 3px !important; /* Daha küçük border radius */
        line-height: 1 !important; /* Daha kompakt satır yüksekliği */
    }
    
    /* ÖDEME BUTONLARININ İKONLARI */
    .accordion-body .btn-sm.payment-button i[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük ikon boyutu */
        margin-right: 0.2rem !important; /* Daha az sağ margin */
    }
    
    /* ÖDEME SEÇENEKLERI CONTAINER - Butonlar arası boşluk */
    .accordion-body .d-flex.flex-wrap.gap-1.justify-content-between[b-wuh4en1aet] {
        gap: 0.15rem !important; /* Butonlar arası daha az boşluk */
        padding: 0.2rem !important; /* Container padding azalt */
    }
    
    /* BADGE DE KÜÇÜLT - TOPLAM TUTAR BADGE'İ */
    .accordion-button .badge.bg-primary[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük badge yazı */
        padding: 0.3rem 0.5rem !important; /* Daha az badge padding */
    }
    
    /* ÜSTTE BULUNAN BUTONLAR - KİŞİ SAYISI, MASA TAŞI, SİPARİŞ TAMAMLA - ÇOK GÜÇ */
    @media (max-width: 1366px) and (max-height: 768px) {
        .btn.btn-square[b-wuh4en1aet] {
            min-width: 70px !important; /* Daha dar minimum genişlik */
            width: 70px !important; /* Sabit genişlik */
            font-size: 0.65rem !important; /* Daha küçük yazı */
            padding: 0.3rem 0.4rem !important; /* Daha az padding */
            margin-right: 3px !important; /* Daha az sağ margin */
            line-height: 1.1 !important; /* Daha kompakt satır yüksekliği */
            height: 32px !important; /* Sabit düşük yükseklik */
            border-radius: 4px !important; /* Border radius koruma */
        }
        
        /* ÜSTTE BULUNAN BUTONLARIN İKONLARI */
        .btn.btn-square i[b-wuh4en1aet] {
            font-size: 0.7rem !important; /* Daha küçük ikon boyutu */
            margin-right: 0.25rem !important; /* Daha az sağ margin */
        }
    }
    
    /* MASA BAŞLIK BİLGİLERİ - Kompakt */
    .mesa-title[b-wuh4en1aet] {
        font-size: 0.85rem !important;
        padding: 0.2rem 0.3rem !important;
        line-height: 1.1 !important;
    }
    
    .masa-info-box[b-wuh4en1aet] {
        font-size: 0.6rem !important;
        padding: 0.1rem 0.2rem !important;
        line-height: 1 !important;
    }
    
    /* BUTONLAR - Minimal boyut */
    .btn-square[b-wuh4en1aet] {
        width: 30px !important;
        height: 30px !important;
        font-size: 0.7rem !important;
    }
    
    /* WIZARD OPTİMİZASYONU */
    .wizard-modal-body[b-wuh4en1aet] {
        padding: 0.5rem !important;
    }
    
    .wizard-option-item[b-wuh4en1aet] {
        padding: 0.3rem !important;
        font-size: 0.7rem !important;
    }
    
    .wizard-quantity-button[b-wuh4en1aet] {
        width: 30px !important;
        height: 30px !important;
        font-size: 0.7rem !important;
    }
    
    /* PAYMENT OPTIONS - Kompakt */
    .payment-options .btn[b-wuh4en1aet] {
        font-size: 0.7rem !important;
        padding: 0.3rem 0.4rem !important;
        line-height: 1.1 !important;
    }
}

/* Ödeme Seçenekleri Accordion'u için Özel Stil - 1366x768 ekran için - Mobil görünüm */
@media (max-width: 991px) and (max-height: 768px) {
    .accordion#paymentAccordion[b-wuh4en1aet] {
        width: 100% !important; /* Mobil görünümde tam genişlik */
    }
}

/* Kişi Sayısı Modal Butonları */
.modal-content .btn-lg[b-wuh4en1aet] {
    white-space: normal;
    line-height: 1.2;
    font-size: 1rem;
    padding: 10px;
}

@media (max-width: 576px) {
    .modal-content .btn-lg[b-wuh4en1aet] {
        font-size: 0.9rem;
        padding: 8px 5px;
    }
}

@media (max-width: 400px) {
    .modal-content .btn-lg[b-wuh4en1aet] {
        font-size: 0.8rem;
        padding: 6px 4px;
    }
}

/* Ürün Kartı Hover Efekti - Performans optimizasyonu */
.product-card:hover[b-wuh4en1aet] {
    /* Transform kaldırıldı - daha hızlı performans için */
    border: 1px solid #aaa;
    background-color: #f8f9fa;
    /* Minimal box-shadow */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* İkram Ürünü Stilleri */
.product-card.treat-product[b-wuh4en1aet] {
    border: 2px solid #28a745 !important;
    box-shadow: 0 0 8px rgba(40, 167, 69, 0.3);
}

.treat-badge[b-wuh4en1aet] {
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: #28a745;
    color: white;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Rezerve Ürünü Stilleri */
.product-card.reserve-product[b-wuh4en1aet] {
    border: 2px solid #ffc107 !important;
    box-shadow: 0 0 8px rgba(255, 193, 7, 0.3);
}

.reserve-badge[b-wuh4en1aet] {
    position: absolute;
    top: 5px;
    left: 5px;
    background-color: #ffc107;
    color: white;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.reserve-text[b-wuh4en1aet] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 4px;
}

/* Grup Kartı Hover Efekti - Performans optimizasyonu */
.group-card:hover[b-wuh4en1aet] {
    /* Transform kaldırıldı - daha hızlı performans için */
    border: 1px solid #aaa;
    background-color: #f8f9fa;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Aktif Grup Kartı */
.group-card.active[b-wuh4en1aet] {
    background-color: #007bff;
    color: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    border: 3px solid #dc3545; 
    animation: popInEffect-b-wuh4en1aet 0.3s 1 ease-out; /* MODIFIED: Changed to pop-in effect */
}

.group-card.active .group-card-title[b-wuh4en1aet] {
    color: white; 
    font-weight: bold !important; /* ADDED: Ensure title is bold, overriding inline styles */
}

/* ADDED: Keyframes for the pop-in effect on active group card */
@keyframes popInEffect-b-wuh4en1aet {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.07); /* Slightly larger pop */
    }
    100% {
        transform: scale(1);
    }
}

/* Responsive Düzenlemeler */
@media (max-width: 1920px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(8, 1fr); 
        max-height: 176px; /* For 2 rows of 75px cards + 5px gap + 16px pt + 5px pb */
    }
    
    .group-card[b-wuh4en1aet] {
        height: 75px;
    }
    
    .group-card-title[b-wuh4en1aet] {
        font-size: 12px;
    }
}

@media (max-width: 1024px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(8, 1fr); /* Restored - Note: This was likely overridden by the more specific max-width: 1024px block above which set it to 4 columns. If this was intended for larger screens *up to* 1024 where another 1024px rule didn't apply, it's restored. Otherwise, the more specific rule (4 columns) will take precedence. */
    }
    
    .group-card[b-wuh4en1aet] {
        height: 80px; /* Daha küçük grup kartı yüksekliği */
    }
    
    .group-card-title[b-wuh4en1aet] {
        font-size: 10px; /* Daha küçük yazı boyutu */
    }
}

/* TableSales için kaydırma çubuğu stilleri */
.tablesales-list[b-wuh4en1aet] {
    overflow-y: auto !important;
}

.tablesales-list[b-wuh4en1aet]::-webkit-scrollbar {
    width: 8px;
    background-color: #f1f1f1;
}

.tablesales-list[b-wuh4en1aet]::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
}

.tablesales-list[b-wuh4en1aet]::-webkit-scrollbar-thumb:hover {
    background-color: #555;
}

.table-section[b-wuh4en1aet] {
    overflow-y: auto !important;
    flex: 1;
    max-height: calc(100vh - 80px); /* 1366x768 için daha az boşluk */
}

.table-section[b-wuh4en1aet]::-webkit-scrollbar {
    width: 8px;
    background-color: #f1f1f1;
}

.table-section[b-wuh4en1aet]::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
}

.table-section[b-wuh4en1aet]::-webkit-scrollbar-thumb:hover {
    background-color: #555;
}

/* Badge için özel CSS sınıfı - Bootstrap sınıflarını override edecek */
.group-section .badge.rounded-pill.table-count-badge[b-wuh4en1aet] {
    position: absolute !important;
    top: -8px !important; /* Daha yukarıda */
    right: -8px !important; /* Daha sağda */
    transform: none !important;
    z-index: 99999 !important; /* En yüksek z-index */
    border: 2px solid white !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3) !important; /* Daha belirgin gölge */
    font-size: 0.7rem !important;
    padding: 3px 6px !important;
    min-width: 32px !important;
    font-weight: bold !important;
}

/* Bootstrap .position-absolute sınıfını geçersiz kıl */
.position-absolute.top-0.start-100.translate-middle.badge.rounded-pill.table-count-badge[b-wuh4en1aet] {
    position: absolute !important;
    top: -8px !important;
    right: -8px !important;
    left: auto !important; /* sol konumu otomatik olarak ayarla */
    bottom: auto !important; /* alt konumu otomatik olarak ayarla */
    transform: none !important; /* transform'u devre dışı bırak */
}

/* Belirli badge renkleri için ek ayarlar */
.badge.rounded-pill.bg-danger.table-count-badge[b-wuh4en1aet] {
    background-color: #dc3545 !important; /* Kırmızı rengini vurgula */
}

.badge.rounded-pill.bg-success.table-count-badge[b-wuh4en1aet] {
    background-color: #28a745 !important; /* Yeşil rengini vurgula */
}

/* Masa sayfası için buton stilleri */
.btn-square[b-wuh4en1aet] {
    border-radius: 4px !important;
    min-width: 100px !important;
    padding: 8px 12px !important;
    margin-right: 5px !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

.btn-square i[b-wuh4en1aet] {
    margin-right: 5px !important;
    font-size: 1.1rem !important;
}

/* Masa detay alanı */
.masa-info-box[b-wuh4en1aet] {
    margin-top: 2px;
    font-size: 0.85rem;
    opacity: 0.8;
    margin-bottom: 2px;
    padding-bottom: 0;
}

/* Masa başlığını daha belirgin yap */
.mesa-title[b-wuh4en1aet] {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2;
}

/* Masa Kartı için HR stili - Masa açıkken beyaz, kapalıyken siyah çizgi */
.responsive-table-card.bg-success hr[b-wuh4en1aet] {
    background-color: rgba(255, 255, 255, 0.8); /* Açık masalar için beyaz çizgi */
    box-shadow: 0 0 2px rgba(255, 255, 255, 0.5); /* Hafif beyaz gölge ekleyerek daha görünür yap */
}

.responsive-table-card.bg-danger hr[b-wuh4en1aet],
.responsive-table-card hr[b-wuh4en1aet] {
    background-color: rgba(0, 0, 0, 0.2); /* Kapalı masalar için siyah çizgi (hafif opak) */
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.1); /* Hafif siyah gölge ekleyerek daha görünür yap */
}

/* Responsive Table Card içindeki elemanlardaki marjinleri düzenle */
.responsive-table-card h5[b-wuh4en1aet] {
    margin-bottom: 2px; /* Başlık marjinini azalt */
    padding-bottom: 0; /* Alt padding'i kaldır */
}

.responsive-table-card .small[b-wuh4en1aet] {
    margin-top: 2px; /* Üst marjini azalt */
    margin-bottom: 2px; /* Alt marjini azalt */
    padding-top: 0; /* Üst padding'i kaldır */
    padding-bottom: 0; /* Alt padding'i kaldır */
}

/* Tüm masa kartı bileşenlerini aynı hizada tutmak için düzenleme */
.responsive-table-card[b-wuh4en1aet] {
    display: flex;
    flex-direction: column;
    padding: 10px 10px; /* Kenar boşluklarını eşitle */
}

.responsive-table-card > *[b-wuh4en1aet] {
    flex-shrink: 0; /* Öğelerin küçülmesini engelle */
}

.responsive-table-card hr:first-of-type[b-wuh4en1aet] {
    margin-top: 2px;
    margin-bottom: 2px;
}

/* Masa başlığı konteynerı için tüm CSS önceki özellikleri sıfırlıyorum */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between[b-wuh4en1aet] {
    position: relative !important;
    border-bottom: 1px solid #dee2e6 !important;
}

/* Masa başlığı için stil, sadece başlık varsa */
.mesa-title:not(:has(+ .masa-info-box))[b-wuh4en1aet] {
    /* Bu stilin içini boşalt, silme ama etkisiz hale getir */
}

/* Masa bilgi kutusu için stil */
.masa-info-box[b-wuh4en1aet] {
    padding-bottom: 0 !important; /* Açık masa için */
}

/* Tüm çeşit masa başlığı alanları için çıplak temel stil */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between[b-wuh4en1aet] {
    border-bottom: 1px solid #dee2e6 !important;
    position: relative !important;
    padding: 10px 15px !important;
    margin: 0 !important;
    height: 56px !important; /* Standart yükseklik */
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* Masa başlık metni için stil */
.mesa-title[b-wuh4en1aet] {
    margin: 0 !important;
    padding: 0 !important;
}

/* Masa bilgi kutusu için stil - açık masa */
.masa-info-box[b-wuh4en1aet] {
    margin: 2px 0 0 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    font-size: 0.8rem !important;
    opacity: 0.8 !important;
    text-align: center !important;
    width: 100% !important;
}

/* İkonlar için ortak düzenleme - hem kapalı hem açık masa için aynı boyut ve konum */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between .bi[b-wuh4en1aet],
.d-flex.justify-content-between.align-items-center.border-bottom.p-3 .bi[b-wuh4en1aet] {
    font-size: 1.8rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 44px !important;
    width: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    transition: transform 0.2s ease-in-out;
    position: relative !important;
    top: 0 !important;
}

/* Hover efekti */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between .bi:hover[b-wuh4en1aet],
.d-flex.justify-content-between.align-items-center.border-bottom.p-3 .bi:hover[b-wuh4en1aet] {
    transform: scale(1.1);
    color: #0056b3 !important;
}

/* Zayi ikonu için özel renk - tek ürün zayi ile aynı renk */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between .bi-slash-circle[b-wuh4en1aet] {
    color: #FF8C00 !important; /* btn-waste ile aynı renk */
}

.p-3.border-bottom.d-flex.align-items-center.justify-content-between .bi-slash-circle:hover[b-wuh4en1aet] {
    color: #E67E22 !important; /* hover rengi de aynı */
}

/* Kapalı masa durumundaki margin-top düzeltmesi */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between:not(:has(.masa-info-box)) .btn[b-wuh4en1aet],
.p-3.border-bottom.d-flex.align-items-center.justify-content-between:not(:has(.masa-info-box)) > div > i[b-wuh4en1aet] {
    margin-top: 0 !important; /* Kapalı masada yukarı yapışan ikonları düzelt */
}

/* Geri butonu için özel stil - aynı hizada olmasını sağla */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between .btn[b-wuh4en1aet] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    padding: 8px 12px !important;
    height: 44px !important; /* İkonlarla aynı yükseklik */
    margin: 0 !important;
}

/* Geri butonundaki ikonun konumu */
.p-3.border-bottom.d-flex.align-items-center.justify-content-between .btn i[b-wuh4en1aet] {
    margin-right: 5px !important;
    height: auto !important;
    position: relative !important;
    top: 0 !important;
}

/* Ensuring specific styles for the new Cancellation Reason Modal */
.fullscreen-modal-backdrop.cancellation-reason-modal-backdrop[b-wuh4en1aet] {
    background-color: #1c1e21 !important; /* Solid, very dark opaque background, !important to override */
    opacity: 1 !important; /* Ensure full opacity */
    z-index: 1080 !important; /* Ensure it's on top of other potential backdrops */
}

.fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet] {
    background-color: #ffffff !important; /* Açık tema: dıştaki siyahlığı kaldır */
    color: #212529 !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.5rem;
    width: 95vw; 
    height: 90vh; 
    max-height: 90vh; /* klavyeyi sığdırmak için yükseklik korunur */
    max-width: 1200px;  /* geniş ekranlarda daha ferah */
    display: flex;
    flex-direction: column;
    box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.15); /* daha yumuşak gölge */
}

/* Hide scrollbars for this modal globally while preserving scrollability if any remains */
.fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet],
.fullscreen-modal-content-dark.cancellation-reason-modal-content .modal-body[b-wuh4en1aet] {
    -ms-overflow-style: none;       /* IE and Edge */
    scrollbar-width: none;          /* Firefox */
}
.fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet]::-webkit-scrollbar,
.fullscreen-modal-content-dark.cancellation-reason-modal-content .modal-body[b-wuh4en1aet]::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.cancellation-reason-modal-content .modal-header[b-wuh4en1aet] {
    border-bottom: 1px solid #45494e;
    padding: 1rem 1.5rem; /* More padding in header */
}

.cancellation-reason-modal-content .modal-header .modal-title[b-wuh4en1aet] {
    font-size: 1.5rem; /* Larger title */
}

.cancellation-reason-modal-content .modal-header .btn-close[b-wuh4en1aet] {
    font-size: 1.2rem; /* Larger close button */
}


.cancellation-reason-modal-content .modal-footer[b-wuh4en1aet] {
    border-top: 1px solid #45494e;
    padding: 1rem 1.5rem; /* More padding in footer */
}

.cancellation-reason-modal-content .modal-footer .btn[b-wuh4en1aet] {
    font-size: 1.1rem; /* Larger font for footer buttons */
    padding: 0.75rem 1.5rem; /* More padding for touch */
    min-width: 120px;
}

.cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet] {
    background-color: #3a3e42; /* Darker textarea */
    color: #e9ecef;
    border: 1px solid #565b61;
    font-size: 1.25rem; /* Slightly larger font */
    flex-grow: 1;
    min-height: 108px; /* bir tık küçült */
    margin-bottom: 0.4rem; /* Input-klavye arası boşluğu azalt */
}

.cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet]::placeholder {
    color: #868e96;
}

.cancellation-reason-modal-content .on-screen-keyboard[b-wuh4en1aet] {
    display: flex;
    flex-direction: column;
    padding: 0.75rem;
    background-color: #f0f2f5; /* 1920x1080 için de gri tema */
    border: 1px solid #d8dde3;
    border-radius: 8px; /* Slightly more rounded */
    margin-top: 0.4rem; /* Input-klavye arası boşluğu azalt */
}

.cancellation-reason-modal-content .keyboard-row[b-wuh4en1aet] {
    display: flex;
    justify-content: center;
    margin-bottom: 0.5rem; /* Increased spacing between rows */
}

.cancellation-reason-modal-content .keyboard-key[b-wuh4en1aet] {
    background-color: #ffffff; /* açık tema */
    color: #343a40;
    border: 1px solid #bcc3ca;
    border-radius: 6px; /* More rounded keys */
    padding: 0.75rem; /* keep size for 1920 */
    margin: 0.25rem; /* keep margins */
    font-size: 1.2rem; /* Larger key font */
    font-weight: 500; /* Medium weight */
    min-width: 55px; /* Increased min-width */
    height: 60px;   /* Increased height */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s, transform 0.1s;
}

.cancellation-reason-modal-content .keyboard-key:hover[b-wuh4en1aet] {
    background-color: #e9ecef;
    border-color: #adb5bd;
}

.cancellation-reason-modal-content .keyboard-key:active[b-wuh4en1aet] {
    background-color: #dee2e6;
    transform: scale(0.95); /* Slight shrink on press */
}

.cancellation-reason-modal-content .keyboard-key.key-space[b-wuh4en1aet] {
    flex-grow: 5;
    min-width: 220px; /* Wider spacebar */
}

.cancellation-reason-modal-content .keyboard-key.key-backspace[b-wuh4en1aet] {
    min-width: 75px; /* Wider backspace */
    background-color: #e9ecef; /* açık gri */
}
.cancellation-reason-modal-content .keyboard-key.key-backspace i[b-wuh4en1aet] {
    font-size: 1.5rem; /* Larger icon */
}

.cancellation-reason-modal-content .keyboard-key.key-caps[b-wuh4en1aet] {
    min-width: 75px; /* Wider caps */
    background-color: #e9ecef; /* açık gri */
}
.cancellation-reason-modal-content .keyboard-key.key-caps i[b-wuh4en1aet] {
    font-size: 1.5rem; /* Larger icon */
}
.cancellation-reason-modal-content .keyboard-key.key-caps.active[b-wuh4en1aet] {
    background-color: #0d6efd; /* Standard Bootstrap primary blue */
    color: white;
}

.cancellation-reason-modal-content .modal-body[b-wuh4en1aet] {
    overflow-y: auto; 
    flex-grow: 1;
    padding: 0.75rem 1rem; /* Bir tık daha kompakt: aşağıda boşluk kalmasın */
}
/* Include any @media queries related to the keyboard here too */
/* Media query for smaller screens (keyboard adjustments) */
/* 1366x768 Keyboard Optimization - COMPLETE REWRITE */
@media (max-width: 1366px) and (max-height: 768px) {
    /* Modal kapsayıcıyı (Bootstrap full-screen dialog) sola hizala ve içeriği soldan başlat */
    .cancellation-reason-modal-backdrop .modal-dialog.modal-fullscreen[b-wuh4en1aet] {
        display: flex !important;
        justify-content: flex-start !important; /* soldan başlasın */
        align-items: center !important;        /* dikeyde ortalı */
        padding-left: 0 !important;
        padding-right: 0 !important;
        background: transparent !important; /* dıştaki siyah çerçeveyi kaldır */
    }

    .fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet] {
        background-color: #ffffff !important;
        color: #212529 !important;
        border: 1px solid #dee2e6 !important;
        border-radius: 0.3rem !important;
        width: clamp(980px, 82vw, 1200px) !important; /* 1366x768'de sağa doğru daha geniş */
        max-width: none !important; /* herhangi bir üst sınırı kaldır */
        height: auto !important;
        max-height: calc(100vh - 24px) !important; /* alt scroll'u önle */
        display: flex !important;
        flex-direction: column !important;
        box-shadow: 0 0.3rem 0.7rem rgba(0, 0, 0, 0.15) !important;
        position: fixed !important;
        top: 50% !important;
        left: 0 !important;          /* soldan başlat */
        right: auto !important;
        transform: translateY(-50%) !important; /* dikeyde ortala, yatayda solda başla */
        margin-left: 12px !important; /* ekrandan yapışık görünmemesi için küçük boşluk */
        box-sizing: border-box !important;
    }

    /* Her türlü genel max-width kuralını bu modal için geçersiz kıl */
    .modal-backdrop .modal-content.fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet],
    .modal-content.fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet] {
        max-width: clamp(980px, 82vw, 1200px) !important;
        width: clamp(980px, 82vw, 1200px) !important;
    }
    
    .cancellation-reason-modal-content .modal-header[b-wuh4en1aet] {
        background-color: #f8f9fa !important;
        color: #212529 !important;
        border-bottom: 1px solid #dee2e6 !important;
        padding: 0.55rem 0.85rem !important; /* bir tık daha küçült */
    }
    
    .cancellation-reason-modal-content .modal-header .modal-title[b-wuh4en1aet] {
        font-size: 1.05rem !important; /* başlığı bir tık küçült */
        color: #212529 !important;
        font-weight: 600 !important;
    }
    
    .cancellation-reason-modal-content .modal-body[b-wuh4en1aet] {
        padding: 0.45rem 0.7rem !important; /* bir tık daha küçült */
        overflow-y: auto !important;
        flex-grow: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        background-color: #ffffff !important;
    }

    /* Hide any remaining scrollbars specifically on small screens */
    .fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet],
    .cancellation-reason-modal-content .modal-body[b-wuh4en1aet] {
        -ms-overflow-style: none !important;  /* IE and Edge */
        scrollbar-width: none !important;     /* Firefox */
    }
    .fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet]::-webkit-scrollbar,
    .cancellation-reason-modal-content .modal-body[b-wuh4en1aet]::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
    }
    
    .cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet] {
        background-color: #ffffff !important;
        color: #212529 !important;
        border: 1px solid #ced4da !important;
        font-size: 0.95rem !important;
        min-height: 44px !important; /* bir tık daha küçük */
        max-height: 72px !important;
        margin-bottom: 0.12rem !important; /* Input-klavye arası boşluğu daha da azalt */
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 0.4rem 0.55rem !important; /* iç paddingi de azalt */
        resize: none !important;
    }
    
    .cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet]::placeholder {
        color: #6c757d !important;
    }
    
    .cancellation-reason-modal-content .on-screen-keyboard[b-wuh4en1aet] {
        display: flex !important;
        flex-direction: column !important;
        padding: 0.26rem !important; /* blok yüksekliğini küçült */
        background-color: #f0f2f5 !important;
        border: 1px solid #d8dde3 !important;
        border-radius: 5px !important;
        margin-top: 0.12rem !important; /* textarea ile aradaki boşluğu kapat */
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .cancellation-reason-modal-content .keyboard-row[b-wuh4en1aet] {
        display: flex !important;
        justify-content: space-between !important;
        margin-bottom: 0.12rem !important; /* satırlar arası mesafe biraz daha az */
        width: 100% !important;
        gap: 0.12rem !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key[b-wuh4en1aet] {
        background-color: #ffffff !important;
        color: #343a40 !important;
        border: 1px solid #bcc3ca !important;
        border-radius: 4px !important;
        padding: 0.32rem !important;
        margin: 0.1rem !important;
        font-size: 0.92rem !important;   /* bir tık daha küçült */
        font-weight: 600 !important;
        flex-grow: 1 !important;
        flex-basis: 0 !important;
        min-width: 44px !important;
        height: 47px !important; /* bir tık daha azalt */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        transition: background-color 0.1s, border-color 0.1s, transform 0.05s !important;
        text-align: center !important;
        line-height: 1 !important;
        box-shadow: 0 1px 1px rgba(0,0,0,0.05) !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key:hover[b-wuh4en1aet] {
        background-color: #e9ecef !important;
        border-color: #adb5bd !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key:active[b-wuh4en1aet] {
        background-color: #dee2e6 !important;
        transform: scale(0.96) !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key.key-space[b-wuh4en1aet] {
        flex-grow: 4 !important;
        min-width: 240px !important;
        background-color: #ffffff !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key.key-space:hover[b-wuh4en1aet] {
        background-color: #e2e6ea !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key.key-backspace[b-wuh4en1aet],
    .cancellation-reason-modal-content .keyboard-key.key-caps[b-wuh4en1aet] {
        flex-grow: 1.6 !important;
        min-width: 72px !important;
        background-color: #e9ecef !important;
        font-weight: 600 !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key.key-backspace:hover[b-wuh4en1aet],
    .cancellation-reason-modal-content .keyboard-key.key-caps:hover[b-wuh4en1aet] {
        background-color: #d8dde2 !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key i[b-wuh4en1aet] {
        font-size: 1rem !important;
    }
    
    .cancellation-reason-modal-content .keyboard-key.key-caps.active[b-wuh4en1aet] {
        background-color: #0d6efd !important;
        color: white !important;
        border-color: #0a58ca !important;
    }
    
    .cancellation-reason-modal-content .modal-footer[b-wuh4en1aet] {
        background-color: #f8f9fa !important;
        border-top: 1px solid #dee2e6 !important;
        padding: 0.45rem 0.7rem !important; /* buton alanını bir tık daha küçült */
        display: flex !important;
        justify-content: center !important; /* ortala */
        gap: 0.75rem !important; /* eşit boşluk */
    }

    .cancellation-reason-modal-content .modal-footer .btn[b-wuh4en1aet] {
        font-size: 0.9rem !important;
        padding: 0.45rem 0.8rem !important;
        width: 200px !important;           /* iki butonu eşitle */
        min-width: 200px !important;
        max-width: 200px !important;
        display: inline-flex !important;    /* içerik hizası sabit */
        align-items: center !important;
        justify-content: center !important;
    }
}

@media (max-width: 576px) {
    .fullscreen-modal-content-dark.cancellation-reason-modal-content[b-wuh4en1aet] {
        width: 95vw;
        margin: 0.5rem auto;
    }
    .cancellation-reason-modal-content .modal-header .modal-title[b-wuh4en1aet] {
        font-size: 1.05rem;
    }
    .cancellation-reason-modal-content .modal-footer .btn[b-wuh4en1aet] {
        font-size: 0.8rem;
        padding: 0.35rem 0.7rem;
    }
    .cancellation-reason-modal-content .keyboard-key[b-wuh4en1aet] {
        font-size: 0.8rem;
        padding: 0.25rem;
        height: 38px;
        margin: 0.1rem;
        min-width: 25px;
    }
    .cancellation-reason-modal-content .on-screen-keyboard[b-wuh4en1aet] {
        padding: 0.2rem;
    }
    .cancellation-reason-modal-content .cancellation-reason-textarea[b-wuh4en1aet] {
        font-size: 0.9rem;
        min-height: 60px;
    }
}

@media (max-width: 1366px) and (max-height: 768px) {
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(5, 1fr); /* Restored */
        gap: 6px; /* Further reduce gap between cards */
        padding: 8px; /* Further reduce padding */
    }

    .group-card[b-wuh4en1aet] {
        min-height: 50px; /* Further reduce card height */
    }

    .group-card-title[b-wuh4en1aet] {
        font-size: 0.7rem; /* Further reduce font size */
        line-height: 1.1; /* Further reduce line height */
    }
}

@media (max-width: 1366px) and (max-height: 768px) {
    .group-card-title[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Override inline font size */
        line-height: 1.1 !important; /* Ensure line height is consistent */
    }
}

/* ADDED: Vertical separator line between cart panel and product panel */
.row.flex-grow-1.g-0 > .col-lg-5.bg-white.text-dark[b-wuh4en1aet] {
    border-right: 1px solid #dee2e6; 
    /* Bootstrap columns are box-sizing: border-box by default, so the border won't add to the width */
}

/* Cart Styles */
.mobile-cart-table thead th[b-wuh4en1aet] { /* Target existing mobile cart table header */
    position: sticky;
    top: 0;
    background-color: #f8f9fa; /* A light background for the sticky header */
    z-index: 10; /* Ensure it's above other table content */
}

.mobile-cart-table tbody tr td[b-wuh4en1aet] { /* Target existing mobile cart table data cells */
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    vertical-align: middle;
}

.cart-item-options td[b-wuh4en1aet] { /* New class for option rows */
    background-color: #FFF3CD; /* Light orange/yellowish background */
    color: #664d03; /* Darker text for contrast */
    font-weight: 500; /* Slightly bolder */
    padding: 0.4rem 0.5rem !important; /* Adjusted padding */
    font-size: 0.85rem; /* Slightly smaller font for options */
}

.cart-item-options td i[b-wuh4en1aet] {
    margin-right: 0.3rem;
}

.cart-item-comment td[b-wuh4en1aet] { /* New class for comment rows */
    background-color: #cfe2ff; /* Light blue background (similar to text-primary) */
    color: #0a367e; /* Darker blue text */
    font-style: italic;
    padding: 0.4rem 0.5rem !important; /* Adjusted padding */
    font-size: 0.85rem; /* Slightly smaller font for comments */
}

.cart-item-comment td i[b-wuh4en1aet] {
    margin-right: 0.3rem;
}

.mobile-cart-table tbody tr[b-wuh4en1aet] {
    border-bottom: 1px solid #e0e0e0; /* Light border for each row */
}

.mobile-cart-table tbody tr:last-child[b-wuh4en1aet] {
    border-bottom: none; /* No border for the last item */
}

/* Ensure the cart container scrolls nicely */
.col-lg-5.bg-white.text-dark.d-flex.flex-column.h-100 > .flex-grow-1.p-2.overflow-auto[b-wuh4en1aet] {
    max-height: calc(100vh - 220px); /* Adjust based on other elements in the left panel like header, footer, payment accordion */
                                     /* This value (220px) might need tuning */
    scrollbar-width: thin; /* For Firefox */
    scrollbar-color: #007bff #f8f9fa; /* For Firefox - thumb and track */
}

.col-lg-5.bg-white.text-dark.d-flex.flex-column.h-100 > .flex-grow-1.p-2.overflow-auto[b-wuh4en1aet]::-webkit-scrollbar {
    width: 8px;
}

.col-lg-5.bg-white.text-dark.d-flex.flex-column.h-100 > .flex-grow-1.p-2.overflow-auto[b-wuh4en1aet]::-webkit-scrollbar-track {
    background: #f8f9fa; /* Light grey track */
}

.col-lg-5.bg-white.text-dark.d-flex.flex-column.h-100 > .flex-grow-1.p-2.overflow-auto[b-wuh4en1aet]::-webkit-scrollbar-thumb {
    background-color: #007bff; /* Blue scrollbar thumb */
    border-radius: 10px;
    border: 2px solid #f8f9fa; /* Padding around thumb */
}

/* === REVISED CART STYLES START === */

/* Sticky Header for Cart Table */
.mobile-cart-table thead th[b-wuh4en1aet] {
    position: sticky;
    top: 0;
    background-color: #f8f9fa; /* Light background for sticky header */
    z-index: 10;
    padding: 0.5rem 0.5rem; /* Adjusted padding for header */
    font-size: 0.85rem; /* Slightly smaller header font */
}

/* Default styling for all cart item rows in tbody */
.mobile-cart-table tbody tr td[b-wuh4en1aet] {
    padding: 0.4rem 0.5rem; /* Compact padding for all cells */
    vertical-align: middle;
    font-size: 0.9rem; /* Base font size for cart items */
}

/* Main product item row */
.mobile-cart-table tbody tr.table-row[b-wuh4en1aet] { /* Assuming .table-row is on the main product TR */
    background-color: #fff;
    border-bottom: 1px solid #e9ecef; /* Light separator line for main items */
}

.mobile-cart-table tbody tr.table-row:last-of-type[b-wuh4en1aet] {
    border-bottom: none;
}

/* General style for the TR of a detail row (options/comments) */
.cart-item-detail-row[b-wuh4en1aet] {
    background-color: #fdfdfe; /* Very subtle off-white, almost white */
}

/* Content cell for options within a detail row */
td.cart-item-options-content[b-wuh4en1aet] {
    padding: 0.3rem 0.5rem 0.3rem 0.8rem; /* Top/Right/Bottom/Left padding */
    font-size: 0.8rem;
    color: #333; /* Darker grey for better readability */
    border-left: 3px solid #17a2b8; /* Bootstrap info color for left border cue */
    vertical-align: top;
}

/* Content cell for comments within a detail row */
td.cart-item-comment-content[b-wuh4en1aet] {
    padding: 0.3rem 0.5rem 0.3rem 0.8rem; 
        font-size: 0.8rem;
    color: #333; /* Changed to darker grey, same as options */
    /* font-style: italic; REMOVED */
    border-left: 3px solid #6c757d; 
    vertical-align: top;
}

/* Icons within these content cells */
td.cart-item-options-content i[b-wuh4en1aet],
td.cart-item-comment-content i[b-wuh4en1aet] {
    margin-right: 0.4rem;
    color: #555; /* Consistent icon color */
}

/* Ensure the first empty TD in detail rows doesn't pick up other TD stylings if any */
.cart-item-detail-row td:first-child[b-wuh4en1aet] {
    border-left: none;
    background-color: transparent; 
}

/* === REVISED CART STYLES END === */

/* Geri Al buttons - make them smaller */
.btn-sm[title*="Geri Al"][b-wuh4en1aet] {
    font-size: 0.65rem !important;
    padding: 0.15rem 0.4rem !important;
}

.btn-sm[title*="Geri Al"] i[b-wuh4en1aet] {
    font-size: 0.6rem !important;
}

/* === Zayi (Waste) Content Styles === */
.cart-item-waste-content[b-wuh4en1aet] {
    background-color: #FFF3E0 !important; /* Çok açık turuncu arkaplan */
    color: #E65100 !important; /* Koyu turuncu yazı */
    font-weight: 500 !important;
    padding: 0.4rem 0.5rem !important;
    font-size: 0.85rem !important;
    border-left: 3px solid #FF8C00 !important; /* Dark Orange sol kenarlık */
}

.cart-item-waste-content i[b-wuh4en1aet] {
    color: #FF8C00 !important; /* Dark Orange ikon rengi */
    margin-right: 0.4rem !important;
}

.cart-item-waste-content span[b-wuh4en1aet] {
    color: #E65100 !important; /* Koyu turuncu yazı rengi */
}

/* === Cancelled/Deleted Item Styles (İptal edilen ürünler için) === */
.cart-item-cancelled-content[b-wuh4en1aet] {
    background-color: #FFEBEE !important; /* Açık kırmızı arkaplan */
    color: #B71C1C !important; /* Koyu kırmızı yazı */
    font-weight: 500;
    padding: 0.4rem 0.5rem !important;
    font-size: 0.85rem;
    border-left: 3px solid #DC3545 !important; /* Bootstrap danger kırmızı sol kenarlık */
}

.cart-item-cancelled-content i[b-wuh4en1aet] {
    color: #DC3545 !important; /* Bootstrap danger kırmızı ikon */
    margin-right: 0.4rem;
}

.cart-item-cancelled-content span[b-wuh4en1aet] {
    color: #B71C1C !important; /* Koyu kırmızı yazı */
}

/* === 1366x768 RESPONSIVE OPTIMIZATIONS === */
/* Bu düzenlemeler 1920x1080'i hiç etkilemez, sadece 1366x768 ekranları optimize eder */

@media (max-width: 1366px) {
    /* ANA LAYOUT - Daha compakt yapı */
    body[b-wuh4en1aet], html[b-wuh4en1aet] {
        font-size: 14px !important; /* Genel font boyutunu küçült */
    }
    
    /* MASA GRUPLARI SEKSİYONU */
    .group-section[b-wuh4en1aet] {
        padding: 6px 10px !important; /* Daha az iç boşluk */
        max-height: 110px !important; /* Daha düşük yükseklik */
        gap: 4px !important; /* Daha az boşluk */
    }
    
    .group-section .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük yazı */
        padding: 6px 12px !important; /* Daha az iç boşluk */
        min-width: 95px !important; /* Daha dar minimum genişlik */
        margin: 2px !important; /* Daha az dış boşluk */
        line-height: 1.2 !important; /* Satır yüksekliğini azalt */
    }
    
    .table-count-badge[b-wuh4en1aet] {
        font-size: 0.6rem !important; /* Daha küçük badge */
        padding: 1px 3px !important; /* Daha az iç boşluk */
        min-width: 18px !important; /* Daha küçük minimum genişlik */
        right: -3px !important; /* Konumu ayarla */
        top: -3px !important; /* Konumu ayarla */
    }
    
    /* ÜRÜN GRID VE KARTLARI */
    .product-grid[b-wuh4en1aet] {
        gap: 0.25rem !important; /* Ürünler arası boşluğu azalt */
        padding: 0.4rem !important; /* Grid'in genel iç boşluğunu azalt */
        grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important; /* Daha küçük kart genişliği */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 85px !important; /* Daha düşük minimum yükseklik */
        padding: 3px !important; /* Daha az iç boşluk */
    }

    .product-image.has-image[b-wuh4en1aet] {
        height: 40px !important; /* Resim yüksekliğini azalt */
        margin-bottom: 2px !important;
    }

    .product-title[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Ürün başlık fontunu küçült */
        line-height: 1.1 !important; /* Satır yüksekliğini azalt */
        margin-bottom: 2px !important;
    }

    .product-price[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Fiyat fontunu küçült */
        margin-bottom: 1px !important;
    }
    
    /* MASA KARTLARI */
    .table-card[b-wuh4en1aet] {
        width: 140px !important; /* Daha dar masa kartları */
        height: 180px !important; /* Daha kısa masa kartları */
        margin: 5px !important; /* Daha az dış boşluk */
        font-size: 0.7rem !important; /* Daha küçük font */
    }
    
    .responsive-table-card[b-wuh4en1aet] {
        padding: 8px !important; /* Daha az iç boşluk */
    }
    
    .responsive-table-card h5[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük başlık */
        margin-bottom: 4px !important;
    }
    
    .responsive-table-card .small[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük küçük yazılar */
        line-height: 1.1 !important;
    }
    
    /* MASA BAŞLIK BİLGİLERİ */
    .mesa-title[b-wuh4en1aet] {
        font-size: 1rem !important; /* Daha küçük masa başlığı */
        padding: 0.3rem 0.5rem !important;
    }
    
    .masa-info-box[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük bilgi kutusu */
        padding: 0.2rem 0.4rem !important;
    }
    
    /* BUTONLAR */
    .btn-square[b-wuh4en1aet] {
        width: 35px !important; /* Daha küçük square butonlar */
        height: 35px !important;
        font-size: 0.8rem !important;
    }
    
    .btn-lg[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Büyük butonları küçült */
        padding: 0.4rem 0.8rem !important;
    }
    
    /* SEPET PANELİ */
    .mobile-cart-table th[b-wuh4en1aet],
    .mobile-cart-table td[b-wuh4en1aet] {
        padding: 3px !important; /* Daha az cell padding */
        font-size: 0.75rem !important; /* Daha küçük tablo yazısı */
    }
    
    /* MODAL VE WIZARD */
    .wizard-modal-body[b-wuh4en1aet] {
        padding: 0.8rem !important; /* Daha az modal padding */
    }
    
    .wizard-option-item[b-wuh4en1aet] {
        padding: 0.4rem !important; /* Daha az option padding */
        font-size: 0.8rem !important;
    }
    
    .wizard-quantity-button[b-wuh4en1aet] {
        width: 35px !important; /* Daha küçük quantity butonlar */
        height: 35px !important;
        font-size: 0.8rem !important;
    }
    
    /* PAYMENT OPTIONS */
    .payment-options .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük ödeme butonları */
        padding: 0.4rem 0.6rem !important;
    }
    
    /* ACCORDION */
    .accordion-button[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük accordion başlıkları */
        padding: 0.6rem 1rem !important;
    }
}

@media (max-width: 1366px) and (max-height: 768px) {
    /* ÖZEL 1366x768 DÜZENLEMELERİ */
    
    /* TÜM PARENT ELEMANLARI SIFIRLA */
    body[b-wuh4en1aet], html[b-wuh4en1aet], #app[b-wuh4en1aet], .page[b-wuh4en1aet], .main[b-wuh4en1aet], .content-wrapper[b-wuh4en1aet], .content[b-wuh4en1aet] {
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        background: #fff !important;
    }
    
    /* ANA LAYOUT */
    .tablesales-list[b-wuh4en1aet] {
        height: 100vh !important;
        max-height: 100vh !important;
        padding: 0 !important;
        margin: 0 !important;
        background: #fff !important;
        display: flex !important;
        flex-direction: column !important;
    }
    
    /* GRUP SEKSİYONU - Daha kompakt */
    .group-section[b-wuh4en1aet] {
        max-height: 75px !important;
        padding: 5px 8px !important;
        flex-shrink: 0;
        margin: 0 !important;
        background: #fff;
    }
    
         .group-section .btn[b-wuh4en1aet] {
         font-size: 0.9rem !important; /* Biraz daha büyük yazı */
         padding: 12px 14px !important; /* Daha yüksek - parmak dostu */
         min-width: 90px !important; /* Biraz daha geniş */
         margin: 2px !important;
         border-radius: 12px !important; /* Daha oval - 1920x1080 ile aynı */
         line-height: 1.3 !important;
         display: flex !important; /* Flex layout */
         align-items: center !important; /* Dikey ortalama */
         justify-content: center !important; /* Yatay ortalama */
         text-align: center !important; /* Yazı ortala */
         min-height: 40px !important; /* Minimum dokunmatik yükseklik */
     }
     
     /* Badge stilleri - Daha büyük ve net */
     .group-section .position-relative .badge.table-count-badge[b-wuh4en1aet] {
         font-size: 0.65rem !important; /* Daha büyük badge yazı */
         padding: 2px 4px !important; /* Biraz padding */
         min-width: 24px !important; /* Daha geniş badge */
         height: 20px !important; /* Daha yüksek badge */
         display: flex !important;
         align-items: center !important;
         justify-content: center !important;
         top: -8px !important; /* Biraz daha yukarı */
         right: -8px !important; /* Biraz daha sağa */
         line-height: 1 !important;
         transform: translate(50%, -50%) !important;
         font-weight: bold !important; /* Kalın yazı */
         border: 1px solid rgba(255,255,255,0.3) !important; /* Hafif border */
     }
    
    .group-section .position-relative .badge.table-count-badge > span[b-wuh4en1aet] {
        transform: translateY(0) !important;
        line-height: 1 !important;
    }
    
    /* MASA SECTION - Tüm alanı kapla */
    .table-section[b-wuh4en1aet] {
        flex: 1 !important;
        height: auto !important;
        max-height: none !important;
        padding: 5px !important;
        margin: 0 !important;
        overflow-y: auto !important;
        background: #fff !important;
        display: flex !important;
        flex-wrap: wrap !important;
        align-content: flex-start !important;
    }
    
    .table-card[b-wuh4en1aet] {
        width: 130px !important; /* Daha da dar */
        height: 160px !important; /* Daha da kısa */
        margin: 3px !important; /* Minimal margin */
    }
    
    .responsive-table-card h5[b-wuh4en1aet] {
        font-size: 0.8rem !important;
        margin-bottom: 2px !important;
    }
    
    .responsive-table-card .small[b-wuh4en1aet] {
        font-size: 0.6rem !important;
    }
    
    /* SEPET PANELİ - Sol taraf optimizasyonu */
    .col-lg-5.bg-white.text-dark.d-flex.flex-column.h-100[b-wuh4en1aet] {
        display: flex !important;
        flex-direction: column !important;
        height: 100vh !important;
        overflow: hidden !important;
    }
    
    .flex-grow-1.p-2.overflow-auto[b-wuh4en1aet] {
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        max-height: calc(100vh - 200px) !important; /* Accordion için yer bırak */
        padding: 0.5rem !important; /* Daha az padding */
    }
    
    .p-2.border-top.bg-light[b-wuh4en1aet] {
        flex: 0 0 auto !important;
        padding: 0.5rem !important; /* Daha az padding */
    }
    
    /* MASA BAŞLIK ALANI - HEADER OPTİMİZASYONU */
    .p-3.border-bottom.d-flex.align-items-center.justify-content-between[b-wuh4en1aet] {
        padding: 0.4rem 0.6rem !important; /* Çok daha az padding - p-3'ten çok daha küçük */
        height: 45px !important; /* Sabit düşük yükseklik */
        min-height: 45px !important; /* Minimum yükseklik garantisi */
        box-sizing: border-box !important;
    }
    
    /* MASA BAŞLIĞI - KÜÇÜK FONT */
    .mesa-title[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Çok daha küçük başlık */
        line-height: 1.2 !important; /* Kompakt satır yüksekliği */
        margin: 0 !important; /* Tüm marjinleri sıfırla */
        padding: 0 !important; /* Tüm paddingleri sıfırla */
        font-weight: 600 !important; /* Biraz daha ince yazı */
    }
    
    /* MASA BİLGİ KUTUSU - KÜÇÜK */
    .masa-info-box[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Çok daha küçük bilgi yazısı */
        line-height: 1.1 !important; /* Kompakt satır yüksekliği */
        margin: 0 !important; /* Tüm marjinleri sıfırla */
        padding: 0 !important; /* Tüm paddingleri sıfırla */
        opacity: 0.8 !important;
    }
    
    /* GERİ BUTONU - KÜÇÜK */
    .p-3.border-bottom.d-flex.align-items-center.justify-content-between .btn[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük buton yazısı */
        padding: 0.3rem 0.5rem !important; /* Daha az buton padding */
        height: 32px !important; /* Sabit buton yüksekliği */
        min-width: 60px !important; /* Minimum buton genişliği */
        line-height: 1.1 !important; /* Kompakt satır yüksekliği */
    }
    
    /* SİL İKONU - KÜÇÜK */
    .p-3.border-bottom.d-flex.align-items-center.justify-content-between .bi[b-wuh4en1aet] {
        font-size: 1.3rem !important; /* Daha küçük ikon boyutu */
        padding: 0.2rem !important; /* Az padding */
    }
    
    /* ORTA ALAN - BAŞLIK KAPSAYICISI */
    .p-3.border-bottom.d-flex.align-items-center.justify-content-between .flex-grow-1[b-wuh4en1aet] {
        padding: 0 0.5rem !important; /* Yan taraflardan az boşluk */
    }
    
    /* MOBİL HEADER ALANI - KÜÇÜK */
    .mobile-top-menu[b-wuh4en1aet] {
        padding: 0.4rem 0.6rem !important; /* Daha az padding */
        height: 45px !important; /* Sabit düşük yükseklik */
        min-height: 45px !important; /* Minimum yükseklik garantisi */
    }
    
    .mobile-top-menu .mesa-title[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Daha küçük başlık */
        line-height: 1.2 !important;
        margin: 0 !important;
    }
    
    .mobile-top-menu .masa-info-box[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük bilgi yazısı */
        line-height: 1.1 !important;
    }
    
    .mobile-top-menu .btn[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük buton */
        padding: 0.3rem 0.5rem !important;
        height: 32px !important;
    }
    
    /* ACCORDION - Alt kısım optimizasyonu */
    .accordion#paymentAccordion[b-wuh4en1aet] {
        position: relative !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 10 !important;
        background-color: white !important;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1) !important;
        margin-top: auto !important;
    }
    
    .accordion-button[b-wuh4en1aet] {
        font-size: 0.8rem !important;
        padding: 0.5rem 0.8rem !important;
    }
    
    /* PAYMENT OPTIONS - 1366x768 İÇİN TEK SATIR DÜZEN */
    /* Tüm butonlar tek satırda - 7 buton: Nakit, Kredi, Yemek Çeki, Online Ödeme, Parçalı Ödeme, İskonto, Cari */
    .accordion-body .payment-buttons-container[b-wuh4en1aet] {
        gap: 2px !important; /* Butonlar arası boşluk - biraz daha fazla */
        margin-bottom: 0 !important; /* Alt boşluğu kaldır - daha fazla yer kazanmak için */
        flex-wrap: nowrap !important; /* Butonların alt satıra geçmesini engelle */
    }
    
    /* Payment button genel stilleri - 1366x768 için kompakt ama dokunmatik dostu */
    .accordion-body .btn-sm.payment-button[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Çok küçük yazı boyutu - 7 buton sığması için */
        padding: 0.5rem 0.3rem !important; /* Dikey padding daha da artırıldı - güvenli dokunma için */
        min-height: 36px !important; /* Daha yüksek butonlar - yanlışlıkla tıklamayı önlemek için */
        margin: 0 !important; /* Margin'i kaldır */
        border-radius: 5px !important; /* Daha yumuşak köşeler */
        flex: 1 !important; /* Butonları eşit genişlikte yap */
        max-width: none !important; /* Max width kısıtlaması kaldır */
        white-space: nowrap !important; /* Yazıların alt satıra geçmesini engelle */
        overflow: hidden !important; /* Taşan içeriği gizle */
        text-overflow: ellipsis !important; /* Uzun yazıları ... ile göster */
        min-width: 0 !important; /* Minimum genişlik kısıtlaması kaldır */
    }
    
    /* İkon boyutları da çok küçük olsun */
    .accordion-body .btn-sm.payment-button i[b-wuh4en1aet] {
        font-size: 0.6rem !important; /* Çok küçük ikonlar */
        margin-right: 0.15rem !important; /* İkon ve yazı arası minimal boşluk */
    }
    
    /* PRODUCT GRID - 1366x768 İÇİN ULTRA KOMPAKT */
    .product-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fill, minmax(85px, 1fr)) !important; /* Daha küçük minimum genişlik */
        gap: 0.15rem !important; /* Daha az boşluk */
        padding: 4px !important; /* Çok az padding - ürünlerin scroll alanını doldurması için */
        margin: 0 !important; /* Margin'i tamamen kaldır */
        overflow: visible !important; /* Overflow'u wrapper'a bırak */
        border: none !important; /* Border'ı kaldır */
        background: white !important; /* Beyaz arka plan */
        align-content: start !important; /* İçeriği üstten başlat */
    }

    .product-card[b-wuh4en1aet] {
        min-height: 85px !important; /* Biraz büyütüldü */
        max-height: 85px !important; /* Maksimum yükseklik */
        width: 85px !important; /* Sabit genişlik */
        padding: 2px !important; /* Biraz padding */
        border-radius: 4px !important; /* Küçük border radius */
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        overflow: hidden !important;
    }

    .product-image.has-image[b-wuh4en1aet] {
        height: 40px !important; /* Resim büyütüldü */
        margin-bottom: 2px !important;
        object-fit: cover !important;
        flex-shrink: 0 !important;
    }

    .product-title[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Yazı büyütüldü */
        line-height: 1.0 !important; /* Biraz daha rahat satır aralığı */
        margin-bottom: 1px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important; /* Maksimum 2 satır */
        -webkit-box-orient: vertical !important;
        height: auto !important;
        max-height: 28px !important; /* 2 satır için daha büyük maksimum yükseklik */
    }
    
    /* ÜRÜN İSİMLERİNİ DOĞRU ŞEKİLDE ORTALA - YÜKSEK ÖNCELİK */
    .product-card .product-details-wrapper .product-title[b-wuh4en1aet] {
        text-align: center !important; /* Ürün adını ortaya al */
        justify-self: center !important;
        align-self: center !important;
        width: 100% !important; /* Tam genişlik */
        display: flex !important; /* Flex yapısı - ortalama için */
        align-items: center !important; /* Dikey ortala */
        justify-content: center !important; /* Yatay ortala */
        flex-grow: 1 !important; /* Orta alanda büyüsün */
        margin: 0 !important; /* Margin'i sıfırla */
    }
    
    /* ÜRÜN FİYATLARINI DA ORTALA - YÜKSEK ÖNCELİK */
    .product-card .product-details-wrapper .product-price[b-wuh4en1aet] {
        text-align: center !important; /* Fiyatı ortaya al */
        width: 100% !important; /* Tam genişlik */
        display: block !important; /* Block yapısı */
        margin: 0 auto !important; /* Ortaya hizala */
        margin-top: auto !important; /* Alt tarafa yapıştır */
    }

    .product-price[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Fiyat yazısı büyütüldü */
        font-weight: 600 !important; /* Kalın yazı */
        margin-top: auto !important; /* Alt tarafa yapıştır */
        flex-shrink: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    
    /* GRUP KARTLARI - 1366x768 İÇİN ULTRA KOMPAKT */
    .group-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fill, minmax(75px, 1fr)) !important; /* Daha küçük minimum */
        gap: 2px !important; /* Daha az boşluk */
        padding: 2px !important; /* Daha az padding */
        max-height: 60px !important; /* Daha düşük maksimum yükseklik */
        overflow-y: auto !important; /* Gerekirse kaydırma */
        margin-bottom: 8px !important; /* Ürünlerle araya biraz boşluk */
        padding-top: 2px !important; /* Minimal üst padding */
        padding-bottom: 2px !important; /* Alt padding ekle */
    }
    
    /* GROUP-GRID'IN PT-3 SINIFINI GERİ GETİR - ÜRÜN GRUBU İLE ÜRÜN KARTLARI ARASI BOŞLUK GEREKLİ */
    .group-grid.pt-3[b-wuh4en1aet] {
        padding-top: 12px !important; /* pt-3 değerini geri getir */
    }
    
    /* BG-LIGHT ARTIK HTML'DEN KALDIRILDI - GEREKSIZ OVERRIDE'LAR TEMİZLENDİ */

    .group-card[b-wuh4en1aet] {
        min-height: 28px !important; /* Çok kısa kartlar */
        max-height: 35px !important; /* Maksimum yükseklik */
        border-radius: 3px !important; /* Küçük border radius */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        cursor: pointer !important;
    }

    .group-card-body[b-wuh4en1aet] {
        padding: 1px !important; /* Minimum padding */
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .group-card-title[b-wuh4en1aet] {
        font-size: 0.6rem !important; /* Biraz daha büyük yazı */
        line-height: 1.1 !important; /* Daha rahat satır aralığı */
        text-align: center !important;
        overflow: visible !important; /* Overflow'u görünür yap */
        text-overflow: clip !important; /* Ellipsis'i kaldır */
        white-space: normal !important; /* Çok satırlı yazıya izin ver */
        margin: 0 !important;
        padding: 0 2px !important; /* Minimal yan padding */
        max-width: 100% !important;
        font-weight: 400 !important; /* Normal yazı kalınlığı - daha yumuşak */
        text-shadow: 0 1px 1px rgba(0,0,0,0.1) !important; /* Çok hafif gölge */
        word-wrap: break-word !important; /* Uzun kelimeler kırılsın */
        display: flex !important; /* Flex kullan */
        align-items: center !important; /* Dikey ortala */
        justify-content: center !important; /* Yatay ortala */
        height: 100% !important; /* Kartın tüm yüksekliğini kullan */
        opacity: 0.85 !important; /* Hafif şeffaflık - daha yumuşak görünüm */
    }
    
    /* PRODUCT CONTAINER - 1366x768 İÇİN BOŞLUK ELİMİNASYONU */
    .product-container[b-wuh4en1aet] {
        border: none !important; /* Tüm border'ları kaldır */
        padding: 0 !important; /* Tüm padding'leri kaldır */
        margin: 0 !important; /* Tüm margin'leri kaldır */
        gap: 0 !important; /* Flex gap'i kaldır */
        background: white !important; /* Arka planı beyaz */
        display: flex !important; /* Flex container */
        flex-direction: column !important; /* Dikey sıralama */
        flex: 1 !important; /* Kalan alanı kapla */
        min-height: 0 !important; /* Flex shrink için gerekli */
    }
    
    .product-grid-wrapper[b-wuh4en1aet] {
        flex: 1 !important; /* Kalan alanı kapla */
        overflow-y: auto !important; /* Kaydırma çubuğu */
        padding: 0 !important; /* Tüm padding'leri kaldır */
        margin: 0 !important; /* Tüm margin'leri kaldır */
        border: none !important; /* Border'ı kaldır */
        background: white !important; /* Beyaz arka plan */
        min-height: 0 !important; /* Flex item'ın küçülmesine izin ver */
        height: 0 !important; /* Flex item'ı sıfırla, flex: 1 ile büyüsün */
    }
    
    /* ARAMA VE MİKTAR BARLARI ALANI - KOMPAKTLAŞTIRILMİŞ */
    .search-container[b-wuh4en1aet] {
        padding: 2px 4px 2px 4px !important; /* Çok minimal padding */
        border-radius: 0 !important; /* Border radius'u kaldır */
        margin: 0 !important; /* Tüm margin'leri kaldır */
        flex-shrink: 0 !important; /* Search container'ın küçülmesini engelle */
        border: none !important; /* Tüm border'ları kaldır */
        background: white !important; /* Arka planı beyaz yap */
        background-color: white !important; /* Background color beyaz */
        box-shadow: none !important; /* Gölgeyi kaldır */
        min-height: 40px !important; /* Daha düşük minimum yükseklik */
        max-height: 40px !important; /* Daha düşük maksimum yükseklik */
    }
    
    /* PRODUCT-CONTAINER'IN ARKA PLANINI DA KONTROL ET */
    .product-container.position-relative[b-wuh4en1aet] {
        background: white !important; /* Beyaz arka plan */
        background-color: white !important; /* Background color beyaz */
    }
    
    .search-row[b-wuh4en1aet] {
        padding: 1px !important; /* Minimal iç padding */
        border-radius: 0 !important; /* Border radius kaldır */
        gap: 4px !important; /* Çok az gap */
        background: transparent !important; /* Arka planı şeffaf */
        border: none !important; /* Border'ı kaldır */
    }
    
    .search-box-container[b-wuh4en1aet] {
        padding: 2px !important; /* Daha az padding */
        min-width: 120px !important; /* Daha dar minimum genişlik */
        background: transparent !important; /* Arka planı şeffaf */
    }
    
    .quick-quantity-container[b-wuh4en1aet] {
        padding: 2px !important; /* Daha az padding */
        background: transparent !important; /* Arka planı şeffaf */
    }
    
    .search-input[b-wuh4en1aet] {
        height: 24px !important; /* Daha da düşük input yüksekliği */
        font-size: 0.7rem !important; /* Daha küçük font */
        padding: 0 6px !important; /* Daha az padding */
    }
    
    .quantity-btn[b-wuh4en1aet] {
        min-width: 35px !important; /* Daha dar butonlar */
        height: 24px !important; /* Arama kutusuyla aynı yükseklik */
        padding: 0 4px !important; /* Daha az padding */
        font-size: 0.65rem !important; /* Daha küçük font */
        font-weight: 500 !important; /* Daha ince yazı */
        margin: 0 1px !important; /* Daha az margin */
        border-radius: 3px !important; /* Daha küçük border radius */
    }
    
    .quick-quantity-buttons[b-wuh4en1aet] {
        gap: 2px !important; /* Butonlar arası daha az gap */
        padding: 1px 2px !important; /* Daha az padding */
    }
    
    /* MODAL VE DİĞER ELEMENTLERİ OPTİMİZE ET */
    .modal-content[b-wuh4en1aet] {
        font-size: 0.85rem !important;
    }
    
    .btn-lg[b-wuh4en1aet] {
        font-size: 0.85rem !important;
        padding: 0.3rem 0.6rem !important;
    }
    
    /* TABLO STİLLERİ */
    .mobile-cart-table th[b-wuh4en1aet],
    .mobile-cart-table td[b-wuh4en1aet] {
        padding: 2px !important;
        font-size: 0.7rem !important;
        line-height: 1.1 !important;
    }
    
    /* ÇOK GÜÇLÜ BTN-SQUARE DÜZELTMESİ - HER TÜRLÜ ÇALIŞSIN */
    .btn.btn-square[b-wuh4en1aet],
    button.btn-square[b-wuh4en1aet],
    .btn-square.btn[b-wuh4en1aet],
    button.btn.btn-square[b-wuh4en1aet] {
        min-width: 70px !important;
        width: 70px !important;
        font-size: 0.65rem !important;
        padding: 0.3rem 0.4rem !important;
        margin-right: 3px !important;
        line-height: 1.1 !important;
        height: 32px !important;
        border-radius: 4px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .btn.btn-square i[b-wuh4en1aet],
    button.btn-square i[b-wuh4en1aet],
    .btn-square.btn i[b-wuh4en1aet],
    button.btn.btn-square i[b-wuh4en1aet] {
        font-size: 0.7rem !important;
        margin-right: 0.25rem !important;
    }
    
    /* ÜRÜN DETAY MODALI - 1366x768 İÇİN OPTİMİZASYON */
    .modal-backdrop .modal-content[b-wuh4en1aet] {
        width: 500px !important; /* Daha dar modal */
        max-width: 90% !important; /* Ekran kenarlarından boşluk */
        padding: 15px !important; /* Daha az padding */
        font-size: 0.85rem !important; /* Genel font boyutu küçültme */
    }
    
    .modal-backdrop .modal-title[b-wuh4en1aet] {
        font-size: 1.1rem !important; /* Başlık daha küçük */
        margin-bottom: 15px !important; /* Daha az alt boşluk */
    }
    
    /* Miktar kontrol butonları */
    .modal-backdrop .modal-content .btn-outline-danger[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-outline-success[b-wuh4en1aet] {
        width: 45px !important; /* Daha küçük butonlar */
        height: 45px !important;
        padding: 0 !important;
    }
    
    .modal-backdrop .modal-content .btn-outline-danger i[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-outline-success i[b-wuh4en1aet] {
        font-size: 1.2rem !important; /* İkon boyutu küçültme */
    }
    
    /* Miktar input */
    .modal-backdrop .modal-content input[type="number"][b-wuh4en1aet] {
        width: 100px !important; /* Daha dar input */
        height: 45px !important; /* Butonlarla aynı yükseklik */
        font-size: 1.1rem !important; /* Daha küçük font */
        margin: 0 8px !important; /* Daha az margin */
    }
    
    /* Açıklama textarea */
    .modal-backdrop .modal-content textarea[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Daha küçük font */
        height: 50px !important; /* Daha kısa yükseklik */
    }
    
    /* Klavye butonu */
    .modal-backdrop .modal-content .btn-outline-secondary[b-wuh4en1aet] {
        min-width: 50px !important; /* Daha dar */
        padding: 0 8px !important;
    }
    
    .modal-backdrop .modal-content .btn-outline-secondary i[b-wuh4en1aet] {
        font-size: 1.3rem !important; /* Daha küçük klavye ikonu */
    }
    
    /* Modal içindeki butonlar */
    .modal-backdrop .modal-content .btn-lg[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük font */
        padding: 8px 12px !important; /* Daha az padding */
        height: auto !important; /* Otomatik yükseklik */
    }
    
    .modal-backdrop .modal-content .btn-lg i[b-wuh4en1aet] {
        font-size: 1rem !important; /* Daha küçük ikonlar */
        margin-right: 4px !important; /* Daha az margin */
    }
    
    /* Modal buton grupları */
    .modal-backdrop .modal-content .d-flex.justify-content-between[b-wuh4en1aet] {
        gap: 8px !important; /* Daha az gap */
        margin-bottom: 12px !important; /* Daha az alt boşluk */
    }
    
    .modal-backdrop .modal-content .d-flex.justify-content-end[b-wuh4en1aet] {
        gap: 8px !important; /* Daha az gap */
    }
    
    /* Modal buton minimum genişlikleri */
    .modal-backdrop .modal-content .btn[style*="min-width: 120px"][b-wuh4en1aet] {
        min-width: 80px !important; /* Daha dar butonlar */
    }
    
    /* İSKONTO MODALI - 1366x768 İÇİN OPTİMİZASYON */
    .modal-backdrop[style*="z-index: 1060"] .modal-content[b-wuh4en1aet] {
        width: 400px !important; /* Daha dar modal */
        max-width: 85% !important; /* Ekran kenarlarından boşluk */
        padding: 15px !important; /* Daha az padding */
        font-size: 0.85rem !important; /* Genel font boyutu küçültme */
    }
    
    .modal-backdrop[style*="z-index: 1060"] .modal-title[b-wuh4en1aet] {
        font-size: 1.1rem !important; /* Başlık daha küçük */
        margin-bottom: 12px !important; /* Daha az alt boşluk */
    }
    
    /* İskonto radio butonları */
    .modal-backdrop[style*="z-index: 1060"] .mb-3 label[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük label */
        margin-bottom: 8px !important;
    }
    
    .modal-backdrop[style*="z-index: 1060"] input[type="radio"][b-wuh4en1aet] {
        margin-right: 6px !important; /* Daha az margin */
    }
    
    .modal-backdrop[style*="z-index: 1060"] input[type="radio"] + label[b-wuh4en1aet] {
        margin-right: 15px !important; /* Radio butonları arası boşluk */
        font-size: 0.8rem !important;
    }
    
    /* İskonto değer inputu */
    .modal-backdrop[style*="z-index: 1060"] input[type="number"][b-wuh4en1aet] {
        height: 35px !important; /* Daha küçük input */
        font-size: 0.9rem !important; /* Daha küçük font */
        padding: 6px 10px !important; /* Daha az padding */
    }
    
    /* İskonto modal butonları */
    .modal-backdrop[style*="z-index: 1060"] .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük font */
        padding: 6px 12px !important; /* Daha az padding */
        height: auto !important; /* Otomatik yükseklik */
    }
    
    /* İskonto modal buton grupları */
    .modal-backdrop[style*="z-index: 1060"] .d-flex.gap-2[b-wuh4en1aet] {
        gap: 6px !important; /* Daha az gap */
        margin-bottom: 12px !important; /* Daha az alt boşluk */
    }
    
    .modal-backdrop[style*="z-index: 1060"] .d-flex.justify-content-end[b-wuh4en1aet] {
        gap: 8px !important; /* Daha az gap */
    }
    
    /* İskonto modal içeriği */
    .modal-backdrop[style*="z-index: 1060"] .mb-3[b-wuh4en1aet] {
        margin-bottom: 12px !important; /* Daha az alt boşluk */
    }
    
    /* ÖDEME MODALI - 1366x768 İÇİN BÜYÜK OPTİMİZASYON */
    .modal-backdrop[style*="z-index: 1050"] .modal-content[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Çok daha küçük genel font */
        padding: 8px !important; /* Minimal padding */
    }
    
    /* Modal başlığı */
    .modal-backdrop[style*="z-index: 1050"] .modal-title[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Daha küçük başlık */
        margin-bottom: 0 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .d-flex.justify-content-between.align-items-center[b-wuh4en1aet] {
        margin-bottom: 8px !important; /* Daha az alt boşluk */
        padding-bottom: 4px !important;
    }
    
    /* 3 sütun layout'u kompaktlaştır */
    .modal-backdrop[style*="z-index: 1050"] .d-flex.flex-column.flex-lg-row[b-wuh4en1aet] {
        gap: 0.5rem !important; /* Daha az gap */
    }
    
    /* Card'ları kompaktlaştır */
    .modal-backdrop[style*="z-index: 1050"] .card[b-wuh4en1aet] {
        border: 1px solid #dee2e6 !important;
        border-radius: 4px !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .card-header[b-wuh4en1aet] {
        padding: 6px 8px !important; /* Daha az padding */
        background-color: #f8f9fa !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .card-header h5[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük card başlıkları */
        margin-bottom: 0 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .card-header i[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük ikonlar */
    }
    
    .modal-backdrop[style*="z-index: 1050"] .card-body[b-wuh4en1aet] {
        padding: 4px !important; /* Minimal padding */
    }
    
    .modal-backdrop[style*="z-index: 1050"] .card-footer[b-wuh4en1aet] {
        padding: 6px 8px !important; /* Daha az padding */
        background-color: #f8f9fa !important;
    }
    
    /* Tablolar */
    .modal-backdrop[style*="z-index: 1050"] .table[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Çok küçük tablo yazısı */
        margin-bottom: 0 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .table td[b-wuh4en1aet] {
        padding: 2px 4px !important; /* Minimal cell padding */
        vertical-align: middle !important;
        line-height: 1.2 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .table small[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Çok küçük alt yazılar */
    }
    
    /* Toplam alanları */
    .modal-backdrop[style*="z-index: 1050"] .fw-bold[b-wuh4en1aet] {
        font-size: 0.75rem !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .fs-5[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük toplam fiyatları */
    }
    
    /* Butonlar */
    .modal-backdrop[style*="z-index: 1050"] .btn[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Çok küçük buton yazıları */
        padding: 4px 6px !important; /* Minimal buton padding */
        line-height: 1.2 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .btn i[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük buton ikonları */
        margin-right: 3px !important;
    }
    
    /* Özel büyük butonlar */
    .modal-backdrop[style*="z-index: 1050"] .btn[style*="height: 65px"][b-wuh4en1aet] {
        height: 45px !important; /* Daha düşük büyük butonlar */
        font-size: 0.7rem !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .btn[style*="height: 65px"] i[b-wuh4en1aet] {
        font-size: 1rem !important; /* İkonlar biraz daha büyük */
    }
    
    /* Input alanları */
    .modal-backdrop[style*="z-index: 1050"] .form-control[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük input yazısı */
        padding: 4px 6px !important; /* Daha az input padding */
        height: auto !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .form-label[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük label */
        margin-bottom: 3px !important; /* Daha az alt boşluk */
    }
    
    .modal-backdrop[style*="z-index: 1050"] .input-group[b-wuh4en1aet] {
        margin-bottom: 8px !important; /* Daha az alt boşluk */
    }
    
    /* Alert alanları */
    .modal-backdrop[style*="z-index: 1050"] .alert[b-wuh4en1aet] {
        padding: 6px 8px !important; /* Daha az alert padding */
        margin-bottom: 8px !important; /* Daha az alt boşluk */
        font-size: 0.7rem !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .alert h6[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük alert başlığı */
        margin-bottom: 0 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .alert .fs-5[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Alert içindeki büyük yazılar */
    }
    
    /* Grid layout düzenlemeleri */
    .modal-backdrop[style*="z-index: 1050"] .d-grid[b-wuh4en1aet] {
        gap: 4px !important; /* Daha az grid gap */
    }
    
    /* Boşluk düzenlemeleri */
    .modal-backdrop[style*="z-index: 1050"] .mb-2[b-wuh4en1aet] {
        margin-bottom: 4px !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .mb-3[b-wuh4en1aet] {
        margin-bottom: 6px !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .mt-3[b-wuh4en1aet] {
        margin-top: 6px !important;
    }
    
    /* HR çizgisi */
    .modal-backdrop[style*="z-index: 1050"] hr[b-wuh4en1aet] {
        margin: 8px 0 !important; /* Daha az margin */
    }

    /* ======= WIZARD MODAL 1366x768 OPTİMİZASYONU ======= */
    
    /* Wizard Modal Ana Container */
    .wizard-modal-fullscreen-content[b-wuh4en1aet] {
        width: calc(100% - 20px) !important; /* Daha az margin */
        height: calc(100% - 20px) !important; /* Daha az margin */
        max-width: 1300px !important; /* 1366 için uygun maksimum genişlik */
        max-height: 720px !important; /* 768 için uygun maksimum yükseklik */
    }
    
    /* Wizard Modal Header - Kompakt */
    .wizard-modal-header[b-wuh4en1aet] {
        height: 50px !important; /* Daha kısa header */
        padding: 0.4rem 0.8rem !important; /* Daha az padding */
    }
    
    .wizard-product-info .wizard-product-name[b-wuh4en1aet] {
        font-size: 1.1rem !important; /* Daha küçük başlık */
        line-height: 1.2 !important;
        margin: 0 !important;
    }
    
    .wizard-product-info .wizard-product-price[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük fiyat */
        margin: 0 !important;
    }
    
    /* Wizard Modal Body - Kompakt */
    .wizard-modal-body[b-wuh4en1aet] {
        padding: 0.4rem !important; /* Daha az padding */
        gap: 0.4rem !important; /* Daha az gap */
        max-height: calc(100% - 120px) !important; /* Header + footer için yer bırak */
    }
    
    /* Options Panel - Sol taraf */
    .wizard-options-panel[b-wuh4en1aet] {
        padding: 0.4rem !important; /* Daha az padding */
        border-radius: 0.2rem !important; /* Daha küçük radius */
    }
    
    .wizard-group-header[b-wuh4en1aet] {
        margin-bottom: 0.5rem !important; /* Daha az margin */
        padding-bottom: 0.3rem !important; /* Daha az padding */
    }
    
    .wizard-group-name[b-wuh4en1aet] {
        font-size: 1rem !important; /* Daha küçük grup ismi */
    }
    
    .wizard-required-text[b-wuh4en1aet],
    .wizard-step-indicator[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük yardımcı yazılar */
    }
    
    /* Options Grid - Daha kompakt */
    .wizard-options-grid[b-wuh4en1aet] {
        grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)) !important; /* Daha dar minimum genişlik */
        gap: 0.3rem !important; /* Daha az gap */
        padding: 0.3rem !important; /* Daha az padding */
    }
    
    .wizard-option-item[b-wuh4en1aet] {
        min-height: 40px !important; /* Daha kısa butonlar */
        padding: 0.3rem !important; /* Daha az padding */
        border-radius: 0.2rem !important; /* Daha küçük radius */
    }
    
    .wizard-option-item .wizard-option-name[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük yazı */
        margin-bottom: 0.1rem !important; /* Daha az margin */
        line-height: 1.1 !important;
    }
    
    .wizard-option-item .wizard-option-price[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük fiyat yazısı */
    }
    
    /* Summary Panel - Sağ taraf */
    .wizard-summary-panel[b-wuh4en1aet] {
        padding: 0.4rem !important; /* Daha az padding */
        border-radius: 0.2rem !important; /* Daha küçük radius */
    }
    
    .wizard-selected-options-container[b-wuh4en1aet] {
        padding-bottom: 0.4rem !important; /* Daha az padding */
    }
    
    .wizard-summary-title[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Daha küçük başlık */
        margin-bottom: 0.4rem !important; /* Daha az margin */
    }
    
    .wizard-selected-options-list[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük liste yazısı */
        line-height: 1.2 !important;
    }
    
    .wizard-selected-options-list strong[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük kalın yazı */
    }
    
    .wizard-selected-options-list ul ul[b-wuh4en1aet] {
        margin-left: 0.5rem !important; /* Daha az girinti */
        font-size: 0.65rem !important; /* Daha küçük alt liste */
    }
    
    /* Quantity Section */
    .wizard-quantity-section[b-wuh4en1aet] {
        padding: 0.4rem 0 0 0 !important; /* Daha az padding */
    }
    
    .wizard-quantity-controls[b-wuh4en1aet] {
        gap: 0.4rem !important; /* Daha az gap */
        margin-bottom: 0.4rem !important; /* Daha az margin */
    }
    
    .wizard-quantity-button[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük buton yazısı */
        padding: 0.3rem 0.5rem !important; /* Daha az padding */
        min-width: 35px !important; /* Daha dar butonlar */
        height: 32px !important; /* Daha kısa butonlar */
    }
    
    .wizard-quantity-value[b-wuh4en1aet] {
        font-size: 1rem !important; /* Quantity değeri */
        min-width: 40px !important; /* Daha dar alan */
        padding: 0.2rem 0.4rem !important; /* Daha az padding */
    }
    
    .wizard-error-message[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Daha küçük hata mesajı */
        padding: 0.3rem !important; /* Daha az padding */
        margin-top: 0.3rem !important; /* Daha az margin */
    }
    
    /* Modal Footer - Kompakt */
    .wizard-modal-footer[b-wuh4en1aet] {
        padding: 0.4rem 0.8rem !important; /* Daha az padding */
        gap: 0.4rem !important; /* Daha az gap */
        min-height: 50px !important; /* Daha kısa footer */
        height: 50px !important; /* Sabit yükseklik */
    }
    
    .wizard-nav-button[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük buton yazısı */
        padding: 0.4rem 0.8rem !important; /* Daha az padding */
        min-width: 80px !important; /* Daha dar minimum genişlik */
        height: 38px !important; /* Daha kısa butonlar */
    }
    
    .wizard-nav-button i[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük ikonlar */
    }
    
    /* Progress Bar - Eğer varsa */
    .wizard-progress-bar[b-wuh4en1aet] {
        margin-bottom: 0.4rem !important; /* Daha az margin */
    }
    
    .wizard-progress-step[b-wuh4en1aet] {
        margin: 0 0.2rem !important; /* Daha az margin */
    }
    
    .wizard-step-marker[b-wuh4en1aet] {
        width: 24px !important; /* Daha küçük marker */
        height: 24px !important;
        font-size: 0.7rem !important; /* Daha küçük numara */
    }
    
    .wizard-step-label[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük label */
        margin-top: 0.2rem !important; /* Daha az margin */
    }
    
    .wizard-progress-connector[b-wuh4en1aet] {
        height: 2px !important; /* Daha ince çizgi */
        margin: 0 0.2rem !important; /* Daha az margin */
    }

    /* ======= UYARI MODALLARI 1366x768 OPTİMİZASYONU ======= */
    
    /* Modal backdrop - ortalama için */
    .modal-backdrop[b-wuh4en1aet] {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        z-index: 1055 !important;
        background-color: rgba(0, 0, 0, 0.5) !important;
    }
    
    /* Masa Dolu Uyarı Modal & Çıkış Onay Modal */
    .modal-backdrop .modal-content[b-wuh4en1aet] {
        max-width: 400px !important; /* Daha dar modal */
        padding: 1rem !important; /* Daha az padding - p-4'ten küçültüldü */
        margin: 0 !important; /* Margin'i sıfırla - flex ile ortalanacak */
        position: relative !important;
        top: auto !important; /* Top'u sıfırla */
        transform: none !important; /* Transform'u kaldır */
    }
    
    .modal-backdrop .modal-title[b-wuh4en1aet] {
        font-size: 1.1rem !important; /* Daha küçük başlık - h4'ten küçültüldü */
        margin-bottom: 0.8rem !important; /* Daha az margin - mb-3'ten küçültüldü */
        font-weight: 600 !important;
    }
    
    .modal-backdrop .modal-content p[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* Daha küçük mesaj yazısı */
        line-height: 1.3 !important; /* Kompakt satır yüksekliği */
        margin-bottom: 1rem !important; /* Daha az alt margin */
    }
    
    /* Modal butonları - daha kompakt */
    .modal-backdrop .modal-content .btn[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* Daha küçük buton yazısı */
        padding: 0.5rem 1rem !important; /* Daha az padding */
        min-width: 90px !important; /* Minimum genişlik */
        height: 38px !important; /* Sabit yükseklik */
        border-radius: 0.3rem !important; /* Daha küçük border radius */
    }
    
    .modal-backdrop .modal-content .btn i[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük ikon */
        margin-right: 0.3rem !important; /* Daha az ikon boşluğu */
    }
    
    /* Button container */
    .modal-backdrop .modal-content .d-flex.justify-content-between[b-wuh4en1aet] {
        gap: 0.8rem !important; /* Daha az gap - gap-2'den küçültüldü */
        margin-top: 1rem !important; /* Daha az üst margin - mt-3'ten küçültüldü */
    }
    
    /* Primary, Secondary, Danger buton stilleri */
    .modal-backdrop .modal-content .btn-primary[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-secondary[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-danger[b-wuh4en1aet] {
        flex: 1 !important; /* Butonları eşit genişlikte yap */
        white-space: nowrap !important; /* Yazıların alt satıra geçmesini engelle */
    }
    
    /* Özel buton renk ayarları korunacak - sadece boyut optimizasyonu */
    .modal-backdrop .modal-content .btn-primary[b-wuh4en1aet] {
        font-weight: 500 !important;
    }
    
    .modal-backdrop .modal-content .btn-danger[b-wuh4en1aet] {
        font-weight: 500 !important;
    }
    
    .modal-backdrop .modal-content .btn-secondary[b-wuh4en1aet] {
        font-weight: 500 !important;
    }

    /* ======= KİŞİ SAYISI MODAL 1366x768 OPTİMİZASYONU ======= */
    
    /* Kişi sayısı modalı için özel stil - inline style override */
    .modal-backdrop .modal-content[style*="max-width: 400px"][b-wuh4en1aet] {
        max-width: 380px !important; /* Biraz daha dar */
        padding: 0.8rem !important; /* p-4'ten daha az padding */
    }
    
    /* Modal başlık - kişi sayısı */
    .modal-backdrop .modal-content h4.modal-title.mb-4[b-wuh4en1aet] {
        font-size: 1rem !important; /* h4'ten daha küçük */
        margin-bottom: 0.8rem !important; /* mb-4'ten daha az */
        line-height: 1.3 !important;
    }
    
    /* Masa bilgisi başlığı */
    .modal-backdrop .modal-content h5.mb-3[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* h5'ten daha küçük */
        margin-bottom: 0.6rem !important; /* mb-3'ten daha az */
        font-weight: 600 !important;
    }
    
    /* Ana container */
    .modal-backdrop .modal-content .mb-4[b-wuh4en1aet] {
        margin-bottom: 0.8rem !important; /* mb-4'ten daha az */
    }
    
    /* Plus/Minus buton container */
    .modal-backdrop .modal-content .d-flex.align-items-center.justify-content-center.mb-4[b-wuh4en1aet] {
        margin-bottom: 0.8rem !important; /* mb-4'ten daha az */
        gap: 0.5rem !important; /* Butonlar arası daha az boşluk */
    }
    
    /* Plus/Minus butonları */
    .modal-backdrop .modal-content .btn-outline-danger.btn-lg[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-outline-success.btn-lg[b-wuh4en1aet] {
        padding: 0.4rem 0.6rem !important; /* Daha kompakt padding */
        width: 50px !important; /* Sabit genişlik */
        height: 50px !important; /* Sabit yükseklik */
        border-radius: 0 !important; /* Ürün düzenleme modalı uyumu: dikdörtgen */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* Plus/Minus buton ikonları */
    .modal-backdrop .modal-content .btn-outline-danger.btn-lg i[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-outline-success.btn-lg i[b-wuh4en1aet] {
        font-size: 1.2rem !important; /* fs-1'den çok daha küçük */
        margin: 0 !important;
    }
    
    /* Number input */
    .modal-backdrop .modal-content input[type="number"].form-control.text-center[b-wuh4en1aet] {
        width: 100px !important; /* 150px'den daha dar */
        font-size: 1.2rem !important; /* 1.5rem'den daha küçük */
        height: 45px !important; /* Sabit yükseklik */
        padding: 0.3rem !important; /* Daha az padding */
        border-radius: 0.3rem !important;
        border-width: 2px !important;
    }
    
    /* Alt buton container */
    .modal-backdrop .modal-content .d-flex.justify-content-between.gap-2.mt-4[b-wuh4en1aet] {
        gap: 0.5rem !important; /* gap-2'den daha az */
        margin-top: 0.8rem !important; /* mt-4'ten daha az */
    }
    
    /* Alt butonlar - İptal & Kaydet */
    .modal-backdrop .modal-content .btn-secondary.btn-lg.flex-grow-1[b-wuh4en1aet],
    .modal-backdrop .modal-content .btn-success.btn-lg.flex-grow-1[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* btn-lg'den daha küçük */
        padding: 0.5rem 0.8rem !important; /* Daha kompakt padding */
        height: 42px !important; /* Sabit yükseklik */
        line-height: 1.2 !important;
        border-radius: 0.3rem !important;
    }
    
    /* Kaydet butonundaki ikon */
    .modal-backdrop .modal-content .btn-success.btn-lg.flex-grow-1 i[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük ikon */
        margin-right: 0.3rem !important; /* me-2'den daha az */
    }
    
    /* Özel white-space ve line-height override */
    .modal-backdrop .modal-content .btn-success.btn-lg[style*="white-space: normal"][b-wuh4en1aet] {
        white-space: nowrap !important; /* Normal yerine nowrap - daha kompakt */
        line-height: 1.2 !important;
        text-align: center !important;
    }

    /* ======= ÜRÜN İŞLEMLERİ MODAL 1366x768 OPTİMİZASYONU ======= */
    
    /* Ürün işlemleri modalı için özel backdrop */
    .modal-backdrop[style*="z-index: 1050"][b-wuh4en1aet] {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
    }
    
    /* Ana modal container */
    .modal-backdrop[style*="z-index: 1050"] .d-flex.justify-content-center.align-items-center.h-100[b-wuh4en1aet] {
        width: 100% !important;
        height: 100% !important;
        padding: 10px !important; /* Kenar boşluğu */
    }
    
    /* Modal content - OPTİMAL BOYUT */
    .modal-backdrop[style*="z-index: 1050"] .bg-white.rounded.shadow-lg.p-4[b-wuh4en1aet] {
        width: 95% !important;
        max-width: 600px !important; /* Biraz büyütüldü - yan yana butonlar için */
        max-height: 80vh !important; /* Biraz büyütüldü */
        padding: 0.8rem !important; /* Biraz artırıldı */
        overflow-y: auto !important;
        border-radius: 0.4rem !important;
    }
    
    /* Modal başlığı */
    .modal-backdrop[style*="z-index: 1050"] .modal-title.mb-3[b-wuh4en1aet] {
        font-size: 1.1rem !important; /* h4'ten daha küçük */
        margin-bottom: 0.8rem !important; /* mb-3'ten daha az */
        font-weight: 600 !important;
    }
    
    /* Ürün adı */
    .modal-backdrop[style*="z-index: 1050"] .mb-4.text-center.fs-5[b-wuh4en1aet] {
        font-size: 1rem !important; /* fs-5'ten daha küçük */
        margin-bottom: 1rem !important; /* mb-4'ten daha az */
        font-weight: 600 !important; /* fw-semibold'den biraz daha kalın */
    }
    
    /* Container padding - MİNİMAL */
    .modal-backdrop[style*="z-index: 1050"] .container-fluid.px-2[b-wuh4en1aet] {
        padding-left: 0.2rem !important; /* Minimal padding */
        padding-right: 0.2rem !important;
    }
    
    /* Row yapısı - FLEXBOX İLE YAN YANA */
    .modal-backdrop[style*="z-index: 1050"] .row.g-3.mb-3[b-wuh4en1aet] {
        display: flex !important; /* Flexbox layout */
        flex-wrap: nowrap !important; /* Yan yana kalsin */
        gap: 0.4rem !important; /* Butonlar arası boşluk */
        margin-bottom: 0.3rem !important; /* Satırlar arası boşluk - daha az spacing */
        --bs-gutter-x: 0 !important; /* Bootstrap gutter'ı kapat */
    }
    
    .modal-backdrop[style*="z-index: 1050"] .row:last-child[b-wuh4en1aet] {
        margin-bottom: 0 !important;
        justify-content: center !important; /* Vazgeç butonunu ortala */
    }
    
    /* Tüm butonlar için genel stil - KÜÇÜK AMA OKUNUR */
    .modal-backdrop[style*="z-index: 1050"] .btn.btn-lg[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* Biraz daha büyük - okunabilir */
        padding: 0.4rem 0.3rem !important; /* Biraz daha rahat padding */
        height: 40px !important; /* Biraz daha yüksek - dokunmatik dostu */
        line-height: 1.2 !important; /* Daha rahat satır yüksekliği */
        border-radius: 0.3rem !important;
        font-weight: 500 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important; /* Yazıların alt satıra geçmesini engelle */
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important; /* Tam genişlik */
    }
    
    /* Buton ikonları - OKUNUR BOYUT */
    .modal-backdrop[style*="z-index: 1050"] .btn.btn-lg i[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Biraz daha büyük ikon */
        margin-right: 0.25rem !important; /* Biraz daha fazla margin */
    }
    
    /* Sütun yapısı - FLEX İLE EŞİT GENİŞLİK */
    .modal-backdrop[style*="z-index: 1050"] .col-6[b-wuh4en1aet] {
        flex: 1 !important; /* Eşit genişlik */
        max-width: none !important; /* Bootstrap max-width kısıtlamasını kaldır */
        padding: 0 !important; /* Padding'i kaldır - gap ile hallederiz */
    }
    
    .modal-backdrop[style*="z-index: 1050"] .col-12[b-wuh4en1aet] {
        flex: 1 !important; /* Tek buton için */
        max-width: 60% !important; /* Vazgeç butonu daha dar olsun */
        padding: 0 !important;
    }
    
    /* Özel buton renkleri korunacak */
    .modal-backdrop[style*="z-index: 1050"] .btn-danger[b-wuh4en1aet] {
        background-color: #dc3545 !important;
        border-color: #dc3545 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .btn-success[b-wuh4en1aet] {
        background-color: #198754 !important;
        border-color: #198754 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .btn-info[b-wuh4en1aet] {
        background-color: #0dcaf0 !important;
        border-color: #0dcaf0 !important;
    }
    
    .modal-backdrop[style*="z-index: 1050"] .btn-warning[b-wuh4en1aet] {
        background-color: #ffc107 !important;
        border-color: #ffc107 !important;
        color: #000 !important; /* Sarı arka planda siyah yazı */
    }
    
    .modal-backdrop[style*="z-index: 1050"] .btn-secondary[b-wuh4en1aet] {
        background-color: #6c757d !important;
        border-color: #6c757d !important;
    }
    
    /* btn-waste sınıfı için */
    .modal-backdrop[style*="z-index: 1050"] .btn-waste[b-wuh4en1aet] {
        background-color: #fd7e14 !important; /* Orange renk */
        border-color: #fd7e14 !important;
        color: #fff !important;
    }
    
    /* Hover efektleri */
    .modal-backdrop[style*="z-index: 1050"] .btn:hover[b-wuh4en1aet] {
        opacity: 0.9 !important;
        transform: translateY(-1px) !important;
        transition: all 0.2s ease !important;
    }

    /* ======= MASA TAŞIMA MODAL 1366x768 OPTİMİZASYONU ======= */
    
    /* Fullscreen modal backdrop */
    .fullscreen-modal-backdrop[b-wuh4en1aet] {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        z-index: 1055 !important;
        background-color: rgba(0, 0, 0, 0.6) !important;
    }
    
    /* Modal content container */
    .fullscreen-modal-content[b-wuh4en1aet] {
        background: white !important;
        border-radius: 0.5rem !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
        width: 95% !important;
        max-width: 500px !important; /* Daha dar modal */
        max-height: 85vh !important; /* Ekrana sığması için */
        padding: 1.5rem !important; /* Rahat padding */
        position: relative !important;
        overflow-y: auto !important;
    }
    
    /* Close button */
    .fullscreen-modal-content .btn-close.position-absolute[b-wuh4en1aet] {
        top: 1rem !important; /* m-3'ten daha az */
        right: 1rem !important; /* m-3'ten daha az */
        font-size: 1rem !important; /* Daha küçük close button */
        z-index: 10 !important;
    }
    
    /* Modal title */
    .fullscreen-modal-content .modal-title.fs-big[b-wuh4en1aet] {
        font-size: 1.3rem !important; /* fs-big'den daha küçük */
        margin-bottom: 1.5rem !important; /* mb-4'ten daha az */
        font-weight: 600 !important; /* fw-bold'den daha ince */
        line-height: 1.3 !important;
    }
    
    /* Button container */
    .fullscreen-modal-content .d-flex.flex-column.gap-3[b-wuh4en1aet] {
        gap: 1rem !important; /* gap-3'ten daha az */
        margin-bottom: 1.5rem !important;
    }
    
    /* Ana action butonları */
    .fullscreen-modal-content .btn.btn-lg.py-4[style*="max-width: 500px"][b-wuh4en1aet] {
        max-width: 100% !important; /* Tam genişlik */
        padding: 1rem !important; /* py-4 px-4'ten daha az */
        border-radius: 0.4rem !important;
        min-height: 70px !important; /* Sabit minimum yükseklik */
        transition: all 0.2s ease !important;
    }
    
    /* Buton ana yazıları */
    .fullscreen-modal-content .btn .fs-4[b-wuh4en1aet] {
        font-size: 1rem !important; /* fs-4'ten daha küçük */
        font-weight: 600 !important;
        line-height: 1.2 !important;
        margin-bottom: 0.3rem !important;
    }
    
    /* Buton açıklama yazıları */
    .fullscreen-modal-content .btn .fs-6.mt-2[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* fs-6'dan daha küçük */
        line-height: 1.2 !important;
        margin-top: 0.3rem !important; /* mt-2'den daha az */
        opacity: 0.9 !important;
    }
    
    /* Buton ikonları */
    .fullscreen-modal-content .btn i.bi[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* me-2 ile daha küçük ikon */
        margin-right: 0.3rem !important; /* me-2'den daha az */
    }
    
    /* Alt kapat butonu container */
    .fullscreen-modal-content .d-flex.justify-content-center.mt-4[b-wuh4en1aet] {
        margin-top: 1.5rem !important; /* mt-4'ten daha az */
    }
    
    /* Kapat butonu */
    .fullscreen-modal-content .btn-secondary.btn-lg.fs-5[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* fs-5'ten daha küçük */
        padding: 0.7rem 1.5rem !important; /* py-3 px-4'ten daha kompakt */
        border-radius: 0.3rem !important;
        font-weight: 500 !important;
    }
    
    /* Kapat butonu ikonu */
    .fullscreen-modal-content .btn-secondary i.bi[b-wuh4en1aet] {
        font-size: 0.8rem !important;
        margin-right: 0.3rem !important;
    }
    
    /* Hover efektleri */
    .fullscreen-modal-content .btn:hover[b-wuh4en1aet] {
        transform: translateY(-2px) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
        transition: all 0.2s ease !important;
    }
    
    /* Text wrapping optimization */
    .fullscreen-modal-content .text-wrap[b-wuh4en1aet] {
        word-wrap: break-word !important;
        hyphens: auto !important;
        text-align: center !important;
    }

    /* ======= ÜRÜN SEÇME MODAL 1366x768 OPTİMİZASYONU ======= */
    
    /* Ürün seçme modalı için özel stil - inline style ile tanımlanan modal */
    .modal-backdrop .modal-content[style*="width: 900px"][b-wuh4en1aet] {
        width: 95% !important; /* Responsive genişlik */
        max-width: 750px !important; /* 900px'den daha dar */
        max-height: 80vh !important; /* 85vh'den daha kısa */
        padding: 1rem !important; /* p-4'ten daha az */
    }
    
    /* Modal başlığı */
    .modal-backdrop .modal-content h4.modal-title.mb-3[b-wuh4en1aet] {
        font-size: 1.1rem !important; /* h4'ten daha küçük */
        margin-bottom: 0.8rem !important; /* mb-3'ten daha az */
        font-weight: 600 !important;
    }
    
    /* Alt açıklama yazısı */
    .modal-backdrop .modal-content .text-muted.mb-4[b-wuh4en1aet] {
        font-size: 0.85rem !important; /* Daha küçük */
        margin-bottom: 1rem !important; /* mb-4'ten daha az */
        line-height: 1.3 !important;
    }
    
    /* Table container */
    .modal-backdrop .modal-content .table-responsive[b-wuh4en1aet] {
        max-height: calc(80vh - 200px) !important; /* Daha kompakt yükseklik */
        border: 1px solid #dee2e6 !important;
        border-radius: 0.3rem !important;
    }
    
    /* Table genel stilleri */
    .modal-backdrop .modal-content .table.table-hover.table-sm[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* table-sm'den daha küçük */
        margin-bottom: 0 !important;
    }
    
    /* Table header */
    .modal-backdrop .modal-content .table thead.table-light th[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük header */
        padding: 0.4rem 0.3rem !important; /* Daha kompakt padding */
        font-weight: 600 !important;
        border-bottom: 2px solid #dee2e6 !important;
        background-color: #f8f9fa !important;
        white-space: nowrap !important;
    }
    
    /* Table body cells */
    .modal-backdrop .modal-content .table tbody td[b-wuh4en1aet] {
        padding: 0.4rem 0.3rem !important; /* Daha kompakt padding */
        vertical-align: middle !important;
        font-size: 0.75rem !important; /* Daha küçük yazı */
        line-height: 1.2 !important;
    }
    
    /* Ürün adı sütunu */
    .modal-backdrop .modal-content .table tbody td:first-child[b-wuh4en1aet] {
        min-width: 150px !important; /* Minimum genişlik */
        max-width: 200px !important; /* Maksimum genişlik */
    }
    
    /* Small text in table */
    .modal-backdrop .modal-content .table small[b-wuh4en1aet] {
        font-size: 0.65rem !important; /* Daha küçük small text */
        line-height: 1.1 !important;
        margin-top: 0.1rem !important;
    }
    
    /* Input group in table */
    .modal-backdrop .modal-content .input-group[b-wuh4en1aet] {
        min-width: 120px !important; /* 130px'den daha dar */
    }
    
    .modal-backdrop .modal-content .input-group .btn[b-wuh4en1aet] {
        padding: 0.2rem 0.4rem !important; /* Daha kompakt butonlar */
        font-size: 0.7rem !important; /* Daha küçük buton yazısı */
        border-radius: 0.2rem !important;
    }
    
    .modal-backdrop .modal-content .input-group .form-control[b-wuh4en1aet] {
        width: 35px !important; /* 40px'den daha dar */
        font-size: 0.75rem !important; /* Daha küçük input yazısı */
        padding: 0.2rem 0.1rem !important; /* Daha kompakt padding */
        text-align: center !important;
    }
    
    /* Sticky header */
    .modal-backdrop .modal-content .sticky-top[b-wuh4en1aet] {
        position: sticky !important;
        top: 0 !important;
        z-index: 10 !important;
    }
    
    /* Selected row styling */
    .modal-backdrop .modal-content .table-info[b-wuh4en1aet] {
        background-color: rgba(13, 202, 240, 0.15) !important;
        border-left: 3px solid #0dcaf0 !important;
    }
    
    /* Bottom section */
    .modal-backdrop .modal-content .row.align-items-center.mt-3.pt-3.border-top[b-wuh4en1aet] {
        margin-top: 1rem !important; /* mt-3'ten daha az */
        padding-top: 1rem !important; /* pt-3'ten daha az */
        border-top: 2px solid #dee2e6 !important;
    }
    
    /* Badge'ler */
    .modal-backdrop .modal-content .badge.fs-6[b-wuh4en1aet] {
        font-size: 0.7rem !important; /* fs-6'dan daha küçük */
        padding: 0.3rem 0.5rem !important; /* Daha kompakt badge */
        margin-right: 0.3rem !important; /* me-2'den daha az */
    }
    
    /* Toplam yazısı */
    .modal-backdrop .modal-content .fw-bold.fs-5[b-wuh4en1aet] {
        font-size: 0.9rem !important; /* fs-5'ten daha küçük */
        font-weight: 600 !important; /* fw-bold'den daha ince */
    }
    
    /* Alt butonlar */
    .modal-backdrop .modal-content .btn.btn-lg.w-100[b-wuh4en1aet] {
        font-size: 0.8rem !important; /* btn-lg'den daha küçük */
        padding: 0.6rem 0.8rem !important; /* Daha kompakt padding */
        height: 42px !important; /* Sabit yükseklik */
        border-radius: 0.3rem !important;
        font-weight: 500 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* Buton ikonları */
    .modal-backdrop .modal-content .btn i.bi.me-3[b-wuh4en1aet] {
        font-size: 0.75rem !important; /* Daha küçük ikon */
        margin-right: 0.4rem !important; /* me-3'ten daha az */
    }
    
    /* Button group gap */
    .modal-backdrop .modal-content .row.g-2[b-wuh4en1aet] {
        --bs-gutter-x: 0.3rem !important; /* g-2'den daha az */
    }
    
    /* Responsive adjustments */
    @media (max-width: 768px) {
        .modal-backdrop .modal-content[style*="width: 900px"][b-wuh4en1aet] {
            max-width: 95% !important;
            padding: 0.8rem !important;
        }
        
        .modal-backdrop .modal-content .table-responsive[b-wuh4en1aet] {
            max-height: calc(80vh - 180px) !important;
        }
        
        .modal-backdrop .modal-content .table thead th[b-wuh4en1aet],
        .modal-backdrop .modal-content .table tbody td[b-wuh4en1aet] {
            padding: 0.3rem 0.2rem !important;
            font-size: 0.7rem !important;
        }
    }
}

/* === MASA SEÇME MODAL RESPONSIVE STYLES === */
/* Default styles for table selection modal */
.modal-table-card[b-wuh4en1aet] {
    transition: all 0.2s ease-in-out;
    border-radius: 8px;
    width: 150px;
    min-height: 130px;
    padding: 8px;
    margin: 4px;
    flex-shrink: 0; /* Prevent shrinking */
}

.modal-table-card:hover[b-wuh4en1aet] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
}

/* Modal container responsive fixes */
.modal-backdrop .container-fluid[b-wuh4en1aet] {
    max-width: 100% !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
}

.modal-backdrop .row[b-wuh4en1aet] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: center !important;
}

.modal-backdrop .col-auto[b-wuh4en1aet] {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
    flex: 0 0 auto !important;
}

/* Large screens (1366px and above) */
@media (min-width: 1367px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 150px !important;
        min-height: 130px !important;
        padding: 8px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.9rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.75rem !important;
    }
}

/* Medium-large screens (1024px - 1366px) - General 1366 width optimization */
@media (max-width: 1366px) and (min-width: 1025px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 120px !important;
        min-height: 100px !important;
        padding: 5px !important;
        margin: 3px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.75rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.6rem !important;
    }
    
    /* Container adjustments for 1366 width */
    .modal-backdrop .container-fluid[b-wuh4en1aet] {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
    
    .modal-backdrop .col-auto[b-wuh4en1aet] {
        padding-left: 0.2rem !important;
        padding-right: 0.2rem !important;
    }
}

/* Small laptops and tablets (768px - 1024px) */
@media (max-width: 1024px) and (min-width: 769px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 130px !important;
        min-height: 110px !important;
        padding: 6px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.8rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.65rem !important;
    }
}

/* Tablets (576px - 768px) */
@media (max-width: 768px) and (min-width: 577px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 120px !important;
        min-height: 100px !important;
        padding: 5px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.75rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.6rem !important;
    }
}

/* Mobile devices (below 576px) */
@media (max-width: 576px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 110px !important;
        min-height: 90px !important;
        padding: 4px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.7rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.55rem !important;
    }
}

/* Specific 1366 width optimization (all heights) */
@media (max-width: 1366px) and (min-width: 1200px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 115px !important;
        min-height: 95px !important;
        padding: 4px !important;
        margin: 2px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.7rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.58rem !important;
    }
    
    .modal-backdrop .container-fluid[b-wuh4en1aet] {
        padding-left: 0.3rem !important;
        padding-right: 0.3rem !important;
    }
    
    .modal-backdrop .col-auto[b-wuh4en1aet] {
        padding-left: 0.15rem !important;
        padding-right: 0.15rem !important;
    }
}

/* Specific 1366x768 resolution optimization */
@media (max-width: 1366px) and (max-height: 768px) {
    .modal-backdrop .modal-content h2.modal-title[b-wuh4en1aet] {
        font-size: 1.5rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    .modal-backdrop .modal-content p.text-muted[b-wuh4en1aet] {
        font-size: 0.9rem !important;
        margin-bottom: 1rem !important;
    }
    
    .modal-backdrop .modal-content .btn-md[b-wuh4en1aet] {
        font-size: 0.75rem !important;
        padding: 0.3rem 0.6rem !important;
        max-width: 120px !important;
    }
    
    .modal-table-card[b-wuh4en1aet] {
        width: 110px !important;
        min-height: 90px !important;
        padding: 4px !important;
        margin: 2px !important;
        border-radius: 6px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.65rem !important;
        margin-bottom: 0.2rem !important;
        margin-top: 0.2rem !important;
    }
    
    .modal-table-card hr[b-wuh4en1aet] {
        margin: 2px 0 !important;
        height: 1px !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.55rem !important;
        line-height: 1.2 !important;
    }
    
    .modal-table-card .badge[b-wuh4en1aet] {
        font-size: 0.5rem !important;
        padding: 0.15rem 0.3rem !important;
    }
    
    .modal-backdrop .modal-content > div:last-child[b-wuh4en1aet] {
        margin-top: 1rem !important;
    }
    
    .modal-backdrop .modal-content .btn-secondary.btn-lg[b-wuh4en1aet] {
        font-size: 0.9rem !important;
        padding: 0.5rem 1.2rem !important;
    }
    
    /* Container adjustments for 1366x768 */
    .modal-backdrop .container-fluid[b-wuh4en1aet] {
        padding-left: 0.25rem !important;
        padding-right: 0.25rem !important;
        max-width: 100% !important;
    }
    
    .modal-backdrop .col-auto[b-wuh4en1aet] {
        padding-left: 0.1rem !important;
        padding-right: 0.1rem !important;
    }
    
    /* Modal content specific adjustments */
    .modal-backdrop .modal-content[b-wuh4en1aet] {
        padding: 1rem !important;
    }
    
    /* Row spacing optimization */
    .modal-backdrop .row.g-2[b-wuh4en1aet] {
        gap: 0.25rem !important;
    }
    
    /* Specific height constraint for table cards area */
    .modal-backdrop .row[style*="max-height"][b-wuh4en1aet] {
        max-height: calc(100vh - 200px) !important;
    }
}

/* Ultra-wide screens optimization */
@media (min-width: 1920px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 170px !important;
        min-height: 150px !important;
        padding: 10px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 1rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.8rem !important;
    }
    
    .table-selection-container[b-wuh4en1aet] {
        max-width: 1200px !important;
        margin: 0 auto !important;
    }
    
    .table-selection-container .d-flex[b-wuh4en1aet] {
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 0.75rem !important;
    }
}

/* Table Selection Container - Centered with max width */
.table-selection-container[b-wuh4en1aet] {
    padding: 0.5rem;
    border-radius: 8px;
}

.table-selection-container .d-flex[b-wuh4en1aet] {
    max-width: 100%;
    justify-content: center;
}

/* Ensure cards don't overflow */
.modal-backdrop .table-selection-container[b-wuh4en1aet] {
    max-width: 900px !important;
}

/* Modal footer butonunu her çözünürlükte ortalanmış tut */
.modal-backdrop .modal-content > div:last-child[b-wuh4en1aet] {
    display: flex !important;
    justify-content: center !important;
    margin-top: 1rem !important;
}

.modal-backdrop .modal-content .btn-secondary.btn-lg[b-wuh4en1aet] {
    margin: 0 auto !important;
}

/* Specific 1366x768 optimization for table selection */
@media (max-width: 1366px) and (max-height: 768px) {
    .table-selection-container[b-wuh4en1aet] {
        max-width: 800px !important;
        padding: 0.25rem !important;
    }
    
    .table-selection-container .d-flex[b-wuh4en1aet] {
        gap: 0.25rem !important;
    }
}

/* Responsive column count adjustments */
@media (max-width: 480px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 100px !important;
        min-height: 85px !important;
        padding: 3px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.65rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.5rem !important;
    }
    
    .table-selection-container[b-wuh4en1aet] {
        max-width: 100% !important;
        padding: 0.15rem !important;
    }
}

/* Modal table card - Grid layout like main table list */
.modal-table-card[b-wuh4en1aet] {
    width: 120px !important;
    min-height: 140px !important;
    padding: 8px !important;
    margin: 4px !important;
    border-radius: 8px !important;
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
    flex-shrink: 0; /* Prevent shrinking */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.modal-table-card:hover[b-wuh4en1aet] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
}

/* Masa seçim container - Horizontal scroll optimized */
.modal-backdrop .container-fluid[b-wuh4en1aet] {
    padding: 0 !important;
    margin: 0 !important;
}

.modal-backdrop .row[b-wuh4en1aet] {
    margin: 0 !important;
    width: 100% !important;
}

.modal-backdrop .col-auto[b-wuh4en1aet] {
    padding: 0 2px !important;
}

/* Table selection container - Grid layout like main table list */
.table-selection-container[b-wuh4en1aet] {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 1rem !important;
    padding-right: 60px !important; /* X butonu için sağ boşluk */
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: calc(100vh - 200px) !important;
}

/* 1366x768 için özel container düzeltmesi - Grid layout with vertical scroll */
@media (max-width: 1366px) and (max-height: 768px) {
    .table-selection-container[b-wuh4en1aet] {
        width: 100% !important;
        max-width: calc(100vw - 220px) !important; /* Sol menü için alan düşüldü */
        padding: 0.25rem !important; /* Minimal padding */
        padding-right: 50px !important; /* X butonu için sağ boşluk */
        margin: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important; /* Dikey scroll */
        max-height: calc(100vh - 180px) !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .table-selection-container .d-flex[b-wuh4en1aet] {
        flex-wrap: wrap !important; /* Grid layout için wrap */
        justify-content: flex-start !important;
        width: 100% !important;
        gap: 0.25rem !important; /* Grid için uygun gap */
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .modal-table-card[b-wuh4en1aet] {
        width: 85px !important; /* Grid layout için optimal */
        min-height: 100px !important;
        padding: 4px !important;
        margin: 0 !important;
        border-radius: 6px !important;
        flex-shrink: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.65rem !important;
        margin-bottom: 0.1rem !important;
        margin-top: 0.1rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.55rem !important;
        line-height: 1.2 !important;
    }
    
    .modal-table-card .badge[b-wuh4en1aet] {
        font-size: 0.5rem !important;
        padding: 0.1rem 0.2rem !important;
    }
}

.table-selection-container .d-flex[b-wuh4en1aet] {
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0.75rem !important;
    width: 100% !important;
    padding: 0 !important;
}

/* Scroll bar styling - vertical scroll for grid */
.table-selection-container[b-wuh4en1aet]::-webkit-scrollbar {
    width: 8px !important;
    background-color: #f1f1f1;
}

.table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
    border: 1px solid #f1f1f1;
}

.table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* X Butonu Styling */
.modal-backdrop .modal-content .btn-close[b-wuh4en1aet] {
    background-color: rgba(255, 255, 255, 0.95) !important;
    border: 2px solid #6c757d !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    font-size: 1.2rem !important;
    opacity: 1 !important;
    transition: all 0.2s ease-in-out !important;
    backdrop-filter: blur(5px) !important;
    z-index: 9999 !important;
    position: absolute !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2) !important;
}

.modal-backdrop .modal-content .btn-close:hover[b-wuh4en1aet] {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    opacity: 1 !important;
    transform: scale(1.1) !important;
}

/* Responsive optimizations for different screen sizes */
@media (min-width: 1367px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 140px !important;
        min-height: 160px !important;
        padding: 10px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.9rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.75rem !important;
    }
    
         .table-selection-container[b-wuh4en1aet] {
         padding-right: 60px !important; /* X butonu için sağ boşluk */
     }
     
     .table-selection-container .d-flex[b-wuh4en1aet] {
         gap: 1rem !important;
     }
}

@media (max-width: 1366px) and (min-width: 1025px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 115px !important;
        min-height: 135px !important;
        padding: 6px !important;
        margin: 3px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.8rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.7rem !important;
    }
    
         .table-selection-container[b-wuh4en1aet] {
         padding-right: 55px !important; /* X butonu için sağ boşluk */
     }
     
     .table-selection-container .d-flex[b-wuh4en1aet] {
         gap: 0.6rem !important;
     }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 80px !important;
        min-height: 95px !important;
        padding: 4px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.65rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.55rem !important;
    }
}

@media (max-width: 768px) and (min-width: 577px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 75px !important;
        min-height: 90px !important;
        padding: 3px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.6rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.5rem !important;
    }
}

/* Mobile devices (below 576px) */
@media (max-width: 576px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 70px !important;
        min-height: 85px !important;
        padding: 3px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.55rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.45rem !important;
    }
    
         .table-selection-container[b-wuh4en1aet] {
         padding-right: 45px !important; /* X butonu için sağ boşluk (mobil) */
     }
     
     .table-selection-container .d-flex[b-wuh4en1aet] {
         gap: 3px !important;
         padding: 0 !important;
     }
}

@media (max-width: 1366px) and (min-width: 1200px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 85px !important;
        min-height: 100px !important;
        padding: 4px !important;
        margin: 2px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.7rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.58rem !important;
    }
}

/* Specific 1366x768 resolution optimization */
@media (max-width: 1366px) and (max-height: 768px) {
    .modal-backdrop .modal-content h2.modal-title[b-wuh4en1aet] {
        font-size: 1.3rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    .modal-backdrop .modal-content p.text-muted[b-wuh4en1aet] {
        font-size: 0.8rem !important;
        margin-bottom: 0.5rem !important;
    }
    
         .modal-backdrop .modal-content[b-wuh4en1aet] {
         padding: 0.5rem 0.5rem 0.5rem 0 !important; /* Sol padding kaldırıldı */
         margin: 0 !important;
     }
     
     .modal-backdrop .modal-content .btn-md[b-wuh4en1aet] {
         font-size: 0.7rem !important;
         padding: 0.25rem 0.5rem !important;
         max-width: 120px !important;
     }
    
    .modal-table-card[b-wuh4en1aet] {
        width: 75px !important;
        min-height: 85px !important;
        padding: 3px !important;
        margin: 1px !important;
        border-radius: 4px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.6rem !important;
        margin-bottom: 0.1rem !important;
        margin-top: 0.1rem !important;
    }
    
    .modal-table-card hr[b-wuh4en1aet] {
        margin: 1px 0 !important;
        height: 1px !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.5rem !important;
        line-height: 1.1 !important;
    }
    
    .modal-table-card .badge[b-wuh4en1aet] {
        font-size: 0.45rem !important;
        padding: 0.1rem 0.2rem !important;
    }
    
         
    
         /* X Butonu kompakt */
     .modal-backdrop .modal-content .btn-close[b-wuh4en1aet] {
         width: 35px !important;
         height: 35px !important;
         font-size: 1rem !important;
         top: 10px !important;
         right: 10px !important;
         z-index: 9999 !important;
         position: fixed !important;
         background-color: rgba(255, 255, 255, 0.95) !important;
         border: 2px solid #dc3545 !important;
         box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
     }
     
     /* Vertical scroll bar styling for 1366x768 */
     .table-selection-container[b-wuh4en1aet]::-webkit-scrollbar {
         width: 8px !important;
         background-color: #f8f9fa !important;
         border-radius: 4px !important;
     }
     
     .table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-track {
         background: #e9ecef !important;
         border-radius: 4px !important;
         margin: 10px 0 !important;
     }
     
     .table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-thumb {
         background: #6c757d !important;
         border-radius: 4px !important;
         border: 1px solid #e9ecef !important;
         min-height: 30px !important;
     }
     
     .table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-thumb:hover {
         background: #495057 !important;
     }
     
     .table-selection-container[b-wuh4en1aet]::-webkit-scrollbar-thumb:active {
         background: #343a40 !important;
     }
}

/* Ultra-wide screens optimization */
@media (min-width: 1920px) {
    .modal-table-card[b-wuh4en1aet] {
        width: 110px !important;
        min-height: 130px !important;
        padding: 8px !important;
    }
    
    .modal-table-card h5[b-wuh4en1aet] {
        font-size: 0.85rem !important;
    }
    
    .modal-table-card .w-100[b-wuh4en1aet] {
        font-size: 0.7rem !important;
    }
    
         .table-selection-container[b-wuh4en1aet] {
         max-width: 1400px !important;
         padding: 1.5rem !important;
         padding-right: 70px !important; /* X butonu için sağ boşluk (büyük ekran) */
     }
    
    .table-selection-container .d-flex[b-wuh4en1aet] {
        gap: 1.2rem !important;
    }
    
    /* Product action modal button spacing for large screens */
    .modal-backdrop[style*="z-index: 1050"] .row.g-3.mb-3[b-wuh4en1aet] {
        margin-bottom: 0.5rem !important; /* Büyük ekranlarda daha fazla spacing */
    }
}

/* Ensure cards don't overflow - Remove conflicting rules */
.modal-backdrop .table-selection-container[b-wuh4en1aet] {
    max-width: none !important;
}

/* Responsive X button for different screen sizes */
@media (max-width: 768px) {
    .modal-backdrop .modal-content .btn-close[b-wuh4en1aet] {
        width: 35px !important;
        height: 35px !important;
        font-size: 1rem !important;
        top: 10px !important;
        right: 10px !important;
    }
}

@media (min-width: 1920px) {
    .modal-backdrop .modal-content .btn-close[b-wuh4en1aet] {
        width: 45px !important;
        height: 45px !important;
        font-size: 1.4rem !important;
        top: 20px !important;
        right: 20px !important;
    }
}

/* POS Payment Modal Animations */
@keyframes fadeIn-b-wuh4en1aet {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideInUp-b-wuh4en1aet {
    from {
        transform: translateY(50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes spin-b-wuh4en1aet {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes pulse-b-wuh4en1aet {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.05);
        opacity: 0.8;
    }
}

@keyframes shimmer-b-wuh4en1aet {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

@keyframes bounce-b-wuh4en1aet {
    0%, 80%, 100% {
        transform: scale(0.8) translateY(0);
        opacity: 0.5;
    }
    40% {
        transform: scale(1.3) translateY(-15px);
        opacity: 1;
    }
    60% {
        transform: scale(1.1) translateY(-8px);
        opacity: 0.8;
    }
}

@keyframes wave-b-wuh4en1aet {
    0% {
        transform: translateY(0) scale(0.8);
        opacity: 0.4;
        background: #007bff;
    }
    25% {
        transform: translateY(-8px) scale(1.0);
        opacity: 0.7;
        background: #0056b3;
    }
    50% {
        transform: translateY(-15px) scale(1.3);
        opacity: 1;
        background: #004085;
        box-shadow: 0 0 15px rgba(0, 123, 255, 0.6);
    }
    75% {
        transform: translateY(-8px) scale(1.0);
        opacity: 0.7;
        background: #0056b3;
    }
    100% {
        transform: translateY(0) scale(0.8);
        opacity: 0.4;
        background: #007bff;
    }
}

@keyframes spinOuter-b-wuh4en1aet {
    0% {
        transform: rotate(0deg) scale(1);
        border-color: rgba(0, 123, 255, 0.15);
        box-shadow: 0 0 0 rgba(0, 123, 255, 0.3);
    }
    25% {
        transform: rotate(90deg) scale(1.02);
        border-color: rgba(0, 123, 255, 0.25);
        box-shadow: 0 0 10px rgba(0, 123, 255, 0.4);
    }
    50% {
        transform: rotate(180deg) scale(1.05);
        border-color: rgba(0, 123, 255, 0.35);
        box-shadow: 0 0 20px rgba(0, 123, 255, 0.5);
    }
    75% {
        transform: rotate(270deg) scale(1.02);
        border-color: rgba(0, 123, 255, 0.25);
        box-shadow: 0 0 10px rgba(0, 123, 255, 0.4);
    }
    100% {
        transform: rotate(360deg) scale(1);
        border-color: rgba(0, 123, 255, 0.15);
        box-shadow: 0 0 0 rgba(0, 123, 255, 0.3);
    }
}

@keyframes spinInner-b-wuh4en1aet {
    0% {
        transform: rotate(360deg) scale(1);
        border-top-color: #007bff;
        border-right-color: #007bff;
        filter: drop-shadow(0 0 5px rgba(0, 123, 255, 0.3));
    }
    25% {
        transform: rotate(270deg) scale(1.03);
        border-top-color: #0056b3;
        border-right-color: #0056b3;
        filter: drop-shadow(0 0 8px rgba(0, 123, 255, 0.5));
    }
    50% {
        transform: rotate(180deg) scale(1.05);
        border-top-color: #004085;
        border-right-color: #004085;
        filter: drop-shadow(0 0 12px rgba(0, 123, 255, 0.7));
    }
    75% {
        transform: rotate(90deg) scale(1.03);
        border-top-color: #0056b3;
        border-right-color: #0056b3;
        filter: drop-shadow(0 0 8px rgba(0, 123, 255, 0.5));
    }
    100% {
        transform: rotate(0deg) scale(1);
        border-top-color: #007bff;
        border-right-color: #007bff;
        filter: drop-shadow(0 0 5px rgba(0, 123, 255, 0.3));
    }
}

@keyframes float-b-wuh4en1aet {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-20px);
    }
}

/* POS Modal Responsive Design */
@media (max-width: 768px) {
    .pos-payment-modal-container[b-wuh4en1aet] {
        width: 95% !important;
        max-width: none !important;
    }
    
    .pos-payment-modal-content[b-wuh4en1aet] {
        border-radius: 20px !important;
    }
    
    .pos-payment-modal-content .modal-body[b-wuh4en1aet] {
        padding: 2rem 1.5rem !important;
    }
    
    .pos-payment-modal-content h3[b-wuh4en1aet] {
        font-size: 2rem !important;
    }
    
    .pos-spinner-outer[b-wuh4en1aet] {
        width: 5rem !important;
        height: 5rem !important;
    }
}

/* /Components/Pages/Sales/TakeoutSales/Getir/GetirAccountSettings.razor.rz.scp.css */
.toast-message[b-t6pd0ha05g] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    animation: fadeInOut 3s ease-in-out;
}

.toast-success[b-t6pd0ha05g] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-t6pd0ha05g] {
    background-color: #dc3545; /* Kırmızı */
}
.getir-modal-modern-overlay[b-t6pd0ha05g] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.10);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.getir-modal-modern-content[b-t6pd0ha05g] {
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 8px 32px rgba(60,60,60,0.18);
    max-width: 520px;
    width: 98vw;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.getir-modal-modern-header[b-t6pd0ha05g] {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 1.2rem 1.5rem 0.5rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f1f1f1;
}

.getir-mor-bg[b-t6pd0ha05g] {
    background: #6727ff !important;
}

.text-getir-mor[b-t6pd0ha05g] {
    color: #6727ff !important;
}

.bg-getir-mor[b-t6pd0ha05g] {
    background: #6727ff !important;
    color: #fff !important;
}

.btn-getir-mor[b-t6pd0ha05g] {
    background: #6727ff !important;
    color: #fff !important;
    border: none;
}

    .btn-getir-mor:hover[b-t6pd0ha05g], .btn-getir-mor:focus[b-t6pd0ha05g] {
        background: #4b1bb3 !important;
        color: #fff !important;
    }

.getir-modal-modern-scrollable[b-t6pd0ha05g] {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    padding: 1.2rem 1.5rem 1.2rem 1.5rem;
}

.getir-modal-modern-footer[b-t6pd0ha05g] {
    position: sticky;
    bottom: 0;
    background: #fff;
    z-index: 2;
    padding: 1rem 1.5rem 1.5rem 1.5rem;
    border-top: 1px solid #f1f1f1;
}

.getir-modern-card[b-t6pd0ha05g] {
    background: #f7faff;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(80,120,255,0.07);
    border: 1px solid #e3e6ea;
    transition: box-shadow 0.2s;
}

    .getir-modern-card:focus-within[b-t6pd0ha05g], .getir-modern-card:hover[b-t6pd0ha05g] {
        box-shadow: 0 0 0 0.2rem #ffe06644;
        border-color: #ffe066;
    }

.getir-modern-input[b-t6pd0ha05g] {
    font-size: 1.1rem;
    border-radius: 0.7rem;
    min-width: 120px;
}

.getir-modern-action-btn[b-t6pd0ha05g] {
    min-width: 120px;
    font-size: 1.1rem;
    font-weight: 500;
    border-radius: 2rem;
    box-shadow: 0 2px 8px rgba(80,120,255,0.07);
    transition: box-shadow 0.15s, background 0.15s;
    outline: none;
    padding: 0.7rem 1.2rem;
}

    .getir-modern-action-btn:active[b-t6pd0ha05g], .getir-modern-action-btn:focus[b-t6pd0ha05g] {
        box-shadow: 0 0 0 0.2rem #ffe06644;
    }

@media (max-width: 600px) {
    .getir-modal-modern-content[b-t6pd0ha05g] {
        max-width: 100vw;
        border-radius: 0.7rem;
    }

    .getir-modal-modern-header[b-t6pd0ha05g], .getir-modal-modern-footer[b-t6pd0ha05g] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .getir-modal-modern-scrollable[b-t6pd0ha05g] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .getir-modern-card[b-t6pd0ha05g] {
        padding: 1rem 0.5rem;
    }
}
/* /Components/Pages/Sales/TakeoutSales/Index.razor.rz.scp.css */
/* Toast Mesajı */
.toast-message[b-vqj3pf3x20] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    animation: fadeInOut 3s ease-in-out;
}

.toast-success[b-vqj3pf3x20] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-vqj3pf3x20] {
    background-color: #dc3545; /* Kırmızı */
}

/* Delivery Platform Header */
.delivery-platforms-header[b-vqj3pf3x20] {
    display: flex;
    justify-content: space-between;
    background-color: #f8f9fa;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.platform-item[b-vqj3pf3x20] {
    display: flex;
    align-items: center;
    padding: 12px;
    width: 18%;
    border-radius: 8px;
    transition: all 0.3s ease;
    background-color: #ffffff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.platform-item:hover[b-vqj3pf3x20] {
    background-color: #e9ecef;
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.platform-icon[b-vqj3pf3x20] {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
}

.platform-icon img[b-vqj3pf3x20] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.platform-icon i[b-vqj3pf3x20] {
    color: #007bff;
}

.platform-info[b-vqj3pf3x20] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.platform-name[b-vqj3pf3x20] {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 4px;
}

.platform-status[b-vqj3pf3x20] {
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 12px;
    font-weight: 500;
    display: inline-block;
    text-align: center;
    width: fit-content;
}

.status-open[b-vqj3pf3x20] {
    background-color: #d4edda;
    color: #155724;
}

.status-closed[b-vqj3pf3x20] {
    background-color: #f8d7da;
    color: #721c24;
}

/* Three-column Layout */
.order-columns-container[b-vqj3pf3x20] {
    display: flex;
    height: calc(100vh - 150px);
    gap: 20px;
    margin-top: 20px;
}

.order-column[b-vqj3pf3x20] {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    overflow: hidden;
}

.column-header[b-vqj3pf3x20] {
    padding: 10px;
    text-align: center;
    position: relative; /* Pozisyon için */
    display: flex;
    justify-content: center;
    align-items: center;
}

.column-header h4[b-vqj3pf3x20] {
    margin: 0;
    font-weight: 600;
    color: #000; /* Başlık yazılarını siyah yap */
}

.column-header.gelen[b-vqj3pf3x20] {
    background-color: #f8d7da;
    color: #000; /* Gelen siparişler başlık rengini siyah yap */
}

.column-header.hazirlanan[b-vqj3pf3x20] {
    background-color: #fff3cd;
    color: #000; /* Hazırlanan siparişler başlık rengini siyah yap */
}

.column-header.teslimedilen[b-vqj3pf3x20] {
    background-color: #d4edda;
    color: #000; /* Teslim edilen siparişler başlık rengini siyah yap */
}

.column-content[b-vqj3pf3x20] {
    flex: 1;
    overflow-y: auto;
    padding: 10px;
    background-color: #fff;
    /* Her kolon kendi içinde kaydırılabilir olsun, yatay kaydırma olmasın */
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: #adb5bd #f8f9fa;
}

/* Webkit tabanlı tarayıcılar için scrollbar stilleri */
.column-content[b-vqj3pf3x20]::-webkit-scrollbar {
    width: 6px;
}

.column-content[b-vqj3pf3x20]::-webkit-scrollbar-track {
    background: #f8f9fa;
}

.column-content[b-vqj3pf3x20]::-webkit-scrollbar-thumb {
    background-color: #adb5bd;
    border-radius: 6px;
}

.order-list[b-vqj3pf3x20] {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.order-item[b-vqj3pf3x20] {
    padding: 8px 12px;
    border-bottom: 1px solid #e9ecef;
    background-color: #f8f9fa;
    margin-bottom: 8px;
    border-radius: 6px;
    transition: all 0.2s ease;
    color: #000; /* Sipariş metinlerini siyah yap */
    box-shadow: 0 1px 3px rgba(0,0,0,0.05); /* Hafif gölge ekle */
}

/* Sipariş içindeki tüm metin içeriklerini siyah yapalım */
.order-item strong[b-vqj3pf3x20], 
.order-item div.order-info[b-vqj3pf3x20] {
    color: #000;
}

/* Sipariş bilgilerini daha okunaklı yapalım */
.order-item strong[b-vqj3pf3x20] {
    font-weight: 600;
    display: inline-block;
    margin-right: 5px;
    font-size: 12px;
}

/* İçerik metinlerini düzenle */
.order-info[b-vqj3pf3x20] {
    flex: 1;
    font-size: 12px;
    line-height: 1.2;
    margin-right: 8px;
}

/* Sipariş bilgileri arasındaki boşlukları azaltalım */
.order-item br[b-vqj3pf3x20] {
    margin-bottom: 2px;
    content: "";
    display: block;
}

/* Buton grubunu düzenle */
.order-buttons[b-vqj3pf3x20] {
    display: flex;
    gap: 4px;
    margin-top: 6px;
}

/* Buton boyutlarını düzenle */
.order-buttons .btn[b-vqj3pf3x20] {
    padding: 3px 8px;
    font-size: 11px;
}

.order-item:hover[b-vqj3pf3x20] {
    transform: translateY(-2px);
    box-shadow: 0 3px 6px rgba(0,0,0,0.08);
}

.order-item:last-child[b-vqj3pf3x20] {
    margin-bottom: 0;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .order-columns-container[b-vqj3pf3x20] {
        flex-direction: column;
        height: auto;
    }
    
    .order-column[b-vqj3pf3x20] {
        margin-bottom: 20px;
        height: 500px;
    }
}

/* Mobil görünümde butonları blok olarak göster */
@media (max-width: 576px) {
    .order-buttons[b-vqj3pf3x20] {
        flex-direction: column;
        gap: 3px;
    }
}

/* Sipariş kartlarının üst kısmını düzenle */
.order-header[b-vqj3pf3x20] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; /* Üstten hizalama */
    margin-bottom: 8px;
}

/* Sipariş platformu için ikon ekleyelim */
.order-platform[b-vqj3pf3x20] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 15px; /* Kenar boşluğunu artır */
    flex-shrink: 0; /* Logo boyutunun küçülmesini engelle */
    margin-top: 0px; /* Logonun üstten boşluğunu azalt */
}

.order-platform-icon[b-vqj3pf3x20] {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa; /* Kartın gri arka plan rengiyle aynı yap */
    border: 1px solid #e9ecef; /* İnce bir kenarlık ekle */
    box-shadow: 0 1px 3px rgba(0,0,0,0.03); /* Çok hafif gölge */
    transition: all 0.2s ease;
}

.order-item:hover .order-platform-icon[b-vqj3pf3x20] {
    box-shadow: 0 2px 5px rgba(0,0,0,0.06);
}

.order-platform-icon img[b-vqj3pf3x20] {
    width: 85%;
    height: 85%;
    object-fit: contain;
    display: block;
}

/* Platform ikonlarına platformlara göre arka plan rengi ekleyelim */
.platform-yemeksepeti[b-vqj3pf3x20], .platform-getir[b-vqj3pf3x20], .platform-trendyol[b-vqj3pf3x20], .platform-migrosyemek[b-vqj3pf3x20], .platform-telefon[b-vqj3pf3x20] {
    background-color: #f8f9fa; /* Tüm platformlar için kartla aynı renk */
}

/* Sipariş ekleme ikonu */
.add-order-button[b-vqj3pf3x20] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #28a745;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
    border: none;
}

.add-order-button:hover[b-vqj3pf3x20] {
    background-color: #218838;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    transform: translateY(-50%) scale(1.05);
}

.add-order-button i[b-vqj3pf3x20] {
    font-size: 18px;
}

/* /Components/Pages/Sales/TakeoutSales/MigrosYemek/MigrosYemekAccountSettings.razor.rz.scp.css */
/* MigrosYemek Modal Modern Tasarım */
.migrosyemek-modal-modern-overlay[b-g1gx494azo] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.10);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.migrosyemek-modal-modern-content[b-g1gx494azo] {
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 8px 32px rgba(60,60,60,0.18);
    max-width: 520px;
    width: 98vw;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.migrosyemek-modal-modern-header[b-g1gx494azo] {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 1.2rem 1.5rem 0.5rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f1f1f1;
}

.migrosyemek-orange-bg[b-g1gx494azo] {
    background: #ff8300 !important;
}

.text-migrosyemek-orange[b-g1gx494azo] {
    color: #ff8300 !important;
}

.bg-migrosyemek-orange[b-g1gx494azo] {
    background: #ff8300 !important;
    color: #fff !important;
}

.btn-migrosyemek-orange[b-g1gx494azo] {
    background: #ff8300 !important;
    color: #fff !important;
    border: none;
}

    .btn-migrosyemek-orange:hover[b-g1gx494azo], .btn-migrosyemek-orange:focus[b-g1gx494azo] {
        background: #b35c00 !important;
        color: #fff !important;
    }

.migrosyemek-modal-modern-scrollable[b-g1gx494azo] {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    padding: 1.2rem 1.5rem 1.2rem 1.5rem;
}

.migrosyemek-modal-modern-footer[b-g1gx494azo] {
    position: sticky;
    bottom: 0;
    background: #fff;
    z-index: 2;
    padding: 1rem 1.5rem 1.5rem 1.5rem;
    border-top: 1px solid #f1f1f1;
}

.migrosyemek-modern-card[b-g1gx494azo] {
    background: #fffaf7;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(255,131,0,0.07);
    border: 1px solid #ffe9cc;
    transition: box-shadow 0.2s;
}

    .migrosyemek-modern-card:focus-within[b-g1gx494azo], .migrosyemek-modern-card:hover[b-g1gx494azo] {
        box-shadow: 0 0 0 0.2rem #ff830044;
        border-color: #ff8300;
    }

.migrosyemek-modern-input[b-g1gx494azo] {
    font-size: 1.1rem;
    border-radius: 0.7rem;
    min-width: 120px;
}

.migrosyemek-modern-action-btn[b-g1gx494azo] {
    min-width: 120px;
    font-size: 1.1rem;
    font-weight: 500;
    border-radius: 2rem;
    box-shadow: 0 2px 8px rgba(255,131,0,0.07);
    transition: box-shadow 0.15s, background 0.15s;
    outline: none;
    padding: 0.7rem 1.2rem;
}

    .migrosyemek-modern-action-btn:active[b-g1gx494azo], .migrosyemek-modern-action-btn:focus[b-g1gx494azo] {
        box-shadow: 0 0 0 0.2rem #ff830044;
    }

@media (max-width: 600px) {
    .migrosyemek-modal-modern-content[b-g1gx494azo] {
        max-width: 100vw;
        border-radius: 0.7rem;
    }

    .migrosyemek-modal-modern-header[b-g1gx494azo], .migrosyemek-modal-modern-footer[b-g1gx494azo] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .migrosyemek-modal-modern-scrollable[b-g1gx494azo] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .migrosyemek-modern-card[b-g1gx494azo] {
        padding: 1rem 0.5rem;
    }
}
/* /Components/Pages/Sales/TakeoutSales/ProductSelectionModal.razor.rz.scp.css */
/* Modal içeriği */
.product-modal-content[b-phsmgz4fjd] {
    height: 100%;
    overflow: hidden;
}

/* Ürün Container */
.product-container[b-phsmgz4fjd] {
    padding: 0;
    overflow: hidden;
}

/* Ürün Grid Tasarımı */
.product-grid[b-phsmgz4fjd] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    padding: 10px;
    margin: 0;
}

/* Ürün Kartı Tasarımı */
.product-card[b-phsmgz4fjd] {
    width: 100%;
    min-height: 120px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #fff;
    margin: 0;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.product-card:hover[b-phsmgz4fjd] {
    transform: translateY(-3px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Ürün Resmi */
.product-image[b-phsmgz4fjd] {
    width: 100%;
    height: 60px;
    object-fit: contain;
    margin: 0;
    padding: 0;
}

/* Ürün Başlığı */
.product-title[b-phsmgz4fjd] {
    font-size: 0.9rem;
    text-align: center;
    margin: 8px 0 4px 0;
    padding: 0;
    font-weight: bold;
    color: black;
}

/* Ürün Fiyatı */
.product-price[b-phsmgz4fjd] {
    font-size: 1rem;
    font-weight: bold;
    color: #000;
    margin: 0;
    padding: 0;
    text-align: center;
}

/* Grup Grid */
.group-grid-container[b-phsmgz4fjd] {
    padding: 8px;
    margin: 0;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

.group-grid[b-phsmgz4fjd] {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 8px;
    padding: 5px;
    margin: 0;
    height: auto;
    overflow: visible;
    max-height: 190px;
    margin-bottom: 0;
}

/* Ürün Grubu Kart Tasarımı */
.group-card[b-phsmgz4fjd] {
    height: 90px;
    border: 1px solid #ddd;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    margin: 0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.group-card:hover[b-phsmgz4fjd] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.group-card.active[b-phsmgz4fjd] {
    background-color: #007bff;
    color: white;
    border-color: #0062cc;
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3);
}

.group-card.active .group-card-title[b-phsmgz4fjd] {
    color: white;
}

/* Ürün Grubu Kart İçeriği */
.group-card-body[b-phsmgz4fjd] {
    padding: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}

/* Ürün Grubu Kart Başlığı */
.group-card-title[b-phsmgz4fjd] {
    font-size: 13px;
    font-weight: bold;
    margin: 0 auto;
    white-space: normal;
    overflow: visible;
    max-width: 100%;
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-align: center;
    line-height: 1.2;
    word-break: break-word;
    hyphens: auto;
}

/* Arama kutusu */
.search-box[b-phsmgz4fjd] {
    padding: 10px;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.search-input[b-phsmgz4fjd] {
    width: 100%;
    padding: 10px 15px;
    border-radius: 8px;
    border: 1px solid #ced4da;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.search-input:focus[b-phsmgz4fjd] {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    border-color: #86b7fe;
    outline: 0;
}

/* Sepet Başlık */
.cart-header[b-phsmgz4fjd] {
    background-color: #f8f9fa;
}

/* Sepet Tablosu */
.table-sm[b-phsmgz4fjd] {
    font-size: 14px;
}

.table-sm th[b-phsmgz4fjd], .table-sm td[b-phsmgz4fjd] {
    padding: 8px;
}

/* Seçili Satır */
.table-row[b-phsmgz4fjd] {
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.table-row:hover[b-phsmgz4fjd] {
    background-color: #f5f5f5;
}

.table-row.selected[b-phsmgz4fjd] {
    background-color: #007bff;
    color: white;
}

/* Alert Mesajları */
.alert[b-phsmgz4fjd] {
    border-radius: 8px;
    padding: 15px;
    margin: 10px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.alert-info[b-phsmgz4fjd] {
    background-color: #cce5ff;
    border-color: #b8daff;
}

.alert-warning[b-phsmgz4fjd] {
    background-color: #fff3cd;
    border-color: #ffeeba;
}

/* Mobil Responsive */
@media (max-width: 1400px) {
    .product-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .group-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 992px) {
    .product-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .group-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 768px) {
    .product-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .group-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 576px) {
    .product-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(1, 1fr);
    }
    
    .group-grid[b-phsmgz4fjd] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Modal arka planı */
.modal-backdrop[b-phsmgz4fjd] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    display: flex;
    justify-content: center;
    align-items: center;
} 
/* /Components/Pages/Sales/TakeoutSales/Trendyol/TrendyolAccountSettings.razor.rz.scp.css */
.trendyol-modal-modern-overlay[b-dslzwr532d] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.10);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.trendyol-modal-modern-content[b-dslzwr532d] {
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 8px 32px rgba(60,60,60,0.18);
    max-width: 520px;
    width: 98vw;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.trendyol-modal-modern-header[b-dslzwr532d] {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 1.2rem 1.5rem 0.5rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f1f1f1;
}

.trendyol-orange-bg[b-dslzwr532d] {
    background: #ffae00 !important;
}

.text-trendyol-orange[b-dslzwr532d] {
    color: #ffae00 !important;
}

.bg-trendyol-orange[b-dslzwr532d] {
    background: #ffae00 !important;
    color: #fff !important;
}

.btn-trendyol-orange[b-dslzwr532d] {
    background: #ffae00 !important;
    color: #fff !important;
    border: none;
}

    .btn-trendyol-orange:hover[b-dslzwr532d], .btn-trendyol-orange:focus[b-dslzwr532d] {
        background: #b37d00 !important;
        color: #fff !important;
    }

.trendyol-modal-modern-scrollable[b-dslzwr532d] {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    padding: 1.2rem 1.5rem 1.2rem 1.5rem;
}

.trendyol-modal-modern-footer[b-dslzwr532d] {
    position: sticky;
    bottom: 0;
    background: #fff;
    z-index: 2;
    padding: 1rem 1.5rem 1.5rem 1.5rem;
    border-top: 1px solid #f1f1f1;
}

.trendyol-modern-card[b-dslzwr532d] {
    background: #fffdf7;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(255,174,0,0.07);
    border: 1px solid #fff2cc;
    transition: box-shadow 0.2s;
}

    .trendyol-modern-card:focus-within[b-dslzwr532d], .trendyol-modern-card:hover[b-dslzwr532d] {
        box-shadow: 0 0 0 0.2rem #ffae0044;
        border-color: #ffae00;
    }

.trendyol-modern-input[b-dslzwr532d] {
    font-size: 1.1rem;
    border-radius: 0.7rem;
    min-width: 120px;
}

.trendyol-modern-action-btn[b-dslzwr532d] {
    min-width: 120px;
    font-size: 1.1rem;
    font-weight: 500;
    border-radius: 2rem;
    box-shadow: 0 2px 8px rgba(255,174,0,0.07);
    transition: box-shadow 0.15s, background 0.15s;
    outline: none;
    padding: 0.7rem 1.2rem;
}

    .trendyol-modern-action-btn:active[b-dslzwr532d], .trendyol-modern-action-btn:focus[b-dslzwr532d] {
        box-shadow: 0 0 0 0.2rem #ffae0044;
    }

@@media (max-width: 600px) {
    .trendyol-modal-modern-content[b-dslzwr532d] {
        max-width: 100vw;
        border-radius: 0.7rem;
    }

    .trendyol-modal-modern-header[b-dslzwr532d], .trendyol-modal-modern-footer[b-dslzwr532d] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .trendyol-modal-modern-scrollable[b-dslzwr532d] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .trendyol-modern-card[b-dslzwr532d] {
        padding: 1rem 0.5rem;
    }
}
/* /Components/Pages/Sales/TakeoutSales/Yemeksepeti/YemeksepetiAccountSettings.razor.rz.scp.css */
.yemeksepeti-modal-modern-overlay[b-1x6jy6rxn2] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.10);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.yemeksepeti-modal-modern-content[b-1x6jy6rxn2] {
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 8px 32px rgba(60,60,60,0.18);
    max-width: 520px;
    width: 98vw;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.yemeksepeti-modal-modern-header[b-1x6jy6rxn2] {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 1.2rem 1.5rem 0.5rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f1f1f1;
}

.yemeksepeti-pembe-bg[b-1x6jy6rxn2] {
    background: #e1006a !important;
}

.text-yemeksepeti-pembe[b-1x6jy6rxn2] {
    color: #e1006a !important;
}

.bg-yemeksepeti-pembe[b-1x6jy6rxn2] {
    background: #e1006a !important;
    color: #fff !important;
}

.btn-yemeksepeti-pembe[b-1x6jy6rxn2] {
    background: #e1006a !important;
    color: #fff !important;
    border: none;
}

    .btn-yemeksepeti-pembe:hover[b-1x6jy6rxn2], .btn-yemeksepeti-pembe:focus[b-1x6jy6rxn2] {
        background: #a8004e !important;
        color: #fff !important;
    }

.yemeksepeti-modal-modern-scrollable[b-1x6jy6rxn2] {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    padding: 1.2rem 1.5rem 1.2rem 1.5rem;
}

.yemeksepeti-modal-modern-footer[b-1x6jy6rxn2] {
    position: sticky;
    bottom: 0;
    background: #fff;
    z-index: 2;
    padding: 1rem 1.5rem 1.5rem 1.5rem;
    border-top: 1px solid #f1f1f1;
}

.yemeksepeti-modern-card[b-1x6jy6rxn2] {
    background: #fff7f2;
    border-radius: 1.2rem;
    box-shadow: 0 2px 12px rgba(225,0,106,0.07);
    border: 1px solid #ffd1e6;
    transition: box-shadow 0.2s;
}

    .yemeksepeti-modern-card:focus-within[b-1x6jy6rxn2], .yemeksepeti-modern-card:hover[b-1x6jy6rxn2] {
        box-shadow: 0 0 0 0.2rem #e1006a44;
        border-color: #e1006a;
    }

.yemeksepeti-modern-input[b-1x6jy6rxn2] {
    font-size: 1.1rem;
    border-radius: 0.7rem;
    min-width: 120px;
}

.yemeksepeti-modern-action-btn[b-1x6jy6rxn2] {
    min-width: 120px;
    font-size: 1.1rem;
    font-weight: 500;
    border-radius: 2rem;
    box-shadow: 0 2px 8px rgba(225,0,106,0.07);
    transition: box-shadow 0.15s, background 0.15s;
    outline: none;
    padding: 0.7rem 1.2rem;
}

    .yemeksepeti-modern-action-btn:active[b-1x6jy6rxn2], .yemeksepeti-modern-action-btn:focus[b-1x6jy6rxn2] {
        box-shadow: 0 0 0 0.2rem #e1006a44;
    }

@@media (max-width: 600px) {
    .yemeksepeti-modal-modern-content[b-1x6jy6rxn2] {
        max-width: 100vw;
        border-radius: 0.7rem;
    }

    .yemeksepeti-modal-modern-header[b-1x6jy6rxn2], .yemeksepeti-modal-modern-footer[b-1x6jy6rxn2] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .yemeksepeti-modal-modern-scrollable[b-1x6jy6rxn2] {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .yemeksepeti-modern-card[b-1x6jy6rxn2] {
        padding: 1rem 0.5rem;
    }
}
/* /Components/Pages/Settings/GeneralSettings.razor.rz.scp.css */
.setting-item.changed[b-qmn7nz54n5] {
    padding: 15px;
    border-radius: 5px;
    background-color: rgba(255, 243, 205, 0.3);
    border-left: 3px solid #ffc107;
}

.list-group-item.active[b-qmn7nz54n5] {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

/* Skeleton loader için gerekli stiller */
.skeleton-loader[b-qmn7nz54n5] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading-b-qmn7nz54n5 1.5s infinite;
    border-radius: 4px;
}

.skeleton-item[b-qmn7nz54n5] {
    cursor: wait;
}

@keyframes loading-b-qmn7nz54n5 {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

@keyframes fadeInOut-b-qmn7nz54n5 {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(-20px);
    }
    10% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    90% {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-20px);
    }
}
/* /Components/Pages/Settings/ReportDesigns.razor.rz.scp.css */
/* ReportDesigns.razor.css */

.btn-outline-primary[b-ttai4n3als], .btn-outline-info[b-ttai4n3als], .btn-outline-danger[b-ttai4n3als] {
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
}

.table[b-ttai4n3als] {
    font-size: 0.9rem;
}

.badge[b-ttai4n3als] {
    font-weight: normal;
    padding: 0.35em 0.65em;
}

.alert-info[b-ttai4n3als] {
    background-color: #e9f6fd;
    border-color: #bee5eb;
    color: #0c5460;
}

.card[b-ttai4n3als] {
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    border-radius: 0.5rem;
}

h3[b-ttai4n3als] {
    color: #495057;
    font-weight: 600;
}

h5[b-ttai4n3als] {
    color: #495057;
    font-weight: 500;
}

h6[b-ttai4n3als] {
    color: #6c757d;
    font-weight: 500;
} 
/* /Components/Pages/Settings/TableSalesSettings.razor.rz.scp.css */
/* /Components/Pages/StockManagement/AddStock.razor.rz.scp.css */
.table th[b-3dlzvlriwd] {
    position: relative;
}

    .table th .btn[b-3dlzvlriwd] {
        position: absolute;
        right: 5px;
        top: 50%;
        transform: translateY(-50%);
        padding: 2px 6px;
        font-size: 0.8rem;
    }
form[b-3dlzvlriwd] {
    max-width: 100%; /* Form genişliği ekran boyutuna göre */
    padding: 0; /* Form iç boşlukları kaldırıldı */
    background-color: transparent; /* Kart görünümü kaldırıldı */
    border: none; /* Çerçeve kaldırıldı */
}

    form .form-label[b-3dlzvlriwd] {
        font-weight: bold;
    }

    form .form-control[b-3dlzvlriwd], form .form-select[b-3dlzvlriwd] {
        font-size: 0.9rem; /* Daha kompakt bir görünüm */
        height: calc(1.5em + 0.75rem + 2px); /* Boyutu biraz küçült */
    }
.filter-menu[b-3dlzvlriwd] {
    position: absolute;
    background-color: white;
    border: 1px solid #ddd;
    padding: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    max-height: 200px; /* Yüksekliği sınırlamak için */
    overflow-y: auto; /* Taşan içerik için kaydırma */
    font-size: 0.9rem; /* Daha küçük font */
    width: 150px; /* Menü genişliği */
}

    .filter-menu label[b-3dlzvlriwd] {
        display: block; /* Dik görünüm için */
        margin: 5px 0;
        cursor: pointer;
    }
.btn-outline-primary[b-3dlzvlriwd] {
    font-weight: bold;
    border-width: 2px;
    transition: all 0.3s ease;
}

    .btn-outline-primary:hover[b-3dlzvlriwd] {
        background-color: #0056b3;
        color: white;
        border-color: #0056b3;
    }
th[b-3dlzvlriwd] {
    white-space: nowrap; /* Metnin taşmasını önler */
    vertical-align: middle; /* Metin ve ikonları ortalar */
}

.d-flex[b-3dlzvlriwd] {
    display: flex;
    align-items: center; /* İçerikleri dikey olarak ortalar */
    justify-content: space-between; /* İkonları ve metni yatayda hizalar */
    gap: 0.5rem; /* Metin ve ikon arasındaki boşluğu arttırır */
}

.btn-sm[b-3dlzvlriwd] {
    padding: 0.25rem 0.5rem; /* Küçük butonlar için iç boşlukları düzenler */
}
/* /Components/Pages/StockManagement/EditStock.razor.rz.scp.css */
.wrap-text[b-hqzw521m9c] {
    white-space: normal;
    word-wrap: break-word;
    max-width: 150px;
}
.toast-message[b-hqzw521m9c] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 12px;
    border-radius: 4px;
    color: white;
    font-weight: 500;
    font-size: 12px;
    z-index: 9999;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    opacity: 0.9;
    transition: all 0.2s ease;
    max-width: 200px;
    text-align: center;
}

.toast-success[b-hqzw521m9c] {
    background-color: #28a745;
}

.toast-error[b-hqzw521m9c] {
    background-color: #dc3545;
}

.edit-panel[b-hqzw521m9c] {
    border-top: 1px solid #e0e0e0;
    background-color: #f8f9fa;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

table thead th[b-hqzw521m9c] {
    position: sticky;
    top: 0;
    background-color: #f8f9fa;
    z-index: 1;
}

/* Görsel için küçük önizleme stillemesi */
.img-thumbnail[b-hqzw521m9c] {
    max-width: 80px;
    max-height: 80px;
    object-fit: contain;
    border: 1px solid #ddd;
}

/* Seçenek grupları için stil */
.option-groups-container[b-hqzw521m9c] {
    max-height: 500px;
    overflow-y: auto;
    padding-right: 5px;
}

/* Kaydırma çubuğu stillemesi */
.option-groups-container[b-hqzw521m9c]::-webkit-scrollbar {
    width: 6px;
}

.option-groups-container[b-hqzw521m9c]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.option-groups-container[b-hqzw521m9c]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.option-groups-container[b-hqzw521m9c]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Responsif tablo için */
@media (max-width: 768px) {
    .table-responsive[b-hqzw521m9c] {
        overflow-x: auto;
    }
}

/* Aktif satır vurgusu */
tr.selected-row[b-hqzw521m9c] {
    background-color: rgba(0, 123, 255, 0.1) !important;
}

/* Düzenlenebilir hücre stillemeleri */
.cell-input[b-hqzw521m9c] {
    width: 100%;
    padding: 4px 8px;
    border: 1px solid #dee2e6;
    background-color: #fff;
    border-radius: 4px;
    min-height: 34px;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.cell-input:focus[b-hqzw521m9c] {
    outline: none;
    border-color: #80bdff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    background-color: #fff;
}

.editable-table tbody tr:hover .cell-input[b-hqzw521m9c] {
    background-color: #f8f9fa;
}

/* Input[type=number] için özel stil */
input[type="number"].cell-input[b-hqzw521m9c] {
    text-align: right;
    font-weight: 500;
    padding-right: 10px;
}

/* Fiyat inputları için özel stil */
.price-input[b-hqzw521m9c] {
    background-color: #f8f9fa;
    font-weight: 700 !important;
    color: #212529;
    font-size: 0.95rem;
    border-color: #007bff40;
    min-height: 36px !important;
}

.price-input:focus[b-hqzw521m9c] {
    background-color: #fff !important;
    border-color: #007bff !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
}

/* Form control görüntüsünü koruyalım */
.form-control.cell-input[b-hqzw521m9c] {
    height: calc(1.5em + 0.5rem + 2px);
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    display: block;
}

/* Input number için ok butonu stillemeleri */
input[type="number"][b-hqzw521m9c]::-webkit-inner-spin-button, 
input[type="number"][b-hqzw521m9c]::-webkit-outer-spin-button { 
    opacity: 1;
    height: 30px;
    margin-right: 2px;
}

.form-check-input[b-hqzw521m9c] {
    cursor: pointer;
}

/* Düzeltme */
.table td[b-hqzw521m9c] {
    vertical-align: middle;
    padding: 0.5rem;
}
/* /Components/Pages/StockManagement/EditStockById.razor.rz.scp.css */
.wrap-text[b-9jze0in1sl] {
    white-space: normal;
    word-wrap: break-word;
    max-width: 150px;
}

.toast-message[b-9jze0in1sl] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    background-color: #333; /* Default */
    display: block; /* Görünür yapmak için ekleyin */
}

.toast-success[b-9jze0in1sl] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-9jze0in1sl] {
    background-color: #dc3545; /* Kırmızı */
}
/* /Components/Pages/StockManagement/Index.razor.rz.scp.css */
.dashboard-card[b-3d0uvey2vy] {
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    border: 1px solid #ddd;
    border-radius: 10px;
}

    .dashboard-card:hover[b-3d0uvey2vy] {
        transform: scale(1.05);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    }

    .dashboard-card .card-body i[b-3d0uvey2vy] {
        color: #007bff;
    }

    .dashboard-card .card-body h5[b-3d0uvey2vy] {
        margin: 0;
        font-size: 1.25rem;
        font-weight: bold;
    }
/* /Components/Pages/StockManagement/MultipleStockProcess.razor.rz.scp.css */
.toast-message[b-b9oftmdtid] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    background-color: #333; /* Default */
    display: block; /* Görünür yapmak için ekleyin */
}

.toast-success[b-b9oftmdtid] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-b9oftmdtid] {
    background-color: #dc3545; /* Kırmızı */
}
/* /Components/Pages/StockManagement/StockCustomise.razor.rz.scp.css */
.toast-message[b-23n34pju4y] {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    z-index: 9999;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
    background-color: #333; /* Default */
    display: block; /* Görünür yapmak için ekleyin */
}

.toast-success[b-23n34pju4y] {
    background-color: #28a745; /* Yeşil */
}

.toast-error[b-23n34pju4y] {
    background-color: #dc3545; /* Kırmızı */
}
/* /Components/Pages/ToastModal/ToastMessage.razor.rz.scp.css */
.custom-toast[b-t95gycwew0] {
    position: fixed;
    top: 32px;
    right: 32px;
    width: 320px;
    min-width: 320px;
    max-width: 400px;
    background: #fff;
    color: #333;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(60,60,60,0.13);
    z-index: 999999;
    padding: 0;
    font-family: 'Segoe UI', sans-serif;
    border: 1.5px solid #eee;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* 1366x768 için toast optimizasyonu */
@media (max-width: 1366px) and (max-height: 768px) {
    .custom-toast[b-t95gycwew0] {
        top: 16px;
        right: 16px;
        width: 280px;
        min-width: 280px;
        max-width: 320px;
        border-radius: 0.75rem;
    }
    
    .toast-header[b-t95gycwew0] {
        padding: 10px 16px 4px 12px;
        gap: 6px;
    }
    
    .toast-icon[b-t95gycwew0] {
        font-size: 1.4rem;
        margin-right: 1px;
    }
    
    .toast-title[b-t95gycwew0] {
        font-size: 0.9rem;
        font-weight: 600;
        letter-spacing: 0;
        margin-top: 1px;
    }
    
    .toast-close-btn[b-t95gycwew0] {
        width: 1.6rem;
        height: 1.6rem;
        font-size: 1rem;
    }
    
    .toast-divider[b-t95gycwew0] {
        height: 1.5px;
        margin: 0 16px;
    }
    
    .toast-message[b-t95gycwew0] {
        font-size: 0.85rem;
        padding: 10px 16px 12px 16px;
        line-height: 1.3;
    }
}

.toast-header[b-t95gycwew0] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 13px 20px 6px 16px;
    width: 100%;
    box-sizing: border-box;
    background: #fff;
}

.toast-icon[b-t95gycwew0] {
    font-size: 1.7rem;
    flex-shrink: 0;
    margin-right: 2px;
}

.toast-title[b-t95gycwew0] {
    font-weight: 600;
    font-size: 1.02rem;
    letter-spacing: 0.01em;
    margin-top: 2px;
    flex: 1;
}

.toast-close-btn[b-t95gycwew0] {
    background: transparent;
    border: none;
    color: #888;
    font-size: 1.2rem;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
    cursor: pointer;
    flex-shrink: 0;
}

.toast-close-btn:hover[b-t95gycwew0] {
    background: #f1f1f1;
    color: #222;
}

.toast-divider[b-t95gycwew0] {
    height: 2px;
    background: #f1f1f1;
    margin: 0 20px;
    width: auto;
}

.toast-message[b-t95gycwew0] {
    font-size: 1.04rem;
    padding: 14px 24px 18px 20px;
    color: #333;
    width: 100%;
    box-sizing: border-box;
    background: #fff;
    position: relative;
}

.toast-success .toast-icon[b-t95gycwew0], 
.toast-success .toast-title[b-t95gycwew0] { 
    color: #28a745; 
}

.toast-error .toast-icon[b-t95gycwew0], 
.toast-error .toast-title[b-t95gycwew0] { 
    color: #dc3545; 
}

.toast-warning .toast-icon[b-t95gycwew0], 
.toast-warning .toast-title[b-t95gycwew0] { 
    color: #ffb300; 
}

.toast-info .toast-icon[b-t95gycwew0], 
.toast-info .toast-title[b-t95gycwew0] { 
    color: #17a2b8; 
}

/* Progress Bar Styles */
.toast-progress-bar[b-t95gycwew0] {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    width: 100%;
    border-radius: 0 0 1rem 1rem;
    animation: progressShrink-b-t95gycwew0 linear forwards;
    box-shadow: 0 -1px 3px rgba(0,0,0,0.1);
}

.toast-progress-bar.toast-success[b-t95gycwew0] {
    background: linear-gradient(90deg, #28a745, #20c997);
}

.toast-progress-bar.toast-error[b-t95gycwew0] {
    background: linear-gradient(90deg, #dc3545, #e74c3c);
}

.toast-progress-bar.toast-warning[b-t95gycwew0] {
    background: linear-gradient(90deg, #ffb300, #ffc107);
}

.toast-progress-bar.toast-info[b-t95gycwew0] {
    background: linear-gradient(90deg, #17a2b8, #20c997);
}

@keyframes progressShrink-b-t95gycwew0 {
    from { 
        width: 100%; 
        opacity: 0.9;
    }
    to { 
        width: 0%; 
        opacity: 0.4;
    }
}

/* 1366x768 için progress bar optimizasyonu */
@media (max-width: 1366px) and (max-height: 768px) {
    .toast-progress-bar[b-t95gycwew0] {
        height: 3px;
        border-radius: 0 0 0.75rem 0.75rem;
    }
}

@keyframes fadeIn-b-t95gycwew0 {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* /Components/Pages/VirtualKeyboard/VirtualKeyboard.razor.rz.scp.css */
.keyboard-container[b-1a13kz8rl0] {
    width: 700px;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    padding: 15px;
    position: absolute;
    z-index: 1050;
    cursor: grab;
}

    .keyboard-container:active[b-1a13kz8rl0] {
        cursor: grabbing;
    }

.keyboard-header[b-1a13kz8rl0] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.keyboard-row[b-1a13kz8rl0] {
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
    gap: 5px;
}

.keyboard-key[b-1a13kz8rl0] {
    width: 60px;
    height: 60px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #f8f9fa;
    cursor: pointer;
    transition: background-color 0.2s;
}

    .keyboard-key:hover[b-1a13kz8rl0] {
        background-color: #e0e0e0;
    }

    .keyboard-key.special-key[b-1a13kz8rl0] {
        background-color: #007bff;
        color: white;
        width: auto;
        padding: 0 15px;
    }

        .keyboard-key.special-key:hover[b-1a13kz8rl0] {
            background-color: #0056b3;
        }

/* 1366x768 EKRAN İÇİN VİRTUAL KEYBOARD OPTİMİZASYONU */
@media (max-width: 1366px) and (max-height: 768px) {
    .keyboard-container[b-1a13kz8rl0] {
        width: 500px !important; /* Daha dar klavye */
        padding: 8px !important; /* Daha az padding */
        border-radius: 6px !important; /* Daha küçük border radius */
    }
    
    .keyboard-row[b-1a13kz8rl0] {
        margin-bottom: 6px !important; /* Daha az satır aralığı */
        gap: 3px !important; /* Daha az tuş aralığı */
    }
    
    .keyboard-key[b-1a13kz8rl0] {
        width: 35px !important; /* Daha küçük tuşlar */
        height: 35px !important;
        font-size: 11px !important; /* Daha küçük font */
        font-weight: 500 !important; /* Daha ince yazı */
        border-radius: 3px !important; /* Daha küçük border radius */
        padding: 0 !important; /* Padding kaldır */
    }
    
    .keyboard-key.special-key[b-1a13kz8rl0] {
        padding: 0 8px !important; /* Özel tuşlar için minimal padding */
        font-size: 10px !important; /* Daha küçük özel tuş yazısı */
        min-width: 40px !important; /* Minimum genişlik */
    }
    
    /* Space tuşu için özel ayar */
    .keyboard-key.special-key[style*="width:200px"][b-1a13kz8rl0] {
        width: 120px !important; /* Daha dar space tuşu */
    }
    
    /* Klavye başlığı */
    .keyboard-container .d-flex.justify-content-between h6[b-1a13kz8rl0] {
        font-size: 0.8rem !important; /* Daha küçük başlık */
        margin-bottom: 0 !important;
    }
    
    .keyboard-container .d-flex.justify-content-between[b-1a13kz8rl0] {
        margin-bottom: 8px !important; /* Daha az alt boşluk */
        padding: 4px 8px !important; /* Daha az padding */
    }
    
    .keyboard-container .btn-sm[b-1a13kz8rl0] {
        font-size: 0.7rem !important; /* Kapatma butonu daha küçük */
        padding: 2px 6px !important;
    }
}