.login-back-wrap {
        text-align: left;
        margin-bottom: 8px;
    }
    .login-back-link {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: 13px;
        font-weight: 500;
        color: #6b7280;
        text-decoration: none;
        transition: color 0.15s;
    }
    .login-back-link:hover {
        color: #6366f1;
    }
    .login-back-icon {
        width: 16px;
        height: 16px;
    }
    .category-icon-preview {
        font-size: 1.25rem;
        width: 2rem;
        text-align: center;
    }
    .has-lang-select {
        position: relative;
    }
    .has-lang-select .lang-select-header {
        position: absolute;
        top: 12px;
        right: 16px;
        z-index: 10;
        width: 180px;
    }
    .has-lang-select .lang-select-header .fi-fo-field-label-col {
        display: none;
    }
    .day-toggle-wrap {
        display: flex;
        align-items: center;
        min-height: 100%;
    }
    .day-toggle-wrap .fi-fo-field-wrp {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    .menu-products-header {
        display: grid;
        grid-template-columns: 3fr 2fr 1fr;
        gap: 1rem;
        font-size: 0.75rem;
        font-weight: 600;
        color: rgba(var(--gray-500), 1);
        padding: 0 2.5rem 0.25rem 0;
        border-bottom: 1px solid rgba(var(--gray-200), 1);
        margin-bottom: 0.5rem;
    }
    :is(.dark) .menu-products-header {
        border-color: rgba(var(--gray-700), 1);
    }
    .choices__group .choices__heading {
        background: #f2f2f2 !important;
        padding: 6px 12px !important;
        font-weight: 600 !important;
        font-size: 0.8rem !important;
        color: #333 !important;
        border-bottom: 1px solid #e5e5e5 !important;
    }
    :is(.dark) .choices__group .choices__heading {
        background: rgba(55, 65, 81, 0.5) !important;
        color: #d1d5db !important;
        border-bottom-color: #374151 !important;
    }
    .fi-dropdown-header {
        background: #f2f2f2 !important;
        color: #111 !important;
        font-weight: bold !important;
    }
    :is(.dark) .fi-dropdown-header {
        background: rgba(55, 65, 81, 0.5) !important;
        color: #d1d5db !important;
    }
    input[type="number"][step="0.01"] {
        -moz-appearance: textfield;
    }
    .branch-badge-wrap {
        position: relative;
        display: inline-block;
        cursor: help;
    }
    .branch-badge-wrap .branch-tooltip {
        display: none;
        position: absolute;
        bottom: calc(100% + 8px);
        right: 0;
        background: #1f2937;
        color: #fff;
        padding: 10px 14px;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.8;
        white-space: normal;
        min-width: 200px;
        max-width: 320px;
        max-height: 250px;
        overflow-y: auto;
        z-index: 50;
        box-shadow: 0 4px 16px rgba(0,0,0,0.25);
    }
    .branch-badge-wrap .branch-tooltip:after {
        content: '';
        position: absolute;
        top: 100%;
        right: 16px;
        border: 6px solid transparent;
        border-top-color: #1f2937;
    }
    .branch-badge-wrap:hover .branch-tooltip {
        display: block;
    }
    .branch-tooltip-item {
        display: inline-block;
        background: rgba(255,255,255,0.15);
        padding: 2px 8px;
        border-radius: 4px;
        margin: 2px;
        font-size: 11px;
    }
    .fi-modal-footer-actions,
    .fi-sc-actions .fi-ac {
        justify-content: flex-start !important;
        flex-direction: row-reverse !important;
    }
    .sort-ghost {
        background: #ecfdf5 !important;
        opacity: 0.8;
    }
    :is(.dark) .sort-ghost {
        background: rgba(16, 185, 129, 0.1) !important;
    }
    .sort-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 16px;
        border-bottom: 1px solid #f3f4f6;
        background: #fff;
    }
    :is(.dark) .sort-item {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .sort-container {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        overflow: hidden;
    }
    :is(.dark) .sort-container {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .sort-filter select {
        padding: 8px 12px;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-size: 13px;
        background: #fff;
        color: #111;
    }
    :is(.dark) .sort-filter select {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
        color: #e5e7eb;
    }
    .category-header-row {
        background: #444;
        padding: 6px 12px;
        font-weight: bold;
        font-size: 12px;
        color: #fff;
    }
    :is(.dark) .category-header-row {
        background: #1f2937;
    }
    .modifier-field-muted .fi-fo-field-label {
        color: rgba(var(--gray-400), 1) !important;
        font-size: 0.75rem !important;
    }
    .portion-toggle-align .fi-toggle {
        margin-top: 0.4rem;
    }
    .group-count-badge {
        background: #10b981;
        color: #fff;
        padding: 5px 8px;
        border-radius: 5px;
        font-size: 0.7rem;
        margin-left: 6px;
        font-weight: 600;
    }
    /* === STOK YÖNETİMİ === */
    .stock-page { display: flex; flex-direction: column; gap: 16px; }
    .stock-summary-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .stock-summary-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 16px 20px; text-align: center; }
    :is(.dark) .stock-summary-card { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .stock-summary-value { font-size: 1.6rem; font-weight: 700; color: #111; }
    :is(.dark) .stock-summary-value { color: #e5e7eb; }
    .stock-summary-label { font-size: 0.75rem; color: #6b7280; margin-top: 2px; }
    .stock-summary-danger .stock-summary-value { color: #ef4444; }
    .stock-summary-warning .stock-summary-value { color: #f59e0b; }
    .stock-container { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; }
    :is(.dark) .stock-container { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .stock-header-bar { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid #f3f4f6; }
    :is(.dark) .stock-header-bar { border-color: rgb(55,65,81); }
    .stock-header-left { display: flex; align-items: center; gap: 8px; }
    .stock-header-right { display: flex; align-items: center; gap: 8px; }
    .stock-branch-label { font-size: 13px; font-weight: 600; color: #374151; }
    :is(.dark) .stock-branch-label { color: #d1d5db; }
    .stock-filter-bar { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid #f3f4f6; flex-wrap: wrap; }
    :is(.dark) .stock-filter-bar { border-color: rgb(55,65,81); }
    .stock-select, .stock-input { padding: 7px 10px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 13px; outline: none; background: #fff; color: #111; }
    :is(.dark) .stock-select, :is(.dark) .stock-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .stock-input-search { flex: 1; min-width: 180px; }
    .stock-select-sm { padding: 3px 6px; border: 1px solid #d1d5db; border-radius: 4px; font-size: 12px; background: #fff; }
    :is(.dark) .stock-select-sm { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #e5e7eb; }
    .stock-checkbox-label { display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; white-space: nowrap; }
    .stock-table-wrap { overflow-x: auto; }
    .stock-table { width: 100%; border-collapse: collapse; font-size: 13px; }
    .stock-table thead tr { background: #f9fafb; border-bottom: 1px solid #e5e7eb; }
    :is(.dark) .stock-table thead tr { background: rgb(17,24,39); }
    .stock-table th { padding: 8px 10px; font-weight: 600; font-size: 11px; color: #6b7280; text-align: center; white-space: nowrap; }
    .stock-th-left { text-align: left !important; }
    .stock-th-sortable { cursor: pointer; user-select: none; }
    .stock-th-sortable:hover { color: #111; }
    :is(.dark) .stock-th-sortable:hover { color: #e5e7eb; }
    .stock-sort-icon { font-size: 9px; margin-left: 2px; }
    .stock-pending-badge { display: inline-flex; align-items: center; justify-content: center; background: #f59e0b; color: #fff; font-size: 10px; font-weight: 700; width: 18px; height: 18px; border-radius: 50%; margin-right: 4px; line-height: 1; }
    .stock-table td { padding: 5px 10px; border-bottom: 1px solid #f9fafb; }
    :is(.dark) .stock-table td { border-color: rgb(55,65,81); }
    .stock-td-center { text-align: center; }
    .stock-td-name { font-weight: 500; white-space: nowrap; }
    .stock-td-bold { font-weight: 700; }
    .stock-row-critical { background: rgba(239,68,68,0.05); }
    :is(.dark) .stock-row-critical { background: rgba(239,68,68,0.1); }
    .stock-inline-input { padding: 3px 6px; border: 1px solid #e5e7eb; border-radius: 4px; text-align: center; font-size: 12px; background: #fff; color: #111; }
    :is(.dark) .stock-inline-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .stock-inline-code { width: 90px; }
    .stock-inline-num { width: 65px; }
    .stock-status-dot { background: none; border: none; cursor: pointer; font-size: 16px; padding: 2px 6px; }
    .stock-dot-on { color: #10b981; }
    .stock-dot-off { color: #ef4444; }
    .stock-badge-critical { background: #fef2f2; color: #dc2626; font-size: 10px; padding: 2px 6px; border-radius: 4px; margin-left: 6px; font-weight: 600; }
    :is(.dark) .stock-badge-critical { background: rgba(220,38,38,0.15); }
    .stock-badge-expired { background: #fef2f2; color: #dc2626; font-size: 11px; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
    .stock-badge-expiring { background: #fffbeb; color: #d97706; font-size: 11px; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
    .stock-badge-ok { color: #6b7280; font-size: 11px; }
    .stock-text-muted { color: #9ca3af; font-size: 12px; }
    .stock-text-green { color: #10b981; font-weight: 600; }
    .stock-text-red { color: #ef4444; font-weight: 600; }
    .stock-action-wrap { position: relative; }
    .stock-action-btn { background: none; border: none; cursor: pointer; font-size: 18px; padding: 2px 8px; color: #6b7280; }
    .stock-action-dropdown { position: absolute; right: 0; top: 100%; margin-top: 2px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); z-index: 50; min-width: 150px; overflow: hidden; }
    :is(.dark) .stock-action-dropdown { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .stock-action-item { display: block; width: 100%; text-align: left; padding: 8px 14px; border: none; background: none; cursor: pointer; font-size: 13px; color: #111; }
    .stock-action-item:hover { background: #f3f4f6; }
    :is(.dark) .stock-action-item { color: #e5e7eb; }
    :is(.dark) .stock-action-item:hover { background: rgb(55,65,81); }
    .stock-pagination { padding: 8px 16px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #f3f4f6; font-size: 12px; color: #6b7280; }
    :is(.dark) .stock-pagination { border-color: rgb(55,65,81); }
    .stock-pagination-left, .stock-pagination-right { display: flex; align-items: center; gap: 8px; }
    .stock-page-btn { padding: 4px 10px; border: 1px solid #d1d5db; border-radius: 4px; cursor: pointer; background: #fff; font-size: 12px; }
    :is(.dark) .stock-page-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #e5e7eb; }
    .stock-page-btn-disabled { opacity: 0.4; cursor: default; }
    .stock-empty { padding: 40px; text-align: center; color: #9ca3af; }
    /* Modal */
    .stock-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 100; display: flex; align-items: center; justify-content: center; padding: 20px; }
    .stock-modal { background: #fff; border-radius: 12px; width: 100%; max-width: 500px; max-height: 90vh; overflow-y: auto; }
    :is(.dark) .stock-modal { background: rgb(31,41,55); }
    .stock-modal-lg { max-width: 700px; }
    .stock-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid #e5e7eb; }
    :is(.dark) .stock-modal-header { border-color: rgb(55,65,81); }
    .stock-modal-header h3 { font-weight: 600; font-size: 15px; }
    .stock-modal-close { background: none; border: none; cursor: pointer; font-size: 16px; color: #9ca3af; padding: 4px; }
    .stock-modal-body { padding: 16px 20px; }
    .stock-modal-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid #e5e7eb; }
    :is(.dark) .stock-modal-footer { border-color: rgb(55,65,81); }
    .stock-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .stock-form-group { display: flex; flex-direction: column; gap: 4px; }
    .stock-form-group label { font-size: 12px; font-weight: 600; color: #374151; }
    :is(.dark) .stock-form-group label { color: #d1d5db; }
    .stock-form-full { grid-column: 1 / -1; }
    .stock-form-span-2 { grid-column: span 2; }
    .stock-textarea { resize: vertical; min-height: 60px; }
    .stock-required { color: #ef4444; }
    .stock-correction-info { background: #f9fafb; padding: 10px 14px; border-radius: 8px; margin-bottom: 12px; font-size: 13px; }
    :is(.dark) .stock-correction-info { background: rgb(17,24,39); }
    /* Butonlar */
    .stock-btn { padding: 7px 14px; border: none; border-radius: 6px; cursor: pointer; font-size: 13px; font-weight: 500; white-space: nowrap; }
    .stock-btn-sm { padding: 5px 10px; font-size: 12px; }
    .stock-btn-primary { background: #3b82f6; color: #fff; }
    .stock-btn-primary:hover { background: #2563eb; }
    .stock-btn-secondary { background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; }
    :is(.dark) .stock-btn-secondary { background: rgb(55,65,81); color: #e5e7eb; border-color: rgb(75,85,99); }
    .stock-btn-success { background: #10b981; color: #fff; }
    .stock-btn-danger { background: #ef4444; color: #fff; }
    .stock-btn-warning { background: #f59e0b; color: #fff; }
    .stock-btn-icon { background: none; border: none; cursor: pointer; padding: 4px 8px; font-size: 14px; }
    .stock-btn-danger-icon { color: #ef4444; }
    /* Stok giriş kartı */
    .stock-entry-card { border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px 16px; margin-bottom: 10px; }
    :is(.dark) .stock-entry-card { border-color: rgb(55,65,81); }
    .stock-entry-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
    .stock-entry-card-num { font-size: 12px; font-weight: 700; color: #3b82f6; }
    .stock-form-grid-3 { grid-template-columns: repeat(3, 1fr); }
    .stock-add-row-btn { width: 100%; text-align: center; padding: 10px; border-style: dashed; border-width: 1px; border-color: #d1d5db; border-radius: 8px; background: #f9fafb; }
    :is(.dark) .stock-add-row-btn { background: rgb(17,24,39); border-color: rgb(55,65,81); }
    /* Toplu giriş satırı (sevk modalı için) */
    .stock-bulk-labels { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; font-size: 11px; font-weight: 600; color: #6b7280; }
    .stock-bulk-row { display: flex; gap: 6px; align-items: center; margin-bottom: 8px; }
    .stock-bulk-product { flex: 2; }
    .stock-bulk-serie { flex: 1; }
    .stock-bulk-date { flex: 1; min-width: 0; }
    .stock-bulk-qty { width: 70px; flex: none; }
    .stock-bulk-action-spacer { width: 30px; flex: none; }
    /* Stok geçmişi */
    .stock-history-body { max-height: 400px; overflow-y: auto; }
    .stock-table-compact th, .stock-table-compact td { padding: 4px 8px; font-size: 12px; }
    .stock-type-badge { padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; }
    .stock-type-entry { background: #ecfdf5; color: #059669; }
    .stock-type-correction { background: #fef3c7; color: #d97706; }
    .stock-type-transfer_in { background: #eff6ff; color: #2563eb; }
    .stock-type-transfer_out { background: #fef2f2; color: #dc2626; }
    .stock-type-sale { background: #f3f4f6; color: #6b7280; }
    :is(.dark) .stock-type-entry { background: rgba(5,150,105,0.15); }
    :is(.dark) .stock-type-correction { background: rgba(217,119,6,0.15); }
    :is(.dark) .stock-type-transfer_in { background: rgba(37,99,235,0.15); }
    :is(.dark) .stock-type-transfer_out { background: rgba(220,38,38,0.15); }
    :is(.dark) .stock-type-sale { background: rgba(107,114,128,0.15); }
    /* Sevk kartları */
    .stock-transfer-card { border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 12px; overflow: hidden; }
    :is(.dark) .stock-transfer-card { border-color: rgb(55,65,81); }
    .stock-transfer-incoming { border-left: 3px solid #10b981; }
    .stock-transfer-outgoing { border-left: 3px solid #f59e0b; }
    .stock-transfer-header { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font-size: 13px; }
    .stock-transfer-dir { font-size: 11px; padding: 2px 8px; border-radius: 4px; margin-right: 6px; font-weight: 600; }
    .stock-transfer-incoming .stock-transfer-dir { background: #ecfdf5; color: #059669; }
    .stock-transfer-outgoing .stock-transfer-dir { background: #fffbeb; color: #d97706; }
    .stock-transfer-note { padding: 4px 14px; font-size: 12px; color: #6b7280; font-style: italic; }
    .stock-transfer-items-table { margin: 0; }
    .stock-transfer-actions { padding: 10px 14px; display: flex; gap: 8px; justify-content: flex-end; }
    .stock-badge-pending { display: inline-block; background: #fffbeb; color: #d97706; font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 6px; border: 1px solid #fde68a; }
    :is(.dark) .stock-badge-pending { background: rgba(217,119,6,0.15); border-color: rgba(217,119,6,0.3); }
    .stock-transfer-items-label { font-size: 12px; font-weight: 600; color: #374151; margin: 12px 0 6px; }
    :is(.dark) .stock-transfer-items-label { color: #d1d5db; }
    /* === TOPLU GÜNCELLEME === */
    .bulk-page { display: flex; flex-direction: column; gap: 16px; }
    .bulk-title { font-weight: 600; font-size: 15px; }
    .bulk-modal-xl { max-width: 95vw; }
    .bulk-type-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
    .bulk-type-btn { padding: 16px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; cursor: pointer; font-size: 13px; font-weight: 600; text-align: center; transition: all 0.15s; }
    .bulk-type-btn:hover { border-color: #3b82f6; background: #eff6ff; color: #2563eb; }
    :is(.dark) .bulk-type-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #e5e7eb; }
    :is(.dark) .bulk-type-btn:hover { border-color: #3b82f6; background: rgba(37,99,235,0.15); }
    .bulk-method-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .bulk-method-btn { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 24px 16px; border: 2px solid #e5e7eb; border-radius: 10px; background: #fff; cursor: pointer; transition: all 0.15s; }
    .bulk-method-btn:hover { border-color: #3b82f6; background: #eff6ff; }
    :is(.dark) .bulk-method-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    :is(.dark) .bulk-method-btn:hover { border-color: #3b82f6; background: rgba(37,99,235,0.15); }
    .bulk-method-logo { width: 48px; height: 48px; object-fit: contain; }
    .bulk-method-btn strong { font-size: 15px; }
    .bulk-panel-body { max-height: 70vh; overflow: auto; padding: 0 !important; }
    .bulk-panel-table-wrap { overflow-x: auto; }
    .bulk-panel-table { font-size: 12px; }
    .bulk-panel-table th { position: sticky; top: 0; z-index: 2; background: #f9fafb; white-space: nowrap; }
    :is(.dark) .bulk-panel-table th { background: rgb(17,24,39); }
    .bulk-panel-readonly { color: #6b7280; font-size: 12px; white-space: nowrap; }
    .bulk-panel-input { width: 100%; min-width: 80px; padding: 3px 6px; border: 1px solid #e5e7eb; border-radius: 4px; font-size: 12px; background: #fff; color: #111; }
    :is(.dark) .bulk-panel-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .bulk-panel-input-num { width: 80px; text-align: right; }
    .bulk-panel-select { padding: 3px 4px; border: 1px solid #e5e7eb; border-radius: 4px; font-size: 12px; background: #fff; }
    :is(.dark) .bulk-panel-select { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .bulk-method-grid-2 { grid-template-columns: 1fr 1fr; }
    .bulk-method-btn-ai { border-color: #d97706; }
    .bulk-method-btn-ai:hover { border-color: #b45309; background: #fffbeb; }
    :is(.dark) .bulk-method-btn-ai:hover { background: rgba(217,119,6,0.15); }
    .bulk-ai-info { background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: 12px 16px; margin-bottom: 16px; font-size: 13px; color: #92400e; }
    :is(.dark) .bulk-ai-info { background: rgba(217,119,6,0.1); border-color: rgba(217,119,6,0.3); color: #fbbf24; }
    .bulk-ai-category { border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 10px; overflow: hidden; }
    :is(.dark) .bulk-ai-category { border-color: rgb(55,65,81); }
    .bulk-ai-category-header { padding: 10px 14px; background: #f9fafb; }
    :is(.dark) .bulk-ai-category-header { background: rgb(17,24,39); }
    .bulk-ai-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 24px; text-align: center; width: 100%; }
    .bulk-ai-loading-icon { margin-bottom: 16px; }
    .bulk-ai-spinner { width: 48px; height: 48px; animation: bulk-ai-pulse 1.5s ease-in-out infinite; }
    @keyframes bulk-ai-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.08); opacity: 0.7; } }
    .bulk-ai-loading-title { font-size: 16px; font-weight: 700; margin-bottom: 4px; }
    .bulk-ai-loading-desc { font-size: 12px; color: #6b7280; margin-bottom: 16px; }
    .bulk-ai-loading-steps { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; text-align: center; }
    .bulk-ai-step-item { font-size: 12px; padding: 5px 12px; border-radius: 6px; color: #9ca3af; }
    .bulk-ai-step-done { color: #059669; background: #ecfdf5; }
    :is(.dark) .bulk-ai-step-done { background: rgba(5,150,105,0.15); }
    .bulk-ai-step-active { color: #d97706; background: #fffbeb; font-weight: 600; animation: bulk-ai-pulse 1.5s ease-in-out infinite; }
    :is(.dark) .bulk-ai-step-active { background: rgba(217,119,6,0.15); }
    .bulk-ai-row-new { background: #fffbeb; }
    :is(.dark) .bulk-ai-row-new { background: rgba(217,119,6,0.05); }
    .bulk-ai-upload-grid { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: center; }
    .bulk-ai-upload-col { display: flex; flex-direction: column; gap: 8px; }
    .bulk-ai-upload-col-title { font-size: 13px; font-weight: 600; color: #374151; }
    :is(.dark) .bulk-ai-upload-col-title { color: #d1d5db; }
    .bulk-ai-upload-col-qr { align-items: center; text-align: center; }
    .bulk-ai-upload-divider { display: flex; align-items: center; justify-content: center; }
    .bulk-ai-upload-divider span { font-size: 12px; color: #9ca3af; background: #fff; padding: 8px 0; }
    :is(.dark) .bulk-ai-upload-divider span { background: rgb(31,41,55); }
    .bulk-ai-qr-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; }
    .bulk-ai-qr-img { width: 160px; height: 160px; border-radius: 8px; border: 1px solid #e5e7eb; }
    .bulk-ai-qr-timer { font-size: 12px; color: #d97706; font-weight: 600; animation: bulk-ai-pulse 1.5s ease-in-out infinite; }
    .bulk-ai-row-disabled { opacity: 0.4; }
    .bulk-ai-create-table-wrap { overflow-x: auto; }
    .bulk-ai-create-table { table-layout: fixed; width: 100%; }
    .bulk-ai-col-check { width: 36px; }
    .bulk-ai-col-name { width: 30%; }
    .bulk-ai-col-price { width: 80px; }
    .bulk-ai-col-desc { width: auto; }
    .bulk-ai-col-mod { width: 90px; }
    .bulk-ai-col-edit { width: 36px; }
    .bulk-ai-col-desc-text { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 0; }
    .bulk-ai-cat-row { background: #f9fafb; }
    :is(.dark) .bulk-ai-cat-row { background: rgb(17,24,39); }
    .bulk-ai-cat-name { font-size: 13px; padding: 8px 10px !important; }
    .bulk-ai-edit-btn { background: none; border: none; cursor: pointer; font-size: 14px; color: #6b7280; padding: 2px 6px; }
    .bulk-ai-edit-btn:hover { color: #3b82f6; }
    .bulk-ai-match-select { min-width: 180px; font-size: 11px; }
    .bulk-ai-dup-warn { display: inline-block; background: #fef3c7; color: #92400e; font-size: 10px; padding: 1px 6px; border-radius: 4px; margin-left: 4px; font-weight: 600; }
    :is(.dark) .bulk-ai-dup-warn { background: rgba(217,119,6,0.2); }
    .bulk-ai-file-list { margin-top: 6px; display: flex; flex-direction: column; gap: 2px; }
    .bulk-ai-file-item { font-size: 11px; color: #374151; padding: 3px 8px; background: #f9fafb; border-radius: 4px; }
    :is(.dark) .bulk-ai-file-item { background: rgb(17,24,39); color: #d1d5db; }
    .bulk-ai-mod-wrap { position: relative; }
    .bulk-ai-mod-detail { position: absolute; right: 0; top: 100%; z-index: 20; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); padding: 8px 0; min-width: 180px; text-align: left; }
    :is(.dark) .bulk-ai-mod-detail { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .bulk-ai-mod-group { font-size: 11px; font-weight: 700; padding: 4px 12px; color: #374151; border-bottom: 1px solid #f3f4f6; }
    :is(.dark) .bulk-ai-mod-group { color: #d1d5db; border-color: rgb(55,65,81); }
    .bulk-ai-mod-opt { font-size: 11px; padding: 3px 12px 3px 20px; color: #6b7280; }
    .bulk-ai-mod-opt span { color: #059669; font-weight: 600; margin-left: 4px; }
    .bulk-ai-memory { background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 10px 16px; margin-bottom: 12px; font-size: 12px; color: #1d4ed8; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    :is(.dark) .bulk-ai-memory { background: rgba(37,99,235,0.1); border-color: rgba(37,99,235,0.3); color: #93c5fd; }
    .bulk-panel-group-row th { font-size: 12px; font-weight: 700; text-align: center; padding: 6px 8px; }
    .bulk-panel-group-th { border-bottom: 2px solid rgba(0,0,0,0.1); }
    .bulk-menu-options { display: flex; flex-direction: column; gap: 6px; max-height: 250px; overflow-y: auto; border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px 14px; }
    :is(.dark) .bulk-menu-options { border-color: rgb(55,65,81); }
    .bulk-menu-option { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; padding: 4px 0; }
    .bulk-menu-option input[type="checkbox"] { accent-color: #3b82f6; }
    .bulk-upload-steps { display: flex; flex-direction: column; gap: 20px; }
    .bulk-step { display: flex; gap: 14px; align-items: flex-start; }
    .bulk-step-num { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #3b82f6; color: #fff; font-size: 13px; font-weight: 700; flex-shrink: 0; margin-top: 2px; }
    .bulk-step p { margin: 4px 0 8px; }
    .bulk-upload-row { display: flex; gap: 8px; align-items: center; }
    .bulk-preview-body { max-height: 60vh; overflow-y: auto; }
    .bulk-preview-errors { background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 12px 16px; margin-bottom: 12px; }
    :is(.dark) .bulk-preview-errors { background: rgba(220,38,38,0.1); border-color: rgba(220,38,38,0.3); }
    .bulk-preview-errors strong { font-size: 13px; color: #dc2626; display: block; margin-bottom: 6px; }
    .bulk-error-row { font-size: 12px; color: #991b1b; padding: 2px 0; }
    :is(.dark) .bulk-error-row { color: #fca5a5; }
    .bulk-preview-info { background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 10px 16px; margin-bottom: 12px; font-size: 13px; font-weight: 600; color: #1d4ed8; }
    :is(.dark) .bulk-preview-info { background: rgba(37,99,235,0.1); border-color: rgba(37,99,235,0.3); color: #93c5fd; }
    .bulk-preview-table-wrap { overflow-x: auto; }
    .bulk-preview-id { font-weight: 700; color: #6b7280; vertical-align: top; }
    .bulk-old-value { color: #dc2626; text-decoration: line-through; font-size: 12px; }
    .bulk-new-value { color: #059669; font-weight: 600; font-size: 12px; }
    .bulk-result-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
    .bulk-result-card { text-align: center; padding: 20px; border-radius: 10px; font-size: 13px; font-weight: 600; }
    .bulk-result-num { font-size: 2rem; font-weight: 700; margin-bottom: 4px; }
    .bulk-result-success { background: #ecfdf5; color: #059669; }
    .bulk-result-error { background: #fef2f2; color: #dc2626; }
    :is(.dark) .bulk-result-success { background: rgba(5,150,105,0.15); }
    :is(.dark) .bulk-result-error { background: rgba(220,38,38,0.15); }
    /* === MEDYA KÜTÜPHANESİ === */
    .media-lib-thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; border: 1px solid #e5e7eb; }
    :is(.dark) .media-lib-thumb { border-color: rgb(55,65,81); }

    /* === MEDYA GALERİSİ === */
    .media-gallery-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 100; display: flex; align-items: center; justify-content: center; padding: 20px; }
    .media-gallery-modal { background: #fff; border-radius: 12px; width: 100%; max-width: 700px; max-height: 80vh; display: flex; flex-direction: column; overflow: hidden; }
    :is(.dark) .media-gallery-modal { background: rgb(24,30,42); }
    .media-gallery-header { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid #e5e7eb; }
    :is(.dark) .media-gallery-header { border-color: rgb(55,65,81); }
    .media-gallery-header h3 { font-weight: 600; font-size: 15px; white-space: nowrap; }
    .media-gallery-search-wrap { flex: 1; }
    .media-gallery-search { width: 100%; padding: 7px 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 13px; outline: none; background: #f9fafb; }
    :is(.dark) .media-gallery-search { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .media-gallery-body { flex: 1; overflow-y: auto; padding: 12px; }
    .media-gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
    .media-gallery-item { border-radius: 8px; overflow: hidden; cursor: pointer; border: 2px solid transparent; transition: all 0.15s; background: #f3f4f6; aspect-ratio: 1; position: relative; }
    .media-gallery-item:hover { border-color: #3b82f6; transform: scale(1.03); }
    :is(.dark) .media-gallery-item { background: rgb(31,41,55); }
    .media-gallery-item img { width: 100%; height: 100%; object-fit: cover; }
    .media-gallery-item-name { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.6); color: #fff; font-size: 10px; padding: 3px 6px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .media-gallery-item-selected { border-color: #3b82f6 !important; box-shadow: 0 0 0 2px rgba(59,130,246,0.3); }
    .media-gallery-check { position: absolute; top: 6px; right: 6px; background: #3b82f6; color: #fff; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
    .media-gallery-footer { display: flex; justify-content: space-between; align-items: center; padding: 10px 16px; border-top: 1px solid #e5e7eb; }
    :is(.dark) .media-gallery-footer { border-color: rgb(55,65,81); }
    .media-gallery-btn { background: none; border: 1px dashed #d1d5db; border-radius: 6px; padding: 6px 12px; font-size: 12px; color: #6b7280; cursor: pointer; width: 100%; transition: all 0.15s; }
    .media-gallery-btn:hover { border-color: #3b82f6; color: #3b82f6; background: #eff6ff; }
    :is(.dark) .media-gallery-btn { border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .media-gallery-btn:hover { border-color: #3b82f6; color: #60a5fa; background: rgba(37,99,235,0.1); }
    .media-gallery-selected { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
    .media-gallery-selected-item { display: flex; align-items: center; justify-content: space-between; background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: 6px; padding: 4px 8px; font-size: 11px; }
    :is(.dark) .media-gallery-selected-item { background: rgba(5,150,105,0.15); border-color: rgba(5,150,105,0.3); }
    .media-gallery-selected-name { color: #059669; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
    .media-gallery-selected-remove { background: none; border: none; color: #ef4444; cursor: pointer; font-size: 12px; padding: 0 4px; }
    .media-gallery-upload-box { position: relative; display: flex !important; border: 2px dashed #3b82f6; border-radius: 8px; cursor: pointer; aspect-ratio: 1; transition: all 0.15s; background: #eff6ff; overflow: hidden; }
    .media-gallery-upload-box:hover { border-color: #2563eb; background: #dbeafe; }
    :is(.dark) .media-gallery-upload-box { background: rgba(37,99,235,0.1); border-color: rgba(59,130,246,0.5); }
    :is(.dark) .media-gallery-upload-box:hover { background: rgba(37,99,235,0.2); }
    .media-gallery-upload-input { display: none; }
    .media-gallery-upload-content { position: absolute; inset: 0; display: flex !important; flex-direction: column; align-items: center; justify-content: center; }
    .media-gallery-upload-icon { font-size: 40px; color: #3b82f6; font-weight: 300; line-height: 1; }
    .media-gallery-upload-text { font-size: 13px; color: #2563eb; margin-top: 4px; font-weight: 700; }
    .media-gallery-upload-hint { font-size: 10px; color: #93c5fd; margin-top: 2px; }
    .media-gallery-upload-dragover { border-color: #2563eb !important; background: #dbeafe !important; transform: scale(1.03); }
    :is(.dark) .media-gallery-upload-dragover { background: rgba(37,99,235,0.25) !important; }
    .media-gallery-upload-loading { font-size: 12px; color: #3b82f6; font-weight: 600; }
    .image-picker-section-label { font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 4px; margin-top: 8px; }
    :is(.dark) .image-picker-section-label { color: #d1d5db; }
    /* === IMAGE PICKER === */
    .image-picker { margin-bottom: 4px; }
    .image-picker-preview { position: relative; border-radius: 8px; overflow: hidden; border: 1px solid #e5e7eb; }
    :is(.dark) .image-picker-preview { border-color: rgb(55,65,81); }
    .image-picker-img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
    .image-picker-remove { position: absolute; top: 6px; right: 6px; background: rgba(0,0,0,0.6); color: #fff; border: none; border-radius: 50%; width: 26px; height: 26px; font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    .image-picker-remove:hover { background: #ef4444; }
    .image-picker-actions { display: flex; gap: 6px; margin-top: 6px; }
    .image-picker-btn-gallery { width: 100%; padding: 10px; border: 1px dashed #d1d5db; border-radius: 8px; background: #f9fafb; font-size: 13px; color: #6b7280; cursor: pointer; transition: all 0.15s; }
    .image-picker-btn-gallery:hover { border-color: #3b82f6; color: #3b82f6; background: #eff6ff; }
    :is(.dark) .image-picker-btn-gallery { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .image-picker-btn-gallery:hover { border-color: #3b82f6; color: #60a5fa; }
    .image-picker-btn-sm { flex: 1; padding: 6px; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; font-size: 11px; color: #6b7280; cursor: pointer; text-align: center; }
    .image-picker-btn-sm:hover { border-color: #3b82f6; color: #3b82f6; }
    :is(.dark) .image-picker-btn-sm { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #9ca3af; }
    /* FileUpload gizle (galeriden seçiliyken) */
    .image-picker-upload { transition: all 0.2s; }
    .media-gallery-main-preview { position: relative; border-radius: 8px; overflow: hidden; border: 1px solid #e5e7eb; margin-bottom: 6px; }
    .media-gallery-main-img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
    .media-gallery-main-remove { position: absolute; top: 6px; right: 6px; background: rgba(0,0,0,0.6); color: #fff; border: none; border-radius: 50%; width: 24px; height: 24px; font-size: 13px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    .media-gallery-main-remove:hover { background: #ef4444; }
    .media-gallery-main-label { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.5); color: #fff; font-size: 11px; text-align: center; padding: 4px; }
    .media-gallery-preview-row { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
    .media-gallery-preview-item { position: relative; width: 56px; height: 56px; border-radius: 6px; overflow: hidden; border: 1px solid #e5e7eb; }
    .media-gallery-preview-img { width: 100%; height: 100%; object-fit: cover; }
    .media-gallery-preview-remove { position: absolute; top: 2px; right: 2px; background: rgba(0,0,0,0.6); color: #fff; border: none; border-radius: 50%; width: 16px; height: 16px; font-size: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    .media-gallery-loadmore { text-align: center; padding: 12px 0; }
    .media-gallery-loadmore-btn { background: #f3f4f6; border: 1px solid #d1d5db; border-radius: 8px; padding: 8px 20px; font-size: 12px; color: #374151; cursor: pointer; }
    .media-gallery-loadmore-btn:hover { background: #e5e7eb; }
    :is(.dark) .media-gallery-loadmore-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #d1d5db; }
    @media (max-width: 640px) { .media-gallery-grid { grid-template-columns: repeat(3, 1fr); } }

    /* === RAPORLAR === */
    .rp-page { display: flex; flex-direction: column; gap: 12px; }
    .rp-filters { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
    .rp-filter-group { display: flex; flex-direction: column; gap: 3px; }
    .rp-filter-label { font-size: 10px; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: 0.5px; }
    .rp-filters input[type="date"], .rp-filters select, .rp-filters .rp-branch-btn { padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; color: #111; min-width: 0; }
    :is(.dark) .rp-filters input[type="date"], :is(.dark) .rp-filters select, :is(.dark) .rp-filters .rp-branch-btn { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-filters input[type="date"]:focus, .rp-filters select:focus { border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
    /* === Branch Switcher (sağ üst) === */
    .bs-wrap { display: flex; align-items: center; gap: 6px; position: relative; }
    .bs-branch-indicator { display: flex; align-items: center; gap: 8px; padding: 5px 8px 5px 12px; background: #16a34a; color: #fff; border-radius: 10px; font-size: 13px; font-weight: 600; }
    .bs-indicator-icon { width: 16px; height: 16px; flex-shrink: 0; }
    .bs-indicator-name { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .bs-indicator-back { display: flex; align-items: center; padding: 3px; border-radius: 6px; border: none; cursor: pointer; background: rgba(255,255,255,0.2); color: #fff; transition: background 0.15s; }
    .bs-indicator-back:hover { background: rgba(255,255,255,0.35); }
    .bs-trigger-on-branch { border-color: transparent; background: rgba(22,163,74,0.1); color: #16a34a; }
    .bs-trigger-on-branch:hover { background: rgba(22,163,74,0.15); }
    :is(.dark) .bs-trigger-on-branch { background: rgba(22,163,74,0.15); color: #4ade80; }
    :is(.dark) .bs-trigger-on-branch:hover { background: rgba(22,163,74,0.2); }
    .bs-trigger { display: flex; align-items: center; gap: 8px; padding: 6px 14px; font-size: 13px; font-weight: 500; border-radius: 10px; border: 1px solid rgba(0,0,0,0.1); cursor: pointer; background: rgba(0,0,0,0.04); color: inherit; transition: all 0.15s; }
    .bs-trigger:hover { background: rgba(0,0,0,0.08); }
    :is(.dark) .bs-trigger { border-color: rgba(255,255,255,0.1); background: rgba(255,255,255,0.05); }
    :is(.dark) .bs-trigger:hover { background: rgba(255,255,255,0.1); }
    .bs-trigger-icon { width: 16px; height: 16px; color: #6b7280; }
    .bs-trigger-name { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .bs-trigger-arrow { width: 14px; height: 14px; color: #9ca3af; transition: transform 0.2s; }
    .bs-trigger-arrow-open { transform: rotate(180deg); }
    .bs-dropdown { position: absolute; right: 0; top: 100%; margin-top: 6px; width: 300px; background: #fff; border-radius: 14px; box-shadow: 0 12px 48px rgba(0,0,0,0.15); border: 1px solid rgba(0,0,0,0.06); z-index: 9999; overflow: hidden; }
    :is(.dark) .bs-dropdown { background: rgb(31,41,55); border-color: rgb(55,65,81); box-shadow: 0 12px 48px rgba(0,0,0,0.4); }
    .bs-search-wrap { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid #f3f4f6; }
    :is(.dark) .bs-search-wrap { border-color: rgb(55,65,81); }
    .bs-search-icon { width: 16px; height: 16px; color: #9ca3af; flex-shrink: 0; }
    .bs-search-input { flex: 1; border: none; outline: none; font-size: 13px; background: transparent; color: inherit; }
    .bs-search-input::placeholder { color: #9ca3af; }
    .bs-list { max-height: 280px; overflow-y: auto; padding: 4px 0; }
    .bs-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 14px; font-size: 13px; border: none; cursor: pointer; background: transparent; color: #374151; text-align: left; transition: background 0.1s; }
    .bs-item:hover { background: #f3f4f6; }
    :is(.dark) .bs-item { color: #d1d5db; }
    :is(.dark) .bs-item:hover { background: rgb(55,65,81); }
    .bs-item-active { background: #f0fdf4; color: #16a34a; font-weight: 600; }
    :is(.dark) .bs-item-active { background: rgba(22,163,74,0.1); color: #4ade80; }
    .bs-item-active:hover { background: #dcfce7; }
    :is(.dark) .bs-item-active:hover { background: rgba(22,163,74,0.15); }
    .bs-item-icon { width: 16px; height: 16px; color: #9ca3af; flex-shrink: 0; }
    .bs-item-active .bs-item-icon { color: #16a34a; }
    :is(.dark) .bs-item-active .bs-item-icon { color: #4ade80; }
    .bs-item-check { width: 16px; height: 16px; margin-left: auto; color: #16a34a; }
    :is(.dark) .bs-item-check { color: #4ade80; }
    .bs-divider { height: 1px; background: #f3f4f6; margin: 4px 0; }
    :is(.dark) .bs-divider { background: rgb(55,65,81); }
    .bs-empty { padding: 16px; text-align: center; font-size: 13px; color: #9ca3af; }
    .bs-single { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #6b7280; }
    .bs-single-icon { width: 16px; height: 16px; }

    .rp-branch-btn-required { border-color: #f59e0b; animation: rp-pulse-border 2s infinite; }
    @keyframes rp-pulse-border { 0%,100% { border-color: #f59e0b; } 50% { border-color: #3b82f6; } }
    .rp-branch-placeholder { color: #9ca3af; font-style: italic; }
    .rp-branch-required-msg { display: flex; align-items: center; gap: 16px; padding: 24px; }
    .rp-branch-required-icon { width: 48px; height: 48px; color: #f59e0b; flex-shrink: 0; }
    .rp-branch-required-title { font-size: 16px; font-weight: 700; color: #374151; margin: 0; }
    :is(.dark) .rp-branch-required-title { color: #e5e7eb; }
    .rp-branch-required-desc { font-size: 14px; color: #6b7280; margin: 4px 0 0; }
    .rp-cards-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .rp-card-value { font-size: 1.6rem; font-weight: 700; color: #111; }
    :is(.dark) .rp-card-value { color: #e5e7eb; }
    .rp-card-label { font-size: 0.75rem; color: #6b7280; margin-top: 2px; }
    .rp-val-blue { color: #3b82f6 !important; font-weight: 600; }
    .rp-val-amber { color: #f59e0b !important; font-weight: 600; }
    .rp-val-danger { color: #ef4444; font-weight: 600; }
    .rp-detail-grid { display: flex; flex-direction: column; gap: 6px; }
    .rp-detail-row { display: flex; justify-content: space-between; padding: 8px 12px; background: #f9fafb; border-radius: 6px; font-size: 13px; }
    :is(.dark) .rp-detail-row { background: rgb(17,24,39); }
    .rp-extra-filters { display: contents; }
    .rp-extra-filters select { padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; color: #111; }
    :is(.dark) .rp-extra-filters select { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-trend { font-size: 11px; font-weight: 600; margin-top: 2px; }
    @media (max-width: 768px) { .rp-cards-grid { grid-template-columns: repeat(2, 1fr); } }
    .rp-trend-up { color: #059669; }
    .rp-trend-down { color: #dc2626; }
    .rp-summary-detail { padding: 0 16px 16px; display: flex; flex-direction: column; gap: 6px; }
    .rp-summary-row { display: flex; justify-content: space-between; padding: 6px 12px; background: #f9fafb; border-radius: 6px; font-size: 13px; }
    :is(.dark) .rp-summary-row { background: rgb(17,24,39); }
    /* Heatmap */
    .hm-stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .hm-stat-card { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 16px 20px; }
    :is(.dark) .hm-stat-card { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .hm-stat-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .hm-stat-label { font-size: 12px; color: #6b7280; font-weight: 500; }
    .hm-stat-value { font-size: 20px; font-weight: 700; color: #111827; }
    :is(.dark) .hm-stat-value { color: #e5e7eb; }
    @media (max-width: 768px) { .hm-stats-row { grid-template-columns: repeat(2, 1fr); } }

    .hm-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
    .hm-toggle-btns { display: flex; gap: 4px; }
    .hm-toggle-btn { display: flex; align-items: center; gap: 6px; padding: 8px 16px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: #6b7280; font-size: 13px; font-weight: 500; cursor: pointer; }
    .hm-toggle-btn:hover { border-color: #3b82f6; color: #2563eb; }
    .hm-toggle-active { background: #2563eb; color: #fff; border-color: #2563eb; }
    .hm-toggle-active:hover { background: #1d4ed8; }
    :is(.dark) .hm-toggle-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .hm-toggle-active { background: #2563eb; color: #fff; border-color: #2563eb; }

    .hm-legend { display: flex; align-items: center; gap: 8px; }
    .hm-legend-label { font-size: 11px; color: #9ca3af; font-weight: 500; }
    .hm-legend-bar { width: 160px; height: 12px; border-radius: 6px; background: linear-gradient(to right, #f1f5f9, #bfdbfe, #60a5fa, #2563eb, #1e40af, #7c2d12, #dc2626); }

    .hm-grid { display: grid; grid-template-columns: 48px repeat(24, 1fr); gap: 2px; position: relative; }
    .hm-corner { }
    .hm-hour-label { text-align: center; font-size: 11px; font-weight: 600; color: #6b7280; padding: 4px 0; }
    .hm-day-label { display: flex; align-items: center; font-size: 13px; font-weight: 600; color: #374151; padding-right: 8px; }
    :is(.dark) .hm-day-label { color: #d1d5db; }
    .hm-cell { display: flex; align-items: center; justify-content: center; border-radius: 4px; font-size: 10px; font-weight: 600; min-height: 36px; cursor: default; transition: transform 0.1s, box-shadow 0.1s; }
    .hm-cell:hover { transform: scale(1.15); box-shadow: 0 4px 12px rgba(0,0,0,0.15); z-index: 10; position: relative; }

    .hm-tooltip { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0,0,0,0.85); color: #fff; padding: 10px 16px; border-radius: 8px; font-size: 13px; font-weight: 500; pointer-events: none; z-index: 100; white-space: nowrap; }

    .rp-charts-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 16px; }
    .rp-charts-grid > div { min-width: 0; }
    .rp-charts-grid [data-chart-type="doughnut"] canvas { margin: 0 auto; }
    .rp-charts-grid [data-chart-type="pie"] canvas { margin: 0 auto; }
    @media (max-width: 768px) { .rp-charts-grid { grid-template-columns: 1fr !important; } }
    .rp-chart-wrap { padding: 16px; }
    .rp-chart-large { padding: 16px 16px 0; }
    .rp-two-tables { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 16px; }
    .rp-table-title { font-size: 14px; font-weight: 600; margin-bottom: 8px; color: #374151; }
    :is(.dark) .rp-table-title { color: #e5e7eb; }

    .fi-ta-table .fi-ta-cell { padding: 14px 16px; }

    /* Şube seçici */
    .rp-filter-branch { position: relative; z-index: 20; }
    .rp-branch-btn { text-align: left; min-width: 200px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; white-space: nowrap; }
    .rp-branch-btn::after { content: '▾'; font-size: 10px; color: #9ca3af; margin-left: 8px; }
    .rp-branch-dropdown { position: absolute; top: 100%; left: 0; z-index: 20; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); min-width: 280px; margin-top: 4px; }
    :is(.dark) .rp-branch-dropdown { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .rp-branch-search-wrap { padding: 8px 10px; border-bottom: 1px solid #e5e7eb; }
    :is(.dark) .rp-branch-search-wrap { border-color: rgb(55,65,81); }
    .rp-branch-search { width: 100%; padding: 7px 10px; border: 1px solid #e5e7eb; border-radius: 6px; font-size: 12px; outline: none; background: #f9fafb; }
    :is(.dark) .rp-branch-search { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-branch-search:focus { border-color: #3b82f6; }
    .rp-branch-list { max-height: 250px; overflow-y: auto; padding: 4px 0; }
    .rp-branch-option { display: flex; align-items: center; gap: 8px; padding: 7px 14px; font-size: 13px; cursor: pointer; white-space: nowrap; }
    .rp-branch-option:hover { background: #f3f4f6; }
    :is(.dark) .rp-branch-option:hover { background: rgb(55,65,81); }
    .rp-branch-option-all { border-bottom: 1px solid #e5e7eb; padding: 8px 14px; }
    :is(.dark) .rp-branch-option-all { border-color: rgb(55,65,81); }
    .rp-branch-option input[type="checkbox"] { accent-color: #3b82f6; flex-shrink: 0; }
    .rp-branch-option span { overflow: hidden; text-overflow: ellipsis; }
    .rp-export-btn { padding: 8px 14px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; color: #374151; cursor: pointer; font-weight: 500; white-space: nowrap; }
    .rp-export-btn:hover { background: #f3f4f6; border-color: #9ca3af; }
    :is(.dark) .rp-export-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-breakdown-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    @media (max-width: 768px) { .rp-breakdown-grid { grid-template-columns: 1fr; } }
    .rp-day-nav { display: flex; align-items: center; gap: 4px; }
    .rp-day-btn { padding: 7px 6px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: #374151; cursor: pointer; display: flex; align-items: center; }
    .rp-day-btn:hover { background: #f3f4f6; border-color: #9ca3af; }
    :is(.dark) .rp-day-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-day-btn-disabled { opacity: 0.3; cursor: default; }
    .rp-day-btn-disabled:hover { background: #fff; }
    :is(.dark) .rp-day-btn-disabled:hover { background: rgb(31,41,55); }
    .rp-day-icon { width: 16px; height: 16px; }
    .rp-day-input { padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; color: #111; }
    :is(.dark) .rp-day-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-day-input:focus { border-color: #3b82f6; outline: none; }
    .rp-day-today-btn-outline { padding: 7px 12px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: #6b7280; cursor: pointer; font-size: 12px; font-weight: 500; }
    .rp-day-today-btn-outline:hover { border-color: #3b82f6; color: #2563eb; background: #eff6ff; }
    :is(.dark) .rp-day-today-btn-outline { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .rp-day-today-btn-outline:hover { border-color: #3b82f6; color: #60a5fa; background: rgba(59,130,246,0.1); }
    .rp-day-label { font-size: 14px; font-weight: 600; color: #374151; }
    :is(.dark) .rp-day-label { color: #e5e7eb; }
    .rp-live-toggle { display: flex; align-items: center; gap: 6px; cursor: pointer; padding: 9px 12px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; font-size: 13px; color: #374151; user-select: none; line-height: 1; }
    .rp-live-toggle:has(input:checked) { border-color: #3b82f6; background: #eff6ff; color: #2563eb; }
    :is(.dark) .rp-live-toggle { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #e5e7eb; }
    :is(.dark) .rp-live-toggle:has(input:checked) { border-color: #3b82f6; background: rgba(59,130,246,0.1); color: #60a5fa; }
    .rp-live-toggle input[type="checkbox"] { accent-color: #3b82f6; }
    .rp-live-label { font-weight: 500; white-space: nowrap; }
    .rp-live-info { width: 14px; height: 14px; color: #9ca3af; }
    .rp-range-input { padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; color: #111; min-width: 220px; cursor: pointer; }
    :is(.dark) .rp-range-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-range-input:focus { border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
    .rp-date-preset { min-width: 140px; }
    .rp-filter-multi { position: relative; z-index: 40; }
    .rp-multi-btn { min-width: 90px; font-size: 12px; }
    .rp-multi-dropdown { min-width: 180px; padding: 4px 0; }
    .rp-time-range { display: flex; align-items: center; gap: 4px; }
    .rp-time-input { padding: 8px 6px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: #fff; color: #111; width: 90px; }
    :is(.dark) .rp-time-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .rp-time-input:focus { border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
    .rp-time-sep { color: #9ca3af; font-size: 13px; }
    .rp-loading-overlay { position: fixed; inset: 0; z-index: 100; background: rgba(255,255,255,0.7); display: flex; align-items: center; justify-content: center; }
    :is(.dark) .rp-loading-overlay { background: rgba(0,0,0,0.6); }
    .rp-loading-box { display: flex; align-items: center; gap: 12px; background: #fff; padding: 16px 28px; border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.12); font-size: 14px; font-weight: 500; color: #374151; }
    :is(.dark) .rp-loading-box { background: rgb(31,41,55); color: #e5e7eb; box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
    .rp-loading-spinner { width: 24px; height: 24px; }
    .rp-filter-open-btn { padding: 7px 8px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: #6b7280; cursor: pointer; display: flex; align-items: center; }
    .rp-filter-open-btn:hover { background: #eff6ff; border-color: #93c5fd; color: #3b82f6; }
    :is(.dark) .rp-filter-open-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .rp-filter-open-btn:hover { background: rgba(59,130,246,0.1); color: #60a5fa; }
    .rp-reset-btn { padding: 7px 8px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: #6b7280; cursor: pointer; display: flex; align-items: center; }
    .rp-reset-btn:hover { background: #fef2f2; border-color: #fca5a5; color: #dc2626; }
    :is(.dark) .rp-reset-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .rp-reset-btn:hover { background: rgba(220,38,38,0.1); color: #f87171; }
    .rp-reset-icon { width: 16px; height: 16px; }
    .rp-pagination { display: flex; justify-content: space-between; align-items: center; padding: 12px 0 0; font-size: 12px; color: #6b7280; }
    .rp-pagination-left, .rp-pagination-right { display: flex; align-items: center; gap: 8px; }
    @media (max-width: 768px) { .rp-two-tables { grid-template-columns: 1fr; } .rp-filters { gap: 8px; } }

    /* === PLATFORM EŞLEŞTİRME === */
    .pm-tabs { display: flex; gap: 6px; margin-bottom: 12px; flex-wrap: wrap; }
    .pm-tab { padding: 8px 16px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s; color: #374151; }
    .pm-tab:hover { border-color: #3b82f6; color: #2563eb; }
    .pm-tab-active { background: #2563eb; color: #fff; border-color: #2563eb; }
    :is(.dark) .pm-tab { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #d1d5db; }
    :is(.dark) .pm-tab-active { background: #2563eb; color: #fff; border-color: #2563eb; }
    .pm-tab:disabled { opacity: 0.5; cursor: wait; }
    .pm-tab-spinner { display: inline-block; width: 12px; height: 12px; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: pm-spin 0.6s linear infinite; }
    @keyframes pm-spin { to { transform: rotate(360deg); } }
    .pm-disabled { opacity: 0.6; pointer-events: none; }
    .pm-page-loading { position: relative; }
    .pm-loading-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(15,23,42,0.35); backdrop-filter: blur(3px); z-index: 9999; align-items: center; justify-content: center; }
    .pm-loading-box { background: #fff; padding: 20px 28px; border-radius: 14px; box-shadow: 0 12px 40px rgba(0,0,0,0.18); display: flex; align-items: center; gap: 14px; }
    :is(.dark) .pm-loading-box { background: rgb(31,41,55); color: #f3f4f6; }
    .pm-loading-spinner { width: 24px; height: 24px; border: 3px solid #e5e7eb; border-top-color: #2563eb; border-radius: 50%; animation: pm-spin 0.7s linear infinite; }
    :is(.dark) .pm-loading-spinner { border-color: rgb(55,65,81); border-top-color: #60a5fa; }
    .pm-loading-text { font-size: 14px; font-weight: 600; color: #0f172a; }
    :is(.dark) .pm-loading-text { color: #f3f4f6; }
    .pm-matched-name { font-weight: 500; color: #059669; }
    :is(.dark) .pm-matched-name { color: #34d399; }
    .pm-platform-id { font-size: 10px; color: #9ca3af; margin-left: 4px; }
    .pm-badge-matched { display: inline-block; background: #ecfdf5; color: #059669; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 4px; }
    :is(.dark) .pm-badge-matched { background: rgba(5,150,105,0.15); }
    .pm-badge-unmatched { display: inline-block; background: #fef2f2; color: #dc2626; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 4px; }
    :is(.dark) .pm-badge-unmatched { background: rgba(220,38,38,0.15); }
    .pm-actions { display: flex; gap: 4px; justify-content: center; }
    .pm-action-btn { background: none; border: none; cursor: pointer; font-size: 14px; color: #6b7280; padding: 4px 6px; border-radius: 4px; }
    .pm-action-btn:hover { color: #3b82f6; background: #eff6ff; }
    .pm-action-remove:hover { color: #ef4444; background: #fef2f2; }
    .pm-match-list { display: flex; flex-direction: column; gap: 4px; max-height: 400px; overflow-y: auto; }
    .pm-match-item { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; cursor: pointer; transition: all 0.15s; text-align: left; }
    .pm-match-item:hover { border-color: #3b82f6; background: #eff6ff; }
    :is(.dark) .pm-match-item { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    :is(.dark) .pm-match-item:hover { border-color: #3b82f6; background: rgba(37,99,235,0.1); }
    .pm-match-item-current { border-color: #10b981; background: #ecfdf5; }
    .pm-match-item-name { font-size: 13px; font-weight: 500; }
    .pm-match-item-id { font-size: 11px; color: #9ca3af; }

    /* === RESTAPP ASISTAN === */
    .ra-assistant-fab { position: fixed; bottom: 24px; right: 24px; z-index: 200; width: 56px; height: 56px; border-radius: 50%; background: #111; border: none; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: center; transition: transform 0.2s, box-shadow 0.2s; }
    .ra-assistant-fab:hover { transform: scale(1.08); box-shadow: 0 6px 24px rgba(0,0,0,0.4); }
    .ra-assistant-fab-icon { width: 32px; height: 32px; }
    .ra-assistant-window { position: fixed; bottom: 92px; right: 24px; z-index: 201; width: 380px; max-height: 560px; background: #fff; border-radius: 16px; box-shadow: 0 8px 40px rgba(0,0,0,0.15); display: flex; flex-direction: column; overflow: hidden; animation: ra-slide-up 0.25s ease-out; }
    :is(.dark) .ra-assistant-window { background: rgb(24,30,42); box-shadow: 0 8px 40px rgba(0,0,0,0.4); }
    @keyframes ra-slide-up { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
    .ra-assistant-header { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; background: #111; color: #fff; }
    .ra-assistant-header-left { display: flex; align-items: center; gap: 10px; }
    .ra-assistant-header-logo { width: 32px; height: 32px; }
    .ra-assistant-header-title { font-size: 14px; font-weight: 700; }
    .ra-assistant-header-status { font-size: 10px; opacity: 0.8; }
    .ra-assistant-header-actions { display: flex; gap: 4px; }
    .ra-assistant-header-btn { background: rgba(255,255,255,0.15); border: none; color: #fff; border-radius: 6px; padding: 6px; cursor: pointer; display: flex; align-items: center; }
    .ra-assistant-header-btn:hover { background: rgba(255,255,255,0.25); }
    .ra-assistant-body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; max-height: 380px; min-height: 280px; }
    .ra-assistant-welcome { text-align: center; padding: 20px 0 8px; }
    .ra-assistant-welcome-logo { width: 48px; height: 48px; margin-bottom: 8px; }
    .ra-assistant-welcome-title { font-size: 16px; font-weight: 700; color: #111; }
    :is(.dark) .ra-assistant-welcome-title { color: #e5e7eb; }
    .ra-assistant-welcome-desc { font-size: 13px; color: #6b7280; }
    .ra-assistant-suggestions { display: flex; flex-direction: column; gap: 6px; }
    .ra-assistant-suggestion { background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 10px; padding: 10px 14px; font-size: 13px; text-align: left; cursor: pointer; transition: all 0.15s; color: #374151; }
    .ra-assistant-suggestion:hover { background: #eff6ff; border-color: #bfdbfe; color: #2563eb; }
    :is(.dark) .ra-assistant-suggestion { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #d1d5db; }
    :is(.dark) .ra-assistant-suggestion:hover { background: rgba(37,99,235,0.15); border-color: #3b82f6; }
    .ra-assistant-msg { display: flex; gap: 8px; align-items: flex-start; }
    .ra-assistant-msg-user { justify-content: flex-end; }
    .ra-assistant-msg-avatar { width: 28px; height: 28px; border-radius: 50%; background: #eee; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .ra-assistant-msg-avatar img { width: 18px; height: 18px; }
    .ra-assistant-msg-bubble { max-width: 80%; padding: 10px 14px; border-radius: 14px; font-size: 13px; line-height: 1.5; word-wrap: break-word; }
    .ra-assistant-msg-bubble-user { background: #222; color: #fff; border-bottom-right-radius: 4px; }
    .ra-assistant-msg-bubble-assistant { background: #f3f4f6; color: #111; border-bottom-left-radius: 4px; }
    :is(.dark) .ra-assistant-msg-bubble-assistant { background: rgb(31,41,55); color: #e5e7eb; }
    .ra-assistant-typing { display: inline-flex; gap: 4px; padding: 8px 14px; min-width: 0; max-width: 60px; }
    .ra-assistant-typing span { width: 6px; height: 6px; background: #9ca3af; border-radius: 50%; animation: ra-typing 1.2s ease-in-out infinite; }
    .ra-assistant-typing span:nth-child(2) { animation-delay: 0.2s; }
    .ra-assistant-typing span:nth-child(3) { animation-delay: 0.4s; }
    @keyframes ra-typing { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-6px); } }
    .ra-assistant-confirm { display: flex; gap: 8px; justify-content: center; padding: 4px 0; }
    .ra-assistant-confirm-btn { padding: 8px 18px; border: none; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; }
    .ra-assistant-confirm-yes { background: #10b981; color: #fff; }
    .ra-assistant-confirm-yes:hover { background: #059669; }
    .ra-assistant-confirm-no { background: #f3f4f6; color: #374151; }
    :is(.dark) .ra-assistant-confirm-no { background: rgb(55,65,81); color: #e5e7eb; }
    .ra-assistant-footer { padding: 12px 16px; border-top: 1px solid #f3f4f6; }
    :is(.dark) .ra-assistant-footer { border-color: rgb(55,65,81); }
    .ra-assistant-input-wrap { display: flex; gap: 8px; }
    .ra-assistant-input { flex: 1; padding: 10px 14px; border: 1px solid #e5e7eb; border-radius: 10px; font-size: 13px; outline: none; background: #f9fafb; color: #111; }
    .ra-assistant-input:focus { border-color: #2563eb; background: #fff; }
    :is(.dark) .ra-assistant-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .ra-assistant-send { background: #25d366; border: none; border-radius: 10px; padding: 10px 12px; cursor: pointer; color: #fff; display: flex; align-items: center; }
    .ra-assistant-send:hover { background: #1da851; }
    .ra-assistant-send:disabled { background: #a8e6c1; cursor: default; }
    .ra-assistant-fab-badge { position: absolute; top: -4px; right: -4px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 700; min-width: 18px; height: 18px; border-radius: 9px; display: flex; align-items: center; justify-content: center; padding: 0 4px; border: 2px solid #fff; }
    .ra-assistant-mic { background: none; border: none; cursor: pointer; color: #9ca3af; padding: 8px; display: flex; align-items: center; border-radius: 8px; }
    .ra-assistant-mic:hover { color: #374151; background: #f3f4f6; }
    .ra-assistant-mic-active { color: #ef4444 !important; background: #fef2f2 !important; animation: ra-typing 1s ease-in-out infinite; }
    .ra-assistant-link { color: #2563eb; text-decoration: underline; }
    :is(.dark) .ra-assistant-link { color: #60a5fa; }
    .ra-assistant-notif { background: #fef3c7; border: 1px solid #fde68a; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #92400e; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    :is(.dark) .ra-assistant-notif { background: rgba(217,119,6,0.15); border-color: rgba(217,119,6,0.3); color: #fbbf24; }
    .ra-assistant-notif-btn { background: #f59e0b; color: #fff; border: none; border-radius: 6px; padding: 4px 10px; font-size: 11px; font-weight: 600; cursor: pointer; white-space: nowrap; }
    .ra-assistant-notif-btn:hover { background: #d97706; }
    .ra-assistant-notif-actions { display: flex; gap: 6px; margin-top: 6px; width: 100%; }
    .ra-assistant-options { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
    .ra-assistant-option-btn { background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 8px; padding: 6px 12px; font-size: 12px; cursor: pointer; transition: all 0.15s; text-align: left; color: #374151; display: inline-flex; align-items: center; gap: 6px; }
    .ra-assistant-option-btn:hover { background: #eff6ff; border-color: #bfdbfe; color: #2563eb; }
    :is(.dark) .ra-assistant-option-btn { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #d1d5db; }
    :is(.dark) .ra-assistant-option-btn:hover { background: rgba(37,99,235,0.15); border-color: #3b82f6; }
    .ra-assistant-option-price { font-weight: 600; color: #059669; font-size: 11px; }

    @media (max-width: 768px) {
        .ra-assistant-window { bottom: 0; right: 0; left: 0; width: 100%; max-height: 100vh; border-radius: 16px 16px 0 0; }
        .ra-assistant-body { max-height: calc(100vh - 140px); }
        .stock-summary-row { grid-template-columns: repeat(2, 1fr); }
        .stock-header-bar { flex-direction: column; gap: 8px; align-items: stretch; }
        .stock-header-right { justify-content: flex-end; }
        .stock-bulk-row { flex-wrap: wrap; }
    }
    /* Delivery Areas Settings */
    .delivery-areas-radio-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        cursor: pointer;
    }
    .delivery-areas-radio-input {
        border-radius: 9999px;
        border-color: rgb(209 213 219);
        color: rgb(16 185 129);
    }
    .delivery-areas-radio-input:focus {
        --tw-ring-color: rgb(16 185 129);
    }
    .delivery-areas-grid-2 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    .delivery-areas-grid-3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
        margin-top: 1rem;
    }
    .delivery-areas-field-label {
        display: block;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgb(55 65 81);
        margin-bottom: 0.25rem;
    }
    .dark .delivery-areas-field-label {
        color: rgb(209 213 219);
    }
    .delivery-areas-input-wrapper {
        position: relative;
    }
    .delivery-areas-text-input {
        display: block;
        width: 100%;
        border-radius: 0.5rem;
        border: 1px solid rgb(209 213 219);
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
        box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
        transition: all 75ms;
        background: white;
    }
    .delivery-areas-text-input:focus {
        border-color: rgb(16 185 129);
        outline: none;
        box-shadow: 0 0 0 1px inset rgb(16 185 129);
    }
    .dark .delivery-areas-text-input {
        border-color: rgb(75 85 99);
        background: rgb(55 65 81);
        color: white;
    }
    .delivery-areas-input-suffix {
        position: absolute;
        right: 0.75rem;
        top: 50%;
        transform: translateY(-50%);
        font-size: 0.75rem;
        color: rgb(107 114 128);
        pointer-events: none;
    }
    .delivery-areas-select-input {
        display: block;
        width: 100%;
        border-radius: 0.5rem;
        border: 1px solid rgb(209 213 219);
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
        box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
        transition: all 75ms;
        background: white;
    }
    .delivery-areas-select-input:focus {
        border-color: rgb(16 185 129);
        outline: none;
        box-shadow: 0 0 0 1px inset rgb(16 185 129);
    }
    .delivery-areas-select-input:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }
    .dark .delivery-areas-select-input {
        border-color: rgb(75 85 99);
        background: rgb(55 65 81);
        color: white;
    }
    .delivery-areas-form-card {
        border: 1px solid rgb(229 231 235);
        border-radius: 0.75rem;
        padding: 1.5rem;
        background: rgb(249 250 251);
        space-y: 1rem;
    }
    .dark .delivery-areas-form-card {
        border-color: rgb(55 65 81);
        background: rgb(31 41 55);
    }
    .delivery-areas-form-title {
        font-size: 1rem;
        font-weight: 600;
        color: rgb(17 24 39);
        margin-bottom: 1rem;
    }
    .dark .delivery-areas-form-title {
        color: rgb(243 244 246);
    }
    .delivery-areas-checkbox-container {
        max-height: 12rem;
        overflow-y: auto;
        border: 1px solid rgb(229 231 235);
        border-radius: 0.5rem;
        padding: 0.5rem;
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
        background: white;
    }
    .dark .delivery-areas-checkbox-container {
        border-color: rgb(55 65 81);
        background: rgb(55 65 81);
    }
    .delivery-areas-checkbox-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        cursor: pointer;
    }
    .delivery-areas-checkbox-input {
        border-radius: 0.25rem;
        border-color: rgb(209 213 219);
        color: rgb(16 185 129);
    }
    .delivery-areas-checkbox-input:focus {
        --tw-ring-color: rgb(16 185 129);
    }
    .delivery-areas-toggle-input {
        border-radius: 0.25rem;
        border-color: rgb(209 213 219);
        color: rgb(16 185 129);
    }
    .delivery-areas-empty-text {
        font-size: 0.875rem;
        color: rgb(156 163 175);
        padding: 0.5rem 0;
    }
    .delivery-areas-status-row {
        margin-top: 1rem;
    }
    .delivery-areas-form-actions {
        display: flex;
        justify-content: flex-end;
        gap: 0.5rem;
        margin-top: 1rem;
    }
    .delivery-areas-table-wrapper {
        overflow-x: auto;
        border: 1px solid rgb(229 231 235);
        border-radius: 0.75rem;
    }
    .dark .delivery-areas-table-wrapper {
        border-color: rgb(55 65 81);
    }
    .delivery-areas-table {
        width: 100%;
        font-size: 0.875rem;
        text-align: left;
    }
    .delivery-areas-table-header {
        background: rgb(249 250 251);
        border-bottom: 1px solid rgb(229 231 235);
    }
    .dark .delivery-areas-table-header {
        background: rgb(31 41 55);
        border-color: rgb(55 65 81);
    }
    .delivery-areas-th {
        padding: 0.75rem 1rem;
        font-weight: 600;
        color: rgb(55 65 81);
        white-space: nowrap;
    }
    .dark .delivery-areas-th {
        color: rgb(209 213 219);
    }
    .delivery-areas-th-actions {
        padding: 0.75rem 1rem;
        font-weight: 600;
        color: rgb(55 65 81);
        white-space: nowrap;
        text-align: right;
    }
    .dark .delivery-areas-th-actions {
        color: rgb(209 213 219);
    }
    .delivery-areas-table-body {
        divide-y: 1px;
    }
    .delivery-areas-table-row {
        border-bottom: 1px solid rgb(243 244 246);
        transition: background 75ms;
    }
    .delivery-areas-table-row:hover {
        background: rgb(249 250 251);
    }
    .dark .delivery-areas-table-row {
        border-color: rgb(55 65 81);
    }
    .dark .delivery-areas-table-row:hover {
        background: rgb(31 41 55);
    }
    .delivery-areas-td {
        padding: 0.75rem 1rem;
        white-space: nowrap;
        color: rgb(17 24 39);
    }
    .dark .delivery-areas-td {
        color: rgb(243 244 246);
    }
    .delivery-areas-td-actions {
        padding: 0.75rem 1rem;
        white-space: nowrap;
        text-align: right;
        display: flex;
        justify-content: flex-end;
        gap: 0.25rem;
    }
    .delivery-areas-status-badge {
        display: inline-flex;
        align-items: center;
        padding: 0.125rem 0.625rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 500;
        cursor: pointer;
        border: none;
        transition: all 75ms;
    }
    .delivery-areas-status-active {
        background: rgb(209 250 229);
        color: rgb(6 95 70);
    }
    .dark .delivery-areas-status-active {
        background: rgb(6 78 59);
        color: rgb(167 243 208);
    }
    .delivery-areas-status-passive {
        background: rgb(254 226 226);
        color: rgb(153 27 27);
    }
    .dark .delivery-areas-status-passive {
        background: rgb(127 29 29);
        color: rgb(254 202 202);
    }
    .delivery-areas-empty-state {
        text-align: center;
        padding: 3rem 1rem;
    }
    .delivery-areas-empty-icon {
        width: 3rem;
        height: 3rem;
        margin: 0 auto;
        color: rgb(156 163 175);
    }
    .delivery-areas-empty-title {
        margin-top: 0.5rem;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgb(107 114 128);
    }
    .delivery-areas-empty-subtitle {
        margin-top: 0.25rem;
        font-size: 0.75rem;
        color: rgb(156 163 175);
    }
    @media (max-width: 768px) {
        .delivery-areas-grid-2 {
            grid-template-columns: 1fr;
        }
        .delivery-areas-grid-3 {
            grid-template-columns: 1fr;
        }
    }

    /* Payment Settings */
    .payment-section-subtitle {
        font-size: 0.875rem;
        font-weight: 600;
        color: rgb(55 65 81);
        margin-bottom: 0.75rem;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid rgb(229 231 235);
    }
    .dark .payment-section-subtitle {
        color: rgb(209 213 219);
        border-color: rgb(55 65 81);
    }
    .payment-checkbox-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
    .payment-checkbox-card {
        display: flex;
        align-items: flex-start;
        gap: 0.75rem;
        padding: 0.75rem 1rem;
        border: 1px solid rgb(229 231 235);
        border-radius: 0.5rem;
        cursor: pointer;
        transition: all 75ms;
        background: white;
    }
    .payment-checkbox-card:hover {
        border-color: rgb(16 185 129);
        background: rgb(236 253 245);
    }
    .dark .payment-checkbox-card {
        border-color: rgb(55 65 81);
        background: rgb(31 41 55);
    }
    .dark .payment-checkbox-card:hover {
        border-color: rgb(16 185 129);
        background: rgb(6 78 59);
    }
    .payment-checkbox-input {
        border-radius: 0.25rem;
        border-color: rgb(209 213 219);
        color: rgb(16 185 129);
        margin-top: 0.125rem;
    }
    .payment-checkbox-input:focus {
        --tw-ring-color: rgb(16 185 129);
    }
    .payment-checkbox-name {
        display: block;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgb(17 24 39);
    }
    .dark .payment-checkbox-name {
        color: rgb(243 244 246);
    }
    .payment-checkbox-desc {
        display: block;
        font-size: 0.75rem;
        color: rgb(107 114 128);
        margin-top: 0.125rem;
    }
    .dark .payment-checkbox-desc {
        color: rgb(156 163 175);
    }
    .payment-checkbox-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        cursor: pointer;
    }
    .payment-apply-all {
        padding-top: 1rem;
        border-top: 1px solid rgb(229 231 235);
    }
    .dark .payment-apply-all {
        border-color: rgb(55 65 81);
    }
    .payment-apply-all-text {
        font-size: 0.875rem;
        font-weight: 500;
        color: rgb(55 65 81);
    }
    .dark .payment-apply-all-text {
        color: rgb(209 213 219);
    }
    .payment-form-actions {
        display: flex;
        justify-content: flex-end;
        gap: 0.5rem;
        margin-top: 1rem;
    }
    .payment-form-card {
        border: 1px solid rgb(229 231 235);
        border-radius: 0.75rem;
        padding: 1.5rem;
        background: rgb(249 250 251);
    }
    .dark .payment-form-card {
        border-color: rgb(55 65 81);
        background: rgb(31 41 55);
    }
    .payment-form-title {
        font-size: 1rem;
        font-weight: 600;
        color: rgb(17 24 39);
        margin-bottom: 1rem;
    }
    .dark .payment-form-title {
        color: rgb(243 244 246);
    }
    .payment-pos-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    .payment-field-label {
        display: block;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgb(55 65 81);
        margin-bottom: 0.25rem;
    }
    .dark .payment-field-label {
        color: rgb(209 213 219);
    }
    .payment-text-input {
        display: block;
        width: 100%;
        border-radius: 0.5rem;
        border: 1px solid rgb(209 213 219);
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
        box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
        transition: all 75ms;
        background: white;
    }
    .payment-text-input:focus {
        border-color: rgb(16 185 129);
        outline: none;
        box-shadow: 0 0 0 1px inset rgb(16 185 129);
    }
    .dark .payment-text-input {
        border-color: rgb(75 85 99);
        background: rgb(55 65 81);
        color: white;
    }
    .payment-select-input {
        display: block;
        width: 100%;
        border-radius: 0.5rem;
        border: 1px solid rgb(209 213 219);
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
        box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
        transition: all 75ms;
        background: white;
    }
    .payment-select-input:focus {
        border-color: rgb(16 185 129);
        outline: none;
        box-shadow: 0 0 0 1px inset rgb(16 185 129);
    }
    .dark .payment-select-input {
        border-color: rgb(75 85 99);
        background: rgb(55 65 81);
        color: white;
    }
    .payment-table-wrapper {
        overflow-x: auto;
        border: 1px solid rgb(229 231 235);
        border-radius: 0.75rem;
    }
    .dark .payment-table-wrapper {
        border-color: rgb(55 65 81);
    }
    .payment-table {
        width: 100%;
        font-size: 0.875rem;
        text-align: left;
    }
    .payment-table-header {
        background: rgb(249 250 251);
        border-bottom: 1px solid rgb(229 231 235);
    }
    .dark .payment-table-header {
        background: rgb(31 41 55);
        border-color: rgb(55 65 81);
    }
    .payment-th {
        padding: 0.75rem 1rem;
        font-weight: 600;
        color: rgb(55 65 81);
        white-space: nowrap;
    }
    .dark .payment-th {
        color: rgb(209 213 219);
    }
    .payment-th-actions {
        padding: 0.75rem 1rem;
        font-weight: 600;
        color: rgb(55 65 81);
        white-space: nowrap;
        text-align: right;
    }
    .dark .payment-th-actions {
        color: rgb(209 213 219);
    }
    .payment-table-row {
        border-bottom: 1px solid rgb(243 244 246);
        transition: background 75ms;
    }
    .payment-table-row:hover {
        background: rgb(249 250 251);
    }
    .dark .payment-table-row {
        border-color: rgb(55 65 81);
    }
    .dark .payment-table-row:hover {
        background: rgb(31 41 55);
    }
    .payment-td {
        padding: 0.75rem 1rem;
        white-space: nowrap;
        color: rgb(17 24 39);
    }
    .dark .payment-td {
        color: rgb(243 244 246);
    }
    .payment-td-actions {
        padding: 0.75rem 1rem;
        white-space: nowrap;
        text-align: right;
        display: flex;
        justify-content: flex-end;
        gap: 0.25rem;
    }
    .payment-status-badge {
        display: inline-flex;
        align-items: center;
        padding: 0.125rem 0.625rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 500;
        cursor: pointer;
        border: none;
        transition: all 75ms;
    }
    .payment-status-active {
        background: rgb(209 250 229);
        color: rgb(6 95 70);
    }
    .dark .payment-status-active {
        background: rgb(6 78 59);
        color: rgb(167 243 208);
    }
    .payment-status-passive {
        background: rgb(254 226 226);
        color: rgb(153 27 27);
    }
    .dark .payment-status-passive {
        background: rgb(127 29 29);
        color: rgb(254 202 202);
    }
    .payment-empty-state {
        text-align: center;
        padding: 3rem 1rem;
    }
    .payment-empty-icon {
        width: 3rem;
        height: 3rem;
        margin: 0 auto;
        color: rgb(156 163 175);
    }
    .payment-empty-title {
        margin-top: 0.5rem;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgb(107 114 128);
    }
    .payment-empty-subtitle {
        margin-top: 0.25rem;
        font-size: 0.75rem;
        color: rgb(156 163 175);
    }
    @media (max-width: 768px) {
        .payment-checkbox-grid {
            grid-template-columns: 1fr;
        }
        .payment-pos-grid {
            grid-template-columns: 1fr;
        }
    }

    /* ===== Working Hours Settings (NEW) ===== */
    .wh-always-row { display: flex; justify-content: space-between; align-items: center; }
    .wh-always-left { display: flex; align-items: center; gap: 16px; }
    .wh-always-icon { width: 52px; height: 52px; border-radius: 14px; background: #f1f5f9; display: flex; align-items: center; justify-content: center; color: #6b7280; flex-shrink: 0; transition: all 0.2s; }
    .wh-always-icon-active { background: #dcfce7; color: #16a34a; }
    :is(.dark) .wh-always-icon { background: rgb(31,41,55); }
    :is(.dark) .wh-always-icon-active { background: rgba(22,163,74,0.15); }
    .wh-always-title { font-size: 16px; font-weight: 700; color: #111827; }
    :is(.dark) .wh-always-title { color: #e5e7eb; }
    .wh-always-desc { font-size: 13px; color: #6b7280; margin-top: 2px; }

    .wh-switch { position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0; }
    .wh-switch input { opacity: 0; width: 0; height: 0; }
    .wh-switch-slider { position: absolute; cursor: pointer; inset: 0; background: #d1d5db; border-radius: 24px; transition: 0.3s; }
    .wh-switch-slider::before { content: ''; position: absolute; height: 18px; width: 18px; left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: 0.3s; }
    .wh-switch input:checked + .wh-switch-slider { background: #16a34a; }
    .wh-switch input:checked + .wh-switch-slider::before { transform: translateX(20px); }
    :is(.dark) .wh-switch-slider { background: rgb(55,65,81); }
    .wh-switch-sm { width: 36px; height: 20px; }
    .wh-switch-sm .wh-switch-slider::before { height: 14px; width: 14px; }
    .wh-switch-sm input:checked + .wh-switch-slider::before { transform: translateX(16px); }

    .wh-week-grid { display: flex; flex-direction: column; gap: 8px; }
    .wh-day-card { border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; transition: all 0.2s; }
    .wh-day-open { border-left: 4px solid var(--day-color); }
    .wh-day-closed { border-left: 4px solid #d1d5db; opacity: 0.7; }
    :is(.dark) .wh-day-card { border-color: rgb(55,65,81); background: rgb(24,30,42); }
    :is(.dark) .wh-day-closed { border-left-color: rgb(75,85,99); }

    .wh-day-header { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px; }
    .wh-day-left { display: flex; align-items: center; gap: 12px; }
    .wh-day-indicator { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
    .wh-day-name { font-size: 15px; font-weight: 700; color: #111827; }
    :is(.dark) .wh-day-name { color: #e5e7eb; }
    .wh-day-hours { font-size: 12px; color: #6b7280; background: #f3f4f6; padding: 2px 8px; border-radius: 6px; }
    :is(.dark) .wh-day-hours { background: rgb(55,65,81); color: #9ca3af; }
    .wh-day-right { display: flex; align-items: center; gap: 12px; }
    .wh-day-badge { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 6px; }
    .wh-badge-open { background: #dcfce7; color: #16a34a; }
    .wh-badge-closed { background: #f3f4f6; color: #9ca3af; }
    :is(.dark) .wh-badge-open { background: rgba(22,163,74,0.15); }
    :is(.dark) .wh-badge-closed { background: rgb(55,65,81); }

    .wh-ranges { padding: 0 20px 16px; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid #f3f4f6; padding-top: 12px; }
    :is(.dark) .wh-ranges { border-top-color: rgb(55,65,81); }
    .wh-range { display: flex; align-items: center; gap: 8px; }
    .wh-range-inputs { display: flex; align-items: center; gap: 6px; }
    .wh-time-wrap { position: relative; display: flex; align-items: center; }
    .wh-time-icon { position: absolute; left: 10px; width: 14px; height: 14px; pointer-events: none; z-index: 1; }
    .wh-time-icon-start { color: #16a34a; }
    .wh-time-icon-end { color: #dc2626; }
    .wh-time-select { padding: 8px 10px 8px 30px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; font-weight: 500; background: #fff; color: #111; min-width: 110px; cursor: pointer; }
    :is(.dark) .wh-time-select { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .wh-time-select:focus { border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
    .wh-range-arrow { display: flex; align-items: center; padding: 0 2px; }
    .wh-range-remove { padding: 6px; border: 1px solid #fecaca; border-radius: 8px; background: #fff; color: #ef4444; cursor: pointer; display: flex; }
    .wh-range-remove:hover { background: #fef2f2; }
    :is(.dark) .wh-range-remove { background: rgb(31,41,55); border-color: rgba(239,68,68,0.3); }

    .wh-add-range { display: flex; align-items: center; gap: 6px; padding: 6px 14px; border: 1px dashed #d1d5db; border-radius: 8px; background: transparent; color: #6b7280; font-size: 13px; font-weight: 500; cursor: pointer; width: fit-content; }
    .wh-add-range:hover { border-color: #3b82f6; color: #2563eb; background: #eff6ff; }
    :is(.dark) .wh-add-range { border-color: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .wh-add-range:hover { border-color: #3b82f6; color: #60a5fa; background: rgba(59,130,246,0.1); }

    .wh-footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 8px 0; }
    .wh-apply-all { display: flex; align-items: center; gap: 14px; padding: 12px 20px; border: 2px solid #e5e7eb; border-radius: 12px; cursor: pointer; transition: all 0.2s; background: #fff; }
    .wh-apply-all:hover { border-color: #86efac; background: #f0fdf4; }
    .wh-apply-all-active { border-color: #16a34a; background: #f0fdf4; }
    .wh-apply-icon-active { background: #dcfce7; color: #16a34a; }
    :is(.dark) .wh-apply-all { border-color: rgb(55,65,81); background: rgb(31,41,55); }
    :is(.dark) .wh-apply-all:hover { border-color: #4ade80; background: rgba(22,163,74,0.05); }
    :is(.dark) .wh-apply-all-active { border-color: #16a34a; background: rgba(22,163,74,0.1); }
    .wh-apply-icon { width: 40px; height: 40px; border-radius: 10px; background: #f3f4f6; display: flex; align-items: center; justify-content: center; color: #6b7280; flex-shrink: 0; }
    .wh-apply-all-active .wh-apply-icon { background: #dcfce7; color: #16a34a; }
    :is(.dark) .wh-apply-icon { background: rgb(55,65,81); }
    :is(.dark) .wh-apply-all-active .wh-apply-icon { background: rgba(22,163,74,0.2); color: #4ade80; }
    .wh-apply-title { font-size: 14px; font-weight: 600; color: #111827; }
    :is(.dark) .wh-apply-title { color: #e5e7eb; }
    .wh-apply-desc { font-size: 12px; color: #6b7280; margin-top: 1px; }
    .wh-apply-check-wrap { margin-left: auto; flex-shrink: 0; }

    .wh-modal-overlay { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; }
    .wh-modal { background: #fff; border-radius: 16px; padding: 32px; max-width: 400px; width: 90%; text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2); position: relative; }
    .wh-modal > .wh-modal-close { position: absolute; top: 0.75rem; right: 0.75rem; z-index: 10; background: none; border: none; font-size: 1.25rem; color: #94a3b8; cursor: pointer; width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center; border-radius: 0.375rem; line-height: 1; }
    .wh-modal > .wh-modal-close:hover { background: #f1f5f9; color: #475569; }
    :is(.dark) .wh-modal > .wh-modal-close:hover { background: rgb(55,65,81); color: #e2e8f0; }
    :is(.dark) .wh-modal { background: rgb(31,41,55); }
    .wh-modal-icon { margin-bottom: 16px; display: flex; justify-content: center; }
    .wh-modal-title { font-size: 18px; font-weight: 700; color: #111827; margin: 0 0 8px; }
    :is(.dark) .wh-modal-title { color: #e5e7eb; }
    .wh-modal-desc { font-size: 14px; color: #6b7280; margin: 0 0 24px; line-height: 1.5; }
    .wh-modal-actions { display: flex; gap: 10px; justify-content: center; }
    .wh-modal-btn { padding: 10px 24px; border-radius: 10px; font-size: 14px; font-weight: 600; cursor: pointer; border: none; transition: all 0.15s; }
    .wh-modal-btn-cancel { background: #f3f4f6; color: #374151; }
    .wh-modal-btn-cancel:hover { background: #e5e7eb; }
    :is(.dark) .wh-modal-btn-cancel { background: rgb(55,65,81); color: #d1d5db; }
    .wh-modal-btn-confirm { background: #16a34a; color: #fff; }
    .wh-modal-btn-confirm:hover { background: #15803d; }
    .wh-modal-btn-primary { background: #2563eb; color: #fff; }
    .wh-modal-btn-primary:hover { background: #1d4ed8; }
    .wh-modal-btn-danger { background: #ef4444; color: #fff; }
    .wh-modal-btn-danger:hover { background: #dc2626; }
    .wh-apply-check-empty { width: 22px; height: 22px; border: 2px solid #d1d5db; border-radius: 50%; }
    :is(.dark) .wh-apply-check-empty { border-color: rgb(75,85,99); }

    @media (max-width: 640px) {
        .wh-range-inputs { flex-wrap: wrap; }
        .wh-time-select { min-width: 90px; }
        .wh-always-row { flex-direction: column; gap: 12px; align-items: flex-start; }
    }

    /* ===== Working Hours Settings (OLD - REMOVED) ===== */
    .workhours-always-open-row {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
    }
    .workhours-always-open-label {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        cursor: pointer;
    }
    .workhours-always-open-text {
        font-size: 1rem;
        font-weight: 600;
        color: rgb(var(--gray-950));
    }
    :is(.dark) .workhours-always-open-text {
        color: rgb(var(--gray-100));
    }
    .workhours-always-open-hint {
        font-size: 0.8125rem;
        color: rgb(var(--gray-500));
        margin: 0;
        padding-left: 2rem;
    }
    .workhours-checkbox {
        width: 1.125rem;
        height: 1.125rem;
        border-radius: 0.25rem;
        border: 2px solid rgb(var(--gray-300));
        cursor: pointer;
        accent-color: rgb(var(--primary-600));
    }
    :is(.dark) .workhours-checkbox {
        border-color: rgb(var(--gray-600));
        background-color: rgb(var(--gray-700));
    }
    .workhours-days-container {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }
    .workhours-day-card {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }
    .workhours-day-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .workhours-day-name-row {
        display: flex;
        align-items: center;
        gap: 1rem;
        width: 100%;
    }
    .workhours-day-toggle-label {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        cursor: pointer;
        min-width: 160px;
    }
    .workhours-day-name {
        font-size: 0.9375rem;
        font-weight: 600;
        color: rgb(var(--gray-950));
    }
    :is(.dark) .workhours-day-name {
        color: rgb(var(--gray-100));
    }
    .workhours-day-status {
        font-size: 0.75rem;
        font-weight: 500;
        padding: 0.125rem 0.625rem;
        border-radius: 9999px;
    }
    .workhours-day-status-open {
        background-color: rgba(var(--success-50), 1);
        color: rgba(var(--success-600), 1);
    }
    :is(.dark) .workhours-day-status-open {
        background-color: rgba(var(--success-400), 0.15);
        color: rgba(var(--success-400), 1);
    }
    .workhours-day-status-closed {
        background-color: rgba(var(--danger-50), 1);
        color: rgba(var(--danger-600), 1);
    }
    :is(.dark) .workhours-day-status-closed {
        background-color: rgba(var(--danger-400), 0.15);
        color: rgba(var(--danger-400), 1);
    }
    .workhours-ranges-container {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        padding-left: 2rem;
    }
    .workhours-range-row {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .workhours-range-inputs {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .workhours-time-select {
        display: block;
        width: 7rem;
        padding: 0.375rem 0.625rem;
        border-radius: 0.5rem;
        border: 1px solid rgb(var(--gray-300));
        background-color: white;
        font-size: 0.875rem;
        color: rgb(var(--gray-950));
        transition: border-color 150ms, box-shadow 150ms;
    }
    .workhours-time-select:focus {
        outline: none;
        border-color: rgb(var(--primary-500));
        box-shadow: 0 0 0 1px rgb(var(--primary-500));
    }
    :is(.dark) .workhours-time-select {
        background-color: rgb(var(--gray-700));
        border-color: rgb(var(--gray-600));
        color: rgb(var(--gray-100));
    }
    .workhours-range-separator {
        color: rgb(var(--gray-400));
        font-size: 0.875rem;
        padding: 0 0.125rem;
    }
    .workhours-range-remove-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        border-radius: 0.375rem;
        border: none;
        background: none;
        color: rgba(var(--danger-500), 1);
        cursor: pointer;
        transition: background-color 150ms;
    }
    .workhours-range-remove-btn:hover {
        background-color: rgba(var(--danger-50), 1);
    }
    :is(.dark) .workhours-range-remove-btn:hover {
        background-color: rgba(var(--danger-400), 0.15);
    }
    .workhours-icon-sm {
        width: 1.125rem;
        height: 1.125rem;
    }
    .workhours-add-range-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        border-radius: 0.5rem;
        border: 1px dashed rgb(var(--gray-300));
        background: none;
        color: rgb(var(--primary-600));
        font-size: 0.8125rem;
        font-weight: 500;
        cursor: pointer;
        transition: background-color 150ms, border-color 150ms;
        width: fit-content;
    }
    .workhours-add-range-btn:hover {
        background-color: rgba(var(--primary-50), 1);
        border-color: rgb(var(--primary-300));
    }
    :is(.dark) .workhours-add-range-btn {
        border-color: rgb(var(--gray-600));
    }
    :is(.dark) .workhours-add-range-btn:hover {
        background-color: rgba(var(--primary-400), 0.1);
        border-color: rgb(var(--primary-500));
    }
    .workhours-footer {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 1rem;
        margin-top: 1.5rem;
    }
    .workhours-apply-all-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        cursor: pointer;
    }
    @media (max-width: 640px) {
        .workhours-range-inputs {
            flex-wrap: wrap;
        }
        .workhours-time-select {
            width: 100%;
        }
        .workhours-day-toggle-label {
            min-width: auto;
        }
        .workhours-ranges-container {
            padding-left: 0.5rem;
        }
    }

    /* ===== Tax Settings ===== */
    .tax-table-container {
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .tax-table-header {
        display: grid;
        grid-template-columns: 3fr 2fr 1fr 50px;
        gap: 1rem;
        font-size: 0.75rem;
        font-weight: 600;
        color: rgba(var(--gray-500), 1);
        padding: 0.5rem 0.75rem;
        border-bottom: 1px solid rgba(var(--gray-200), 1);
        margin-bottom: 0.25rem;
    }
    :is(.dark) .tax-table-header {
        border-color: rgba(var(--gray-700), 1);
    }
    .tax-table-row {
        display: grid;
        grid-template-columns: 3fr 2fr 1fr 50px;
        gap: 1rem;
        align-items: center;
        padding: 0.5rem 0.75rem;
        border-bottom: 1px solid rgba(var(--gray-100), 1);
        transition: background-color 0.15s;
    }
    :is(.dark) .tax-table-row {
        border-color: rgba(var(--gray-800), 1);
    }
    .tax-table-row:hover {
        background-color: rgba(var(--gray-50), 1);
    }
    :is(.dark) .tax-table-row:hover {
        background-color: rgba(var(--gray-800), 0.5);
    }
    .tax-table-col-default {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tax-table-col-action {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tax-input {
        font-size: 0.875rem;
        padding: 0.5rem 0.75rem;
    }
    .tax-radio {
        width: 1.125rem;
        height: 1.125rem;
        cursor: pointer;
    }
    .tax-remove-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        border-radius: 0.5rem;
        color: rgba(var(--danger-500), 1);
        transition: all 0.15s;
        cursor: pointer;
        border: none;
        background: none;
    }
    .tax-remove-btn:hover {
        background-color: rgba(var(--danger-50), 1);
    }
    :is(.dark) .tax-remove-btn:hover {
        background-color: rgba(var(--danger-900), 0.3);
    }
    .tax-add-row {
        padding: 0.75rem;
    }
    .tax-add-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgba(var(--primary-600), 1);
        background: none;
        border: 1px dashed rgba(var(--primary-400), 1);
        border-radius: 0.5rem;
        cursor: pointer;
        transition: all 0.15s;
    }
    .tax-add-btn:hover {
        background-color: rgba(var(--primary-50), 1);
        border-color: rgba(var(--primary-500), 1);
    }
    :is(.dark) .tax-add-btn {
        color: rgba(var(--primary-400), 1);
        border-color: rgba(var(--primary-600), 1);
    }
    :is(.dark) .tax-add-btn:hover {
        background-color: rgba(var(--primary-900), 0.3);
    }
    @media (max-width: 640px) {
        .tax-table-header {
            display: none;
        }
        .tax-table-row {
            grid-template-columns: 1fr;
            gap: 0.5rem;
        }
        .tax-table-col-default,
        .tax-table-col-action {
            justify-content: flex-start;
        }
    }

    /* ===== Language Settings ===== */
    .lang-settings-add-row {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin-bottom: 1rem;
        padding-bottom: 1rem;
        border-bottom: 1px solid rgba(var(--gray-200), 1);
    }
    :is(.dark) .lang-settings-add-row {
        border-color: rgba(var(--gray-700), 1);
    }
    .lang-settings-select {
        width: 250px;
        font-size: 0.875rem;
    }
    .lang-settings-add-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
        font-weight: 500;
        color: rgba(var(--primary-600), 1);
        background: none;
        border: 1px dashed rgba(var(--primary-400), 1);
        border-radius: 0.5rem;
        cursor: pointer;
        transition: all 0.15s;
        white-space: nowrap;
    }
    .lang-settings-add-btn:hover {
        background-color: rgba(var(--primary-50), 1);
        border-color: rgba(var(--primary-500), 1);
    }
    :is(.dark) .lang-settings-add-btn {
        color: rgba(var(--primary-400), 1);
        border-color: rgba(var(--primary-600), 1);
    }
    :is(.dark) .lang-settings-add-btn:hover {
        background-color: rgba(var(--primary-900), 0.3);
    }
    .lang-settings-table-container {
        display: flex;
        flex-direction: column;
    }
    .lang-settings-table-header {
        display: grid;
        grid-template-columns: 60px 3fr 1fr 1fr 120px;
        gap: 1rem;
        font-size: 0.75rem;
        font-weight: 600;
        color: rgba(var(--gray-500), 1);
        padding: 0.5rem 0.75rem;
        border-bottom: 1px solid rgba(var(--gray-200), 1);
        margin-bottom: 0.25rem;
    }
    :is(.dark) .lang-settings-table-header {
        border-color: rgba(var(--gray-700), 1);
    }
    .lang-settings-table-row {
        display: grid;
        grid-template-columns: 60px 3fr 1fr 1fr 120px;
        gap: 1rem;
        align-items: center;
        padding: 0.625rem 0.75rem;
        border-bottom: 1px solid rgba(var(--gray-100), 1);
        transition: background-color 0.15s;
    }
    :is(.dark) .lang-settings-table-row {
        border-color: rgba(var(--gray-800), 1);
    }
    .lang-settings-table-row:hover {
        background-color: rgba(var(--gray-50), 1);
    }
    :is(.dark) .lang-settings-table-row:hover {
        background-color: rgba(var(--gray-800), 0.5);
    }
    .lang-settings-order-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 1.75rem;
        height: 1.75rem;
        font-size: 0.75rem;
        font-weight: 600;
        border-radius: 0.375rem;
        background-color: rgba(var(--gray-100), 1);
        color: rgba(var(--gray-600), 1);
    }
    :is(.dark) .lang-settings-order-badge {
        background-color: rgba(var(--gray-700), 1);
        color: rgba(var(--gray-300), 1);
    }
    .lang-settings-lang-name {
        font-size: 0.875rem;
        font-weight: 500;
        color: rgba(var(--gray-900), 1);
    }
    :is(.dark) .lang-settings-lang-name {
        color: rgba(var(--gray-100), 1);
    }
    .lang-settings-code-badge {
        display: inline-flex;
        align-items: center;
        padding: 0.125rem 0.5rem;
        font-size: 0.75rem;
        font-weight: 600;
        border-radius: 9999px;
        background-color: rgba(var(--primary-50), 1);
        color: rgba(var(--primary-700), 1);
    }
    :is(.dark) .lang-settings-code-badge {
        background-color: rgba(var(--primary-900), 0.3);
        color: rgba(var(--primary-400), 1);
    }
    .lang-settings-toggle-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        cursor: pointer;
    }
    .lang-settings-toggle-text {
        font-size: 0.8125rem;
        color: rgba(var(--gray-600), 1);
    }
    :is(.dark) .lang-settings-toggle-text {
        color: rgba(var(--gray-400), 1);
    }
    .lang-settings-col-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .lang-settings-action-btns {
        display: flex;
        align-items: center;
        gap: 0.25rem;
    }
    .lang-settings-move-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 1.75rem;
        height: 1.75rem;
        border-radius: 0.375rem;
        color: rgba(var(--gray-500), 1);
        background: none;
        border: none;
        cursor: pointer;
        transition: all 0.15s;
    }
    .lang-settings-move-btn:hover {
        background-color: rgba(var(--gray-100), 1);
        color: rgba(var(--gray-700), 1);
    }
    :is(.dark) .lang-settings-move-btn:hover {
        background-color: rgba(var(--gray-700), 1);
        color: rgba(var(--gray-300), 1);
    }
    .lang-settings-move-btn-disabled {
        opacity: 0.3;
        cursor: not-allowed;
        pointer-events: none;
    }
    .lang-settings-remove-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 1.75rem;
        height: 1.75rem;
        border-radius: 0.375rem;
        color: rgba(var(--danger-500), 1);
        background: none;
        border: none;
        cursor: pointer;
        transition: all 0.15s;
    }
    .lang-settings-remove-btn:hover {
        background-color: rgba(var(--danger-50), 1);
    }
    :is(.dark) .lang-settings-remove-btn:hover {
        background-color: rgba(var(--danger-900), 0.3);
    }
    .lang-settings-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 2rem;
        gap: 0.5rem;
        color: rgba(var(--gray-400), 1);
        font-size: 0.875rem;
    }
    .lang-settings-empty-icon {
        color: rgba(var(--gray-300), 1);
    }
    :is(.dark) .lang-settings-empty-icon {
        color: rgba(var(--gray-600), 1);
    }
    @media (max-width: 640px) {
        .lang-settings-add-row {
            flex-wrap: wrap;
        }
        .lang-settings-select {
            width: 100%;
        }
        .lang-settings-table-header {
            display: none;
        }
        .lang-settings-table-row {
            grid-template-columns: 1fr 1fr;
            gap: 0.5rem;
        }
        .lang-settings-col-order {
            display: none;
        }
        .lang-settings-col-actions {
            justify-content: flex-start;
        }
    }

    /* ========================================
       User Management (um-) Styles
       ======================================== */
    .um-search-input {
        width: 100%;
        padding: 10px 14px;
        border: 1px solid #d1d5db;
        border-radius: 10px;
        font-size: 14px;
        background: #fff;
        transition: border-color 0.15s;
    }
    .um-search-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    :is(.dark) .um-search-input {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
        color: #e5e7eb;
    }
    .um-table-wrap {
        overflow-x: auto;
    }
    .um-th {
        padding: 10px 16px;
        font-size: 12px;
        font-weight: 600;
        color: #6b7280;
        white-space: nowrap;
    }
    :is(.dark) .um-th {
        color: #9ca3af;
    }
    .um-td {
        padding: 12px 16px;
        vertical-align: middle;
    }
    .um-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: #e0e7ff;
        color: #4338ca;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        font-weight: 700;
        flex-shrink: 0;
    }
    :is(.dark) .um-avatar {
        background: rgba(99, 102, 241, 0.2);
        color: #a5b4fc;
    }
    .um-action-btn {
        padding: 6px;
        border: none;
        background: none;
        cursor: pointer;
        color: #6b7280;
        border-radius: 6px;
        transition: background 0.15s;
    }
    .um-action-btn:hover {
        background: #f3f4f6;
    }
    :is(.dark) .um-action-btn:hover {
        background: rgb(55, 65, 81);
    }
    .um-dropdown {
        position: absolute;
        right: 0;
        top: 100%;
        z-index: 50;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
        min-width: 180px;
        padding: 4px 0;
    }
    :is(.dark) .um-dropdown {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .um-dropdown-item {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        padding: 8px 14px;
        border: none;
        background: none;
        cursor: pointer;
        font-size: 13px;
        color: #374151;
        transition: background 0.1s;
    }
    .um-dropdown-item:hover {
        background: #f3f4f6;
    }
    :is(.dark) .um-dropdown-item {
        color: #d1d5db;
    }
    :is(.dark) .um-dropdown-item:hover {
        background: rgb(55, 65, 81);
    }
    .um-dropdown-danger {
        color: #ef4444;
    }
    :is(.dark) .um-dropdown-danger {
        color: #f87171;
    }
    .um-dropdown-divider {
        border-top: 1px solid #f3f4f6;
        margin: 4px 0;
    }
    :is(.dark) .um-dropdown-divider {
        border-color: rgb(55, 65, 81);
    }
    .um-date-text {
        font-size: 13px;
        color: #6b7280;
    }
    :is(.dark) .um-date-text {
        color: #9ca3af;
    }
    .um-empty {
        text-align: center;
        padding: 40px 16px;
        color: #6b7280;
    }
    .um-empty-icon {
        width: 40px;
        height: 40px;
        margin: 0 auto 12px;
        color: #d1d5db;
    }
    :is(.dark) .um-empty-icon {
        color: rgb(75, 85, 99);
    }
    .um-input {
        width: 100%;
        padding: 10px 14px;
        border: 1px solid #d1d5db;
        border-radius: 10px;
        font-size: 14px;
        background: #fff;
    }
    .um-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    :is(.dark) .um-input {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
        color: #e5e7eb;
    }
    .um-form-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }
    .um-form-group {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .um-switch-row {
        display: flex;
        align-items: center;
        gap: 20px;
        flex-wrap: wrap;
        padding: 8px 0;
    }
    .um-switch-label {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 500;
        cursor: pointer;
    }
    .fi-ta-row.um-user-row {
        border-bottom: 1px solid #f3f4f6;
    }
    :is(.dark) .fi-ta-row.um-user-row {
        border-bottom-color: rgb(55, 65, 81);
    }
    @media (max-width: 768px) {
        .um-hide-mobile {
            display: none;
        }
        .um-form-row {
            grid-template-columns: 1fr;
        }
    }

    /* ========================================
       Permission Groups (pg-) Styles
       ======================================== */
    .pg-th {
        padding: 10px 16px;
        font-size: 12px;
        font-weight: 600;
        color: #6b7280;
        white-space: nowrap;
    }
    :is(.dark) .pg-th {
        color: #9ca3af;
    }
    .pg-td {
        padding: 12px 16px;
        vertical-align: middle;
    }
    .pg-row {
        border-bottom: 1px solid #f3f4f6;
    }
    :is(.dark) .pg-row {
        border-bottom-color: rgb(55, 65, 81);
    }
    .pg-perm-modal {
        max-width: 720px;
        width: 95%;
        text-align: left;
        max-height: 80vh;
        display: flex;
        flex-direction: column;
    }
    .pg-perm-table-wrap {
        overflow-y: auto;
        max-height: 55vh;
        margin-top: 12px;
    }
    .pg-checkbox {
        width: 18px;
        height: 18px;
        accent-color: #16a34a;
        cursor: pointer;
    }
    .pg-checkbox-all {
        accent-color: #2563eb;
    }
    .pg-group-header {
        background: #f8fafc;
    }
    :is(.dark) .pg-group-header {
        background: rgb(30, 35, 45);
    }
    .pg-group-label {
        padding: 8px 16px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #6366f1;
    }
    :is(.dark) .pg-group-label {
        color: #818cf8;
    }
    .pg-td-indent {
        padding-left: 28px;
    }
    .pg-readonly-info {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #6b7280;
        font-size: 14px;
    }
    .pg-readonly-icon {
        width: 20px;
        height: 20px;
        color: #3b82f6;
        flex-shrink: 0;
    }
    .pg-readonly-badge {
        margin-top: 8px;
    }
    .pg-checkbox:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

    /* ========================================
       Courier Management (cm-) Styles
       ======================================== */
    .cm-row {
        border-bottom: 1px solid #f3f4f6;
    }
    :is(.dark) .cm-row {
        border-bottom-color: rgb(55, 65, 81);
    }
    .cm-avatar-working {
        background: #dcfce7;
        color: #16a34a;
    }
    :is(.dark) .cm-avatar-working {
        background: rgba(22, 163, 74, 0.2);
        color: #4ade80;
    }
    .cm-avatar-idle {
        background: #f3f4f6;
        color: #6b7280;
    }
    :is(.dark) .cm-avatar-idle {
        background: rgb(55, 65, 81);
        color: #9ca3af;
    }
    .cm-orders-modal {
        max-width: 520px;
        width: 95%;
        text-align: left;
        max-height: 80vh;
        display: flex;
        flex-direction: column;
    }
    .cm-orders-list {
        overflow-y: auto;
        max-height: 55vh;
        margin-top: 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .cm-order-item {
        padding: 12px 14px;
        background: #f9fafb;
        border-radius: 10px;
        border: 1px solid #f3f4f6;
    }
    :is(.dark) .cm-order-item {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .cm-order-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 4px;
    }
    .cm-order-code {
        font-weight: 700;
        font-size: 14px;
        color: #111827;
    }
    :is(.dark) .cm-order-code {
        color: #e5e7eb;
    }
    .cm-order-bottom {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 13px;
        color: #6b7280;
    }
    .cm-order-total {
        font-weight: 600;
        color: #374151;
    }
    :is(.dark) .cm-order-total {
        color: #d1d5db;
    }
    .cm-order-date {
        color: #9ca3af;
    }
    .cm-order-address {
        font-size: 12px;
        color: #9ca3af;
        margin-top: 4px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .cm-location-modal {
        max-width: 600px;
        width: 95%;
        text-align: left;
    }
    .cm-location-map {
        width: 100%;
        height: 350px;
        border-radius: 10px;
        margin-top: 12px;
    }
    .cm-orders-empty {
        text-align: center;
        color: #9ca3af;
        padding: 24px;
    }
    .um-form-modal {
        max-width: 560px;
        text-align: left;
    }
    .um-password-modal {
        max-width: 420px;
    }
    .um-form-title {
        text-align: left;
    }
    .um-form-fields {
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin-top: 16px;
    }
    .um-form-fields-left {
        text-align: left;
    }
    .um-form-actions {
        margin-top: 20px;
        justify-content: flex-end;
    }
    .um-form-actions-mt {
        margin-top: 20px;
    }
    .um-password-icon {
        width: 32px;
        height: 32px;
        color: #2563eb;
    }
    .pg-form-title {
        text-align: left;
    }
    .pg-th-left {
        text-align: left;
        padding: 10px 16px;
        font-size: 12px;
        font-weight: 600;
        color: #6b7280;
        white-space: nowrap;
    }
    .pg-th-center {
        text-align: center;
        padding: 10px 16px;
        font-size: 12px;
        font-weight: 600;
        color: #6b7280;
        white-space: nowrap;
    }
    :is(.dark) .pg-th-left,
    :is(.dark) .pg-th-center {
        color: #9ca3af;
    }
    .pg-td-name {
        font-weight: 600;
        text-align: left;
    }
    .pg-td-center {
        text-align: center;
    }

    /* ========================================
       Notification Bell (ntf-) Styles
       ======================================== */
    .ntf-bell-wrap {
        position: relative;
    }
    .ntf-bell-btn {
        position: relative;
        padding: 8px;
        border: none;
        background: none;
        cursor: pointer;
        color: #6b7280;
        border-radius: 8px;
        transition: background 0.15s;
    }
    .ntf-bell-btn:hover {
        background: #f3f4f6;
    }
    :is(.dark) .ntf-bell-btn:hover {
        background: rgb(55, 65, 81);
    }
    .ntf-bell-icon {
        width: 22px;
        height: 22px;
    }
    .ntf-bell-badge {
        position: absolute;
        top: 2px;
        right: 2px;
        background: #ef4444;
        color: #fff;
        font-size: 10px;
        font-weight: 700;
        min-width: 16px;
        height: 16px;
        padding: 0 4px;
        border-radius: 99px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }
    .ntf-dropdown {
        position: absolute;
        right: 0;
        top: 100%;
        z-index: 200;
        width: 360px;
        max-height: 480px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 12px 40px rgba(0,0,0,0.15);
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }
    :is(.dark) .ntf-dropdown {
        background: rgb(17, 24, 39);
        border-color: rgb(55, 65, 81);
    }
    .ntf-dropdown-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 16px;
        border-bottom: 1px solid #f3f4f6;
    }
    :is(.dark) .ntf-dropdown-header {
        border-bottom-color: rgb(55, 65, 81);
    }
    .ntf-dropdown-title {
        font-size: 14px;
        font-weight: 700;
        color: #111827;
    }
    :is(.dark) .ntf-dropdown-title {
        color: #f3f4f6;
    }
    .ntf-mark-all {
        font-size: 12px;
        color: #6366f1;
        background: none;
        border: none;
        cursor: pointer;
        font-weight: 500;
    }
    .ntf-mark-all:hover {
        text-decoration: underline;
    }
    .ntf-header-actions { display: flex; align-items: center; gap: 10px; }
    .ntf-history-link {
        font-size: 12px;
        color: #2563eb;
        text-decoration: none;
        font-weight: 500;
    }
    .ntf-history-link:hover { text-decoration: underline; }
    :is(.dark) .ntf-history-link { color: #60a5fa; }

    /* Notification detail Alpine modal */
    .ntfd-overlay {
        position: fixed; inset: 0; z-index: 9999;
        background: rgba(15,23,42,0.55);
        display: flex; align-items: center; justify-content: center;
        padding: 16px;
    }
    .ntfd-modal {
        background: #fff; color: #0f172a;
        border-radius: 14px; padding: 24px;
        max-width: 540px; width: 100%;
        box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
        position: relative;
    }
    :is(.dark) .ntfd-modal { background: #1f2937; color: #f3f4f6; }
    .ntfd-close {
        position: absolute; top: 12px; right: 12px;
        width: 32px; height: 32px; border: 0; background: transparent;
        border-radius: 50%; cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        color: #64748b;
    }
    .ntfd-close:hover { background: #f1f5f9; }
    :is(.dark) .ntfd-close { color: #94a3b8; }
    :is(.dark) .ntfd-close:hover { background: rgba(255,255,255,0.06); }
    .ntfd-close-icon { width: 18px; height: 18px; }
    .ntfd-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding-right: 32px; }
    .ntfd-icon {
        width: 44px; height: 44px; border-radius: 50%;
        display: inline-flex; align-items: center; justify-content: center;
        flex-shrink: 0;
    }
    .ntfd-icon-svg { width: 22px; height: 22px; }
    .ntfd-title-block { flex: 1; min-width: 0; }
    .ntfd-title { font-size: 16px; font-weight: 700; color: #0f172a; line-height: 1.3; }
    :is(.dark) .ntfd-title { color: #f3f4f6; }
    .ntfd-date { font-size: 12px; color: #64748b; margin-top: 2px; }
    :is(.dark) .ntfd-date { color: #94a3b8; }
    .ntfd-body {
        padding: 14px 16px; background: #f8fafc; border-radius: 10px;
        font-size: 14px; line-height: 1.55; color: #1e293b;
        margin-bottom: 16px;
    }
    :is(.dark) .ntfd-body { background: rgba(255,255,255,0.04); color: #e2e8f0; }
    .ntfd-actions { display: flex; gap: 8px; justify-content: flex-end; }
    .ntfd-btn {
        padding: 9px 16px; border: 0; border-radius: 8px;
        font-size: 14px; font-weight: 600; cursor: pointer;
        text-decoration: none; display: inline-flex; align-items: center; gap: 6px;
        transition: background 0.15s;
    }
    .ntfd-btn-primary { background: #2563eb; color: #fff; }
    .ntfd-btn-primary:hover { background: #1d4ed8; }
    .ntfd-btn-secondary { background: #f1f5f9; color: #475569; }
    .ntfd-btn-secondary:hover { background: #e2e8f0; }
    :is(.dark) .ntfd-btn-secondary { background: rgba(255,255,255,0.08); color: #cbd5e1; }
    :is(.dark) .ntfd-btn-secondary:hover { background: rgba(255,255,255,0.12); }
    [x-cloak] { display: none !important; }
    .ntf-dropdown-list {
        overflow-y: auto;
        max-height: 400px;
    }
    .ntf-item {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 12px 16px;
        border: none;
        background: none;
        width: 100%;
        text-align: left;
        cursor: pointer;
        transition: background 0.15s;
        border-bottom: 1px solid #f9fafb;
    }
    .ntf-item:hover {
        background: #f9fafb;
    }
    :is(.dark) .ntf-item {
        border-bottom-color: rgb(30, 35, 45);
    }
    :is(.dark) .ntf-item:hover {
        background: rgb(30, 35, 45);
    }
    .ntf-item-unread {
        background: #fefce8;
    }
    :is(.dark) .ntf-item-unread {
        background: rgb(25, 28, 20);
    }
    .ntf-item-read {
        opacity: 0.7;
    }
    .ntf-item-icon {
        width: 32px;
        height: 32px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .ntf-item-icon-svg {
        width: 18px;
        height: 18px;
    }
    .ntf-color-info { background: #dbeafe; color: #2563eb; }
    .ntf-color-success { background: #dcfce7; color: #16a34a; }
    .ntf-color-warning { background: #fef3c7; color: #d97706; }
    .ntf-color-danger { background: #fee2e2; color: #dc2626; }
    .ntf-color-primary { background: #e0e7ff; color: #4f46e5; }
    .ntf-color-gray { background: #f3f4f6; color: #6b7280; }
    :is(.dark) .ntf-color-info { background: rgba(37,99,235,0.15); }
    :is(.dark) .ntf-color-success { background: rgba(22,163,74,0.15); }
    :is(.dark) .ntf-color-warning { background: rgba(217,119,6,0.15); }
    :is(.dark) .ntf-color-danger { background: rgba(220,38,38,0.15); }
    :is(.dark) .ntf-color-primary { background: rgba(79,70,229,0.15); }
    :is(.dark) .ntf-color-gray { background: rgba(107,114,128,0.15); }
    .ntf-item-content {
        flex: 1;
        min-width: 0;
    }
    .ntf-item-title {
        font-size: 13px;
        font-weight: 600;
        color: #111827;
        line-height: 1.3;
    }
    :is(.dark) .ntf-item-title {
        color: #f3f4f6;
    }
    .ntf-item-body {
        font-size: 12px;
        color: #6b7280;
        margin-top: 2px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .ntf-item-date {
        font-size: 11px;
        color: #9ca3af;
        margin-top: 3px;
    }
    .ntf-item-dot {
        width: 8px;
        height: 8px;
        background: #ef4444;
        border-radius: 50%;
        flex-shrink: 0;
        margin-top: 4px;
    }
    .ntf-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        padding: 32px 16px;
        color: #9ca3af;
        font-size: 13px;
    }
    .ntf-empty-icon {
        width: 28px;
        height: 28px;
        color: #d1d5db;
    }
    @media (max-width: 480px) {
        .ntf-dropdown {
            width: 300px;
            right: -40px;
        }
    }

    /* ========================================
       Announcements (ann-) Styles
       ======================================== */
    .ann-form-modal {
        max-width: 600px;
        width: 95%;
        text-align: left;
        max-height: 85vh;
        display: flex;
        flex-direction: column;
    }
    .ann-form-title {
        text-align: left;
    }
    .ann-form-fields {
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin-top: 16px;
        overflow-y: auto;
        max-height: 55vh;
        padding-right: 4px;
    }
    .ann-form-actions {
        margin-top: 20px;
        justify-content: flex-end;
    }
    .ann-textarea {
        resize: vertical;
        min-height: 100px;
    }
    .ann-title-priority-row {
        display: grid;
        grid-template-columns: 3fr 1fr;
        gap: 12px;
        align-items: start;
    }
    @media (max-width: 640px) {
        .ann-title-priority-row {
            grid-template-columns: 1fr;
        }
    }
    .ann-title-priority-content {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .ann-title-priority-select {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .ann-targets-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    @media (max-width: 640px) {
        .ann-targets-row {
            grid-template-columns: 1fr;
        }
    }
    .ann-target-card {
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        padding: 14px;
        background: #fafafa;
    }
    :is(.dark) .ann-target-card {
        border-color: rgb(55, 65, 81);
        background: rgb(24, 28, 36);
    }
    .ann-target-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
    }
    .ann-target-header-left {
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .ann-target-icon {
        width: 18px;
        height: 18px;
        color: #6366f1;
    }
    .ann-target-title {
        font-size: 13px;
        font-weight: 600;
        color: #374151;
    }
    :is(.dark) .ann-target-title {
        color: #d1d5db;
    }
    .ann-target-toggle {
        display: flex;
        align-items: center;
        gap: 6px;
        cursor: pointer;
    }
    .ann-target-toggle-label {
        font-size: 12px;
        font-weight: 500;
        color: #6b7280;
    }
    .ann-target-all-info {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        color: #16a34a;
        padding: 8px 0 2px;
    }
    .ann-target-all-icon {
        width: 16px;
        height: 16px;
    }
    .ann-selected-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-bottom: 8px;
    }
    .ann-tag {
        display: inline-flex;
        align-items: center;
        padding: 2px 8px;
        background: #dbeafe;
        color: #1d4ed8;
        border-radius: 6px;
        font-size: 11px;
        font-weight: 500;
    }
    :is(.dark) .ann-tag {
        background: rgba(59, 130, 246, 0.2);
        color: #93c5fd;
    }
    .ann-tag-purple {
        background: #ede9fe;
        color: #6d28d9;
    }
    :is(.dark) .ann-tag-purple {
        background: rgba(139, 92, 246, 0.2);
        color: #c4b5fd;
    }
    .ann-search-wrap {
        position: relative;
        margin-bottom: 6px;
    }
    .ann-search-icon {
        position: absolute;
        left: 8px;
        top: 50%;
        transform: translateY(-50%);
        width: 14px;
        height: 14px;
        color: #9ca3af;
    }
    .ann-search-input {
        width: 100%;
        padding: 6px 8px 6px 28px;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        font-size: 12px;
        background: #fff;
    }
    :is(.dark) .ann-search-input {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
        color: #d1d5db;
    }
    .ann-search-input:focus {
        outline: none;
        border-color: #6366f1;
    }
    .ann-option-list {
        display: flex;
        flex-direction: column;
        gap: 1px;
        max-height: 150px;
        overflow-y: auto;
    }
    .ann-option-item {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 8px;
        border-radius: 6px;
        cursor: pointer;
        transition: background 0.15s;
    }
    .ann-option-item:hover {
        background: #f3f4f6;
    }
    :is(.dark) .ann-option-item:hover {
        background: rgb(35, 40, 50);
    }
    .ann-option-check {
        width: 16px;
        height: 16px;
        accent-color: #6366f1;
        cursor: pointer;
        flex-shrink: 0;
    }
    .ann-option-name {
        font-size: 13px;
        color: #374151;
    }
    :is(.dark) .ann-option-name {
        color: #d1d5db;
    }
    .ann-detail-modal {
        max-width: 520px;
        width: 95%;
    }
    .ann-detail-icon {
        width: 32px;
        height: 32px;
        color: #f59e0b;
    }
    .ann-detail-content {
        font-size: 14px;
        line-height: 1.7;
        color: #374151;
        margin-top: 12px;
        max-height: 300px;
        overflow-y: auto;
    }
    :is(.dark) .ann-detail-content {
        color: #d1d5db;
    }
    .ann-detail-meta {
        font-size: 12px;
        color: #9ca3af;
        margin-top: 14px;
        margin-bottom: 16px;
        text-align: center;
    }
    .ann-popup-overlay {
        z-index: 250;
    }
    .ann-popup-modal {
        max-width: 480px;
        width: 95%;
    }
    .ann-popup-megaphone {
        width: 32px;
        height: 32px;
        color: #f59e0b;
    }
    .ann-popup-content {
        font-size: 14px;
        line-height: 1.7;
        color: #374151;
        margin-top: 12px;
        max-height: 250px;
        overflow-y: auto;
    }
    :is(.dark) .ann-popup-content {
        color: #d1d5db;
    }
    .ann-popup-meta {
        font-size: 12px;
        color: #9ca3af;
        margin-top: 14px;
        margin-bottom: 16px;
        text-align: center;
    }

    /* ========================================
       Dashboard Heatmap (hm-dash-) Styles
       ======================================== */
    :root {
        --hm-dash-empty: #f3f4f6;
        --hm-dash-low: #c7d2fe;
        --hm-dash-mid: #818cf8;
        --hm-dash-high: #6366f1;
        --hm-dash-peak: #4338ca;
    }
    :is(.dark) {
        --hm-dash-empty: rgb(30, 35, 45);
        --hm-dash-low: rgba(99, 102, 241, 0.2);
        --hm-dash-mid: rgba(99, 102, 241, 0.45);
        --hm-dash-high: rgba(99, 102, 241, 0.7);
        --hm-dash-peak: rgba(99, 102, 241, 0.95);
    }
    .hm-dash-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }
    .hm-dash-link {
        font-size: 12px;
        font-weight: 500;
        color: #6366f1;
        text-decoration: none;
    }
    .hm-dash-link:hover {
        text-decoration: underline;
    }
    .hm-dash-grid {
        display: grid;
        grid-template-columns: 36px repeat(24, 1fr);
        gap: 2px;
        overflow-x: auto;
    }
    .hm-dash-corner {
        width: 36px;
    }
    .hm-dash-hour {
        font-size: 9px;
        color: #9ca3af;
        text-align: center;
        padding-bottom: 2px;
    }
    .hm-dash-day {
        font-size: 11px;
        font-weight: 600;
        color: #6b7280;
        display: flex;
        align-items: center;
        padding-right: 4px;
    }
    :is(.dark) .hm-dash-day {
        color: #9ca3af;
    }
    .hm-dash-cell {
        aspect-ratio: 1;
        border-radius: 3px;
        min-width: 12px;
        cursor: default;
        transition: transform 0.1s;
    }
    .hm-dash-cell:hover {
        transform: scale(1.3);
        z-index: 1;
    }
    .hm-dash-legend {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        margin-top: 10px;
    }
    .hm-dash-legend-label {
        font-size: 10px;
        color: #9ca3af;
    }
    .hm-dash-legend-box {
        width: 14px;
        height: 14px;
        border-radius: 3px;
    }

    /* ========================================
       Platform Status (ps-) Styles
       ======================================== */
    .ps-section-label {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #6366f1;
        margin-bottom: 10px;
    }
    :is(.dark) .ps-section-label {
        color: #818cf8;
    }
    .ps-section-label-mt {
        margin-top: 20px;
    }
    .ps-refresh-info {
        margin-left: auto;
        cursor: help;
        position: relative;
    }
    .ps-refresh-info::after {
        content: attr(data-tooltip);
        position: absolute;
        right: 0;
        top: 100%;
        margin-top: 4px;
        background: #1f2937;
        color: #fff;
        font-size: 11px;
        font-weight: 400;
        text-transform: none;
        letter-spacing: 0;
        padding: 4px 10px;
        border-radius: 6px;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s;
        z-index: 10;
    }
    .ps-refresh-info:hover::after {
        opacity: 1;
    }
    .ps-refresh-icon {
        width: 16px;
        height: 16px;
        color: #9ca3af;
    }
    .ps-refresh-icon:hover {
        color: #6366f1;
    }
    .ps-section-icon {
        width: 16px;
        height: 16px;
    }
    .ps-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
        gap: 10px;
    }
    .ps-card {
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        padding: 14px;
        text-align: center;
        transition: all 0.2s;
    }
    :is(.dark) .ps-card {
        border-color: rgb(55, 65, 81);
    }
    .ps-card-open {
        background: #f0fdf4;
        border-color: #bbf7d0;
    }
    :is(.dark) .ps-card-open {
        background: rgba(22, 163, 74, 0.08);
        border-color: rgba(22, 163, 74, 0.3);
    }
    .ps-card-closed {
        background: #fef2f2;
        border-color: #fecaca;
    }
    :is(.dark) .ps-card-closed {
        background: rgba(220, 38, 38, 0.08);
        border-color: rgba(220, 38, 38, 0.3);
    }
    .ps-card-loading {
        background: #f9fafb;
    }
    :is(.dark) .ps-card-loading {
        background: rgb(24, 28, 36);
    }
    .ps-card-error {
        background: #fffbeb;
        border-color: #fde68a;
    }
    :is(.dark) .ps-card-error {
        background: rgba(245, 158, 11, 0.08);
        border-color: rgba(245, 158, 11, 0.3);
    }
    .ps-card-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 8px;
    }
    .ps-card-icon {
        width: 22px;
        height: 22px;
        color: #6b7280;
    }
    .ps-card-emoji {
        font-size: 18px;
    }
    .ps-card-spinner {
        width: 16px;
        height: 16px;
    }
    .ps-card-dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        flex-shrink: 0;
    }
    .ps-dot-open {
        background: #16a34a;
        box-shadow: 0 0 6px rgba(22, 163, 74, 0.5);
    }
    .ps-dot-closed {
        background: #dc2626;
        box-shadow: 0 0 6px rgba(220, 38, 38, 0.5);
    }
    .ps-dot-error {
        background: #f59e0b;
    }
    .ps-card-name {
        font-size: 13px;
        font-weight: 600;
        color: #374151;
    }
    :is(.dark) .ps-card-name {
        color: #d1d5db;
    }
    .ps-card-status {
        font-size: 11px;
        font-weight: 500;
        color: #6b7280;
        margin-top: 2px;
    }
    @media (max-width: 640px) {
        .ps-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    /* ========================================
       Branch Products (bp-) Styles
       ======================================== */
    .bp-deactivate-modal {
        max-width: 480px;
        width: 95%;
    }
    .bp-deactivate-icon {
        width: 32px;
        height: 32px;
        color: #f59e0b;
    }
    .bp-duration-options {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin: 16px 0 20px;
    }
    .bp-duration-option {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 14px;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        cursor: pointer;
        transition: all 0.15s;
    }
    .bp-duration-option:hover {
        border-color: #6366f1;
        background: #fafafe;
    }
    :is(.dark) .bp-duration-option {
        border-color: rgb(55, 65, 81);
    }
    :is(.dark) .bp-duration-option:hover {
        border-color: #818cf8;
        background: rgb(30, 28, 50);
    }
    .bp-duration-active {
        border-color: #6366f1;
        background: #eef2ff;
    }
    :is(.dark) .bp-duration-active {
        border-color: #818cf8;
        background: rgb(30, 28, 50);
    }
    .bp-duration-radio {
        display: none;
    }
    .bp-duration-content {
        display: flex;
        align-items: center;
        gap: 10px;
        flex: 1;
        text-align: left;
    }
    .bp-duration-text-wrap {
        flex: 1;
    }
    .bp-duration-opt-icon {
        width: 20px;
        height: 20px;
        color: #6366f1;
        flex-shrink: 0;
    }
    .bp-duration-label {
        display: block;
        font-size: 14px;
        font-weight: 600;
        color: #111827;
    }
    :is(.dark) .bp-duration-label {
        color: #f3f4f6;
    }
    .bp-duration-desc {
        display: block;
        font-size: 11px;
        color: #9ca3af;
        margin-top: 1px;
    }
    .bp-custom-hours-inline {
        display: flex;
        align-items: center;
        gap: 6px;
        margin-left: auto;
    }
    .bp-custom-input {
        width: 70px;
        padding: 4px 8px;
        border: 1px solid #d1d5db;
        border-radius: 6px;
        font-size: 13px;
        text-align: center;
        background: #fff;
    }
    :is(.dark) .bp-custom-input {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
        color: #d1d5db;
    }
    .bp-custom-suffix {
        font-size: 13px;
        color: #6b7280;
        font-weight: 500;
    }

    /* ========================================
       Tickets (tkt-) Styles
       ======================================== */
    .tkt-form-modal {
        max-width: 640px;
        width: 95%;
        text-align: left;
        max-height: 85vh;
        display: flex;
        flex-direction: column;
    }
    .tkt-upload-area {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 24px 16px;
        border: 2px dashed #d1d5db;
        border-radius: 10px;
        cursor: pointer;
        transition: border-color 0.2s, background 0.2s;
        background: #fafafa;
    }
    .tkt-upload-area:hover {
        border-color: #6366f1;
        background: #f5f3ff;
    }
    :is(.dark) .tkt-upload-area {
        border-color: rgb(55, 65, 81);
        background: rgb(24, 28, 36);
    }
    :is(.dark) .tkt-upload-area:hover {
        border-color: #818cf8;
        background: rgb(30, 28, 50);
    }
    .tkt-upload-native {
        display: none;
    }
    .tkt-upload-icon {
        width: 32px;
        height: 32px;
        color: #9ca3af;
    }
    .tkt-upload-text {
        font-size: 14px;
        font-weight: 500;
        color: #374151;
    }
    :is(.dark) .tkt-upload-text {
        color: #d1d5db;
    }
    .tkt-upload-hint {
        font-size: 11px;
        color: #9ca3af;
    }
    .tkt-upload-preview {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: 8px;
    }
    .tkt-reply-upload {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 14px;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        cursor: pointer;
        font-size: 13px;
        color: #6b7280;
        transition: border-color 0.15s;
    }
    .tkt-reply-upload:hover {
        border-color: #6366f1;
        color: #6366f1;
    }
    :is(.dark) .tkt-reply-upload {
        border-color: rgb(55, 65, 81);
        color: #9ca3af;
    }
    :is(.dark) .tkt-reply-upload:hover {
        border-color: #818cf8;
        color: #818cf8;
    }
    .tkt-reply-upload-icon {
        width: 16px;
        height: 16px;
    }
    .tkt-reply-actions {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .tkt-reply-attach-row {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .tkt-upload-loading {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        color: #6366f1;
        font-weight: 500;
    }
    .tkt-upload-spinner {
        width: 16px;
        height: 16px;
    }
    .tkt-upload-check {
        width: 12px;
        height: 12px;
        color: #16a34a;
    }
    .tkt-default-info {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
        color: #6b7280;
        flex-wrap: wrap;
    }
    .tkt-default-info-icon {
        width: 20px;
        height: 20px;
        color: #3b82f6;
        flex-shrink: 0;
    }
    .tkt-default-info-title {
        font-weight: 600;
        margin-right: 4px;
    }
    .tkt-default-badge {
        margin: 2px;
    }
    .tkt-header {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .tkt-header-top {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
    }
    .tkt-header-subject {
        font-size: 18px;
        font-weight: 700;
        color: #111827;
        margin: 0;
    }
    :is(.dark) .tkt-header-subject {
        color: #f3f4f6;
    }
    .tkt-header-badges {
        display: flex;
        gap: 6px;
        flex-shrink: 0;
    }
    .tkt-header-meta {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
        font-size: 13px;
        color: #6b7280;
    }
    .tkt-header-meta span {
        display: flex;
        align-items: center;
        gap: 4px;
        border: 1px solid #e5e7eb;
        padding: 5px 10px;
        border-radius: 6px;
        background: #f3f4f6;
        font-weight: 500;
    }
    :is(.dark) .tkt-header-meta span {
        border-color: rgb(55, 65, 81);
        background: rgb(30, 35, 45);
    }
    .tkt-meta-icon {
        width: 14px;
        height: 14px;
    }
    .tkt-status-change {
        display: flex;
        align-items: center;
        gap: 8px;
        padding-top: 8px;
        border-top: 1px solid #f3f4f6;
    }
    :is(.dark) .tkt-status-change {
        border-top-color: rgb(55, 65, 81);
    }
    .tkt-status-select {
        padding: 6px 10px;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-size: 13px;
        background: #fff;
    }
    :is(.dark) .tkt-status-select {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
        color: #d1d5db;
    }
    .tkt-thread {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 4px;
    }
    .tkt-msg {
        border-radius: 12px;
        padding: 16px;
        border: 1px solid #e5e7eb;
    }
    :is(.dark) .tkt-msg {
        border-color: rgb(55, 65, 81);
    }
    .tkt-msg-branch {
        background: #fff;
        margin-right: 40px;
    }
    :is(.dark) .tkt-msg-branch {
        background: rgb(17, 24, 39);
    }
    .tkt-msg-head {
        background: #eff6ff;
        margin-left: 40px;
        border-color: #bfdbfe;
    }
    :is(.dark) .tkt-msg-head {
        background: rgb(20, 30, 50);
        border-color: rgb(40, 60, 100);
    }
    .tkt-msg-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 8px;
    }
    .tkt-msg-author {
        font-weight: 600;
        font-size: 13px;
        color: #374151;
        display: flex;
        align-items: center;
        gap: 6px;
    }
    :is(.dark) .tkt-msg-author {
        color: #d1d5db;
    }
    .tkt-msg-badge {
        font-size: 10px;
    }
    .tkt-msg-date {
        font-size: 12px;
        color: #9ca3af;
    }
    .tkt-msg-body {
        font-size: 14px;
        line-height: 1.7;
        color: #374151;
    }
    :is(.dark) .tkt-msg-body {
        color: #d1d5db;
    }
    .tkt-msg-files {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid #e5e7eb;
    }
    :is(.dark) .tkt-msg-files {
        border-top-color: rgb(55, 65, 81);
    }
    .tkt-file-link {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 4px 10px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        font-size: 12px;
        color: #2563eb;
        text-decoration: none;
        transition: background 0.15s;
    }
    .tkt-file-link:hover {
        background: #eff6ff;
    }
    :is(.dark) .tkt-file-link {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
        color: #60a5fa;
    }
    :is(.dark) .tkt-file-link:hover {
        background: rgb(35, 40, 55);
    }
    .tkt-file-icon {
        width: 14px;
        height: 14px;
    }
    .tkt-file-size {
        color: #9ca3af;
    }
    .tkt-reply-form {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .tkt-reply-bottom {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
    .tkt-reply-file-wrap {
        flex: 1;
    }
    .tkt-closed-info {
        display: flex;
        align-items: center;
        gap: 8px;
        justify-content: center;
        padding: 12px;
        color: #6b7280;
        font-size: 14px;
    }
    .tkt-close-warn-icon {
        width: 32px;
        height: 32px;
        color: #ef4444;
    }
    .tkt-closed-icon {
        width: 20px;
        height: 20px;
        color: #9ca3af;
    }
    .tkt-popup-icon {
        width: 32px;
        height: 32px;
        color: #2563eb;
    }
    .tkt-popup-subject {
        font-size: 13px;
        font-weight: 600;
        color: #6366f1;
        margin-bottom: 4px;
    }
    :is(.dark) .tkt-popup-subject {
        color: #818cf8;
    }
    .tkt-popup-branch {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        font-size: 12px;
        color: #6b7280;
        margin-bottom: 6px;
    }
    @media (max-width: 768px) {
        .tkt-msg-branch { margin-right: 0; }
        .tkt-msg-head { margin-left: 0; }
        .tkt-reply-bottom { flex-direction: column; align-items: stretch; }
    }

    /* ========================================
       Courier Tracking (ct-) Styles
       ======================================== */
    .ct-map-container {
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid #e5e7eb;
    }
    :is(.dark) .ct-map-container {
        border-color: rgb(55, 65, 81);
    }
    .ct-map {
        width: 100%;
        height: 450px;
    }
    .ct-legend {
        display: flex;
        align-items: center;
        gap: 20px;
        padding: 12px 0 0;
        flex-wrap: wrap;
    }
    .ct-legend-item {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        color: #6b7280;
    }
    :is(.dark) .ct-legend-item {
        color: #9ca3af;
    }
    .ct-legend-dot {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        border: 2px solid #fff;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    }
    :is(.dark) .ct-legend-dot {
        border-color: rgb(31, 41, 55);
    }
    .ct-dot-restaurant {
        background: #ef4444;
    }
    .ct-dot-idle {
        background: #16a34a;
    }
    .ct-dot-busy {
        background: #f97316;
    }
    .ct-row {
        border-bottom: 1px solid #f3f4f6;
    }
    :is(.dark) .ct-row {
        border-bottom-color: rgb(55, 65, 81);
    }
    .ct-avatar-busy {
        background: #fff7ed;
        color: #f97316;
    }
    :is(.dark) .ct-avatar-busy {
        background: rgba(249, 115, 22, 0.2);
        color: #fb923c;
    }
    @media (max-width: 768px) {
        .ct-map {
            height: 300px;
        }
    }

    /* ===== Campaign & Loyalty Styles ===== */

    /* Loyalty Settings */
    .loyalty-readonly-info { display: flex; align-items: center; gap: 8px; color: rgba(var(--gray-500), 1); }
    .loyalty-readonly-icon { width: 20px; height: 20px; }
    .loyalty-settings-grid { display: flex; flex-direction: column; gap: 1.25rem; }
    .loyalty-setting-row { display: flex; align-items: flex-start; gap: 1rem; }
    .loyalty-setting-label { font-size: 0.875rem; font-weight: 600; color: rgba(var(--gray-700), 1); min-width: 200px; padding-top: 8px; }
    :is(.dark) .loyalty-setting-label { color: rgba(var(--gray-300), 1); }
    .loyalty-setting-input-wrap { display: flex; flex-direction: column; gap: 4px; flex: 1; }
    .loyalty-input { width: 100%; max-width: 300px; padding: 8px 12px; border: 1px solid rgba(var(--gray-300), 1); border-radius: 8px; font-size: 0.875rem; background: #fff; color: rgba(var(--gray-900), 1); outline: none; }
    .loyalty-input:focus { border-color: rgba(var(--primary-500), 1); box-shadow: 0 0 0 1px rgba(var(--primary-500), 0.2); }
    :is(.dark) .loyalty-input { background: rgba(var(--gray-800), 1); border-color: rgba(var(--gray-600), 1); color: rgba(var(--gray-200), 1); }
    .loyalty-setting-hint { font-size: 0.75rem; color: rgba(var(--gray-500), 1); }
    .loyalty-payment-checkboxes { display: flex; flex-wrap: wrap; gap: 12px; }
    .loyalty-payment-checkbox { display: flex; align-items: center; gap: 6px; font-size: 0.875rem; cursor: pointer; }
    .loyalty-payment-checkbox input[type="checkbox"] { width: 16px; height: 16px; accent-color: rgba(var(--primary-500), 1); cursor: pointer; }
    .loyalty-save-wrap { display: flex; justify-content: flex-end; margin-top: 1rem; }
    .loyalty-save-btn { display: flex; align-items: center; gap: 6px; padding: 10px 24px; background: #10b981; color: #fff; border: none; border-radius: 8px; font-size: 0.875rem; font-weight: 600; cursor: pointer; transition: background 0.15s; }
    .loyalty-save-btn:hover { background: #059669; }
    .loyalty-save-icon { width: 18px; height: 18px; }

    /* Campaign Templates */
    .campaign-templates-header { text-align: center; margin-bottom: 1.5rem; }
    .campaign-templates-title { font-size: 1.25rem; font-weight: 700; color: rgba(var(--gray-900), 1); }
    :is(.dark) .campaign-templates-title { color: rgba(var(--gray-100), 1); }
    .campaign-templates-desc { font-size: 0.875rem; color: rgba(var(--gray-500), 1); margin-top: 4px; }
    .campaign-templates-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
    .campaign-template-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 24px; display: flex; flex-direction: column; align-items: center; text-align: center; transition: all 0.2s; cursor: pointer; }
    .campaign-template-card:hover { border-color: #6366f1; box-shadow: 0 4px 16px rgba(0,0,0,0.1); transform: translateY(-2px); }
    :is(.dark) .campaign-template-card { background: rgb(24, 28, 36); border-color: rgb(55, 65, 81); }
    :is(.dark) .campaign-template-card:hover { border-color: #818cf8; }
    .campaign-template-icon-wrap { width: 56px; height: 56px; border-radius: 50%; background: #eef2ff; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
    :is(.dark) .campaign-template-icon-wrap { background: rgba(99, 102, 241, 0.15); }
    .campaign-template-icon { width: 28px; height: 28px; color: #6366f1; }
    .campaign-template-title { font-size: 15px; font-weight: 600; color: #111827; margin-bottom: 6px; }
    :is(.dark) .campaign-template-title { color: #f3f4f6; }
    .campaign-template-desc { font-size: 13px; color: #6b7280; margin-bottom: 16px; line-height: 1.6; flex: 1; }
    .campaign-template-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 20px; background: #6366f1; color: #fff; border-radius: 8px; font-size: 13px; font-weight: 600; text-decoration: none; transition: background 0.15s; margin-top: auto; }
    .campaign-template-btn:hover { background: #4f46e5; color: #fff; }
    .campaign-template-btn-icon { width: 16px; height: 16px; }
    .campaign-templates-empty { text-align: center; padding: 3rem 1rem; color: rgba(var(--gray-400), 1); }
    .campaign-templates-empty-icon { width: 48px; height: 48px; margin: 0 auto 12px; }

    /* Campaign Edit */
    .campaign-edit-template-banner { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: rgba(var(--primary-50), 1); border: 1px solid rgba(var(--primary-200), 1); border-radius: 10px; margin-bottom: 1rem; }
    :is(.dark) .campaign-edit-template-banner { background: rgba(99, 102, 241, 0.1); border-color: rgba(99, 102, 241, 0.3); }
    .campaign-edit-template-icon { width: 28px; height: 28px; color: #6366f1; flex-shrink: 0; }
    .campaign-edit-template-desc { display: block; font-size: 13px; color: #6b7280; margin-top: 2px; }
    .campaign-edit-lang-select { margin-bottom: 1rem; }
    .campaign-edit-lang-dropdown { max-width: 200px; }
    .campaign-edit-form {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .campaign-edit-form > div[x-show] {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .ce-tooltip {
        position: relative;
        cursor: help;
        display: inline-flex;
        margin-left: 4px;
    }
    .ce-tooltip-icon {
        width: 16px;
        height: 16px;
        color: #9ca3af;
    }
    .ce-tooltip-icon:hover {
        color: #6366f1;
    }
    .ce-tooltip::after {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        margin-bottom: 6px;
        background: #1f2937;
        color: #fff;
        font-size: 12px;
        font-weight: 400;
        padding: 6px 10px;
        border-radius: 6px;
        white-space: nowrap;
        max-width: 280px;
        white-space: normal;
        text-align: center;
        line-height: 1.4;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s;
        z-index: 50;
    }
    .ce-tooltip:hover::after {
        opacity: 1;
    }
    .campaign-edit-fields {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .campaign-edit-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
    .campaign-edit-row-3 {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 16px;
    }
    @media (max-width: 768px) {
        .campaign-edit-row-3 { grid-template-columns: 1fr; }
    }
    @media (max-width: 640px) {
        .campaign-edit-row { grid-template-columns: 1fr; }
    }
    .campaign-edit-input {
        width: 100%;
        padding: 0.5rem 0.75rem;
        border: 1px solid var(--input-border-color, #d1d5db);
        border-radius: var(--radius-lg, 0.5rem);
        font-size: 0.875rem;
        line-height: 1.5rem;
        background: var(--input-bg, #fff);
        color: inherit;
        outline: none;
        transition: border-color 0.15s;
    }
    .campaign-edit-input:focus {
        border-color: var(--primary-500, #6366f1);
        box-shadow: 0 0 0 1px var(--primary-500, #6366f1);
    }
    :is(.dark) .campaign-edit-input {
        background: rgb(255 255 255 / 0.05);
        border-color: rgb(255 255 255 / 0.1);
    }
    :is(.dark) .campaign-edit-input:focus {
        border-color: var(--primary-500, #6366f1);
    }
    .campaign-edit-textarea {
        min-height: 80px;
        resize: vertical;
    }
    .campaign-edit-hint {
        font-size: 12px;
        color: #9ca3af;
        margin-top: 4px;
        display: block;
    }
    .campaign-edit-hint.branch-error,
    .branch-error {
        color: #ef4444;
        font-weight: 500;
    }
    .campaign-edit-branch-list {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 8px;
    }
    .campaign-edit-branch-item {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 14px;
        cursor: pointer;
        padding: 8px 14px;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        background: #f9fafb;
        transition: all 0.15s;
    }
    .campaign-edit-branch-item:has(input:checked) {
        border-color: #6366f1;
        background: #eef2ff;
    }
    :is(.dark) .campaign-edit-branch-item {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
    }
    :is(.dark) .campaign-edit-branch-item:has(input:checked) {
        border-color: #818cf8;
        background: rgba(99, 102, 241, 0.15);
    }
    .campaign-edit-branch-item input[type="checkbox"] {
        accent-color: #6366f1;
    }
    .ce-image-wrap {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .ce-image-preview {
        position: relative;
        display: inline-block;
        width: 120px;
    }
    .ce-image-thumb {
        width: 120px;
        height: 80px;
        object-fit: cover;
        border-radius: 8px;
        border: 1px solid #e5e7eb;
    }
    :is(.dark) .ce-image-thumb {
        border-color: rgb(55, 65, 81);
    }
    .ce-image-remove {
        position: absolute;
        top: -6px;
        right: -6px;
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background: #ef4444;
        color: #fff;
        border: 2px solid #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
    }
    .ce-image-remove-icon {
        width: 12px;
        height: 12px;
    }
    .ce-image-select-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 160px;
        height: 100px;
        border: 2px dashed #d1d5db;
        border-radius: 10px;
        background: none;
        cursor: pointer;
        color: #9ca3af;
        transition: all 0.15s;
    }
    .ce-image-select-btn:hover {
        border-color: #6366f1;
        color: #6366f1;
    }
    :is(.dark) .ce-image-select-btn {
        border-color: rgb(55, 65, 81);
    }
    :is(.dark) .ce-image-select-btn:hover {
        border-color: #818cf8;
        color: #818cf8;
    }
    .ce-image-select-icon {
        width: 28px;
        height: 28px;
    }
    .ce-image-select-btn span {
        font-size: 12px;
        font-weight: 500;
    }
    .ce-branch-wrap {
        position: relative;
    }
    .ce-branch-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 12px;
    }
    .ce-branch-toggle {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 500;
        color: #374151;
        cursor: pointer;
    }
    :is(.dark) .ce-branch-toggle {
        color: #d1d5db;
    }
    .ce-branch-count {
        font-size: 12px;
        font-weight: 600;
        color: #6366f1;
        background: #eef2ff;
        padding: 3px 10px;
        border-radius: 99px;
    }
    :is(.dark) .ce-branch-count {
        background: rgba(99, 102, 241, 0.15);
        color: #818cf8;
    }
    .ce-branch-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 12px;
    }
    .ce-branch-chip {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 4px 10px;
        background: #eef2ff;
        color: #4338ca;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 500;
    }
    :is(.dark) .ce-branch-chip {
        background: rgba(99, 102, 241, 0.15);
        color: #a5b4fc;
    }
    .ce-branch-chip-icon {
        width: 12px;
        height: 12px;
    }
    .ce-branch-select-btn {
        display: flex;
        align-items: center;
        gap: 6px;
        width: 100%;
        padding: 10px 14px;
        border: 1px dashed #d1d5db;
        border-radius: 8px;
        background: none;
        cursor: pointer;
        font-size: 14px;
        color: #6b7280;
        transition: all 0.15s;
    }
    .ce-branch-select-btn:hover {
        border-color: #6366f1;
        color: #6366f1;
    }
    :is(.dark) .ce-branch-select-btn {
        border-color: rgb(55, 65, 81);
        color: #9ca3af;
    }
    :is(.dark) .ce-branch-select-btn:hover {
        border-color: #818cf8;
        color: #818cf8;
    }
    .ce-branch-select-icon {
        width: 18px;
        height: 18px;
    }
    .ce-branch-arrow {
        width: 16px;
        height: 16px;
        margin-left: auto;
        transition: transform 0.2s;
    }
    .ce-branch-arrow-open {
        transform: rotate(180deg);
    }
    .ce-branch-dropdown {
        position: absolute;
        left: 0;
        right: 0;
        z-index: 50;
        margin-top: 4px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.12);
        overflow: hidden;
    }
    :is(.dark) .ce-branch-dropdown {
        background: rgb(17, 24, 39);
        border-color: rgb(55, 65, 81);
    }
    .ce-branch-search {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 14px;
        border-bottom: 1px solid #f3f4f6;
    }
    :is(.dark) .ce-branch-search {
        border-bottom-color: rgb(55, 65, 81);
    }
    .ce-branch-search-icon {
        width: 16px;
        height: 16px;
        color: #9ca3af;
        flex-shrink: 0;
    }
    .ce-branch-search-input {
        width: 100%;
        border: none;
        outline: none;
        font-size: 13px;
        background: transparent;
        color: #111827;
    }
    :is(.dark) .ce-branch-search-input {
        color: #d1d5db;
    }
    .ce-branch-list {
        max-height: 220px;
        overflow-y: auto;
    }
    .ce-branch-item {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 14px;
        cursor: pointer;
        transition: background 0.1s;
        font-size: 13px;
    }
    .ce-branch-item:hover {
        background: #f9fafb;
    }
    :is(.dark) .ce-branch-item:hover {
        background: rgb(30, 35, 45);
    }
    .ce-branch-item:has(input:checked) {
        background: #eef2ff;
    }
    :is(.dark) .ce-branch-item:has(input:checked) {
        background: rgba(99, 102, 241, 0.1);
    }
    .ce-branch-check {
        width: 16px;
        height: 16px;
        accent-color: #6366f1;
        flex-shrink: 0;
    }
    .ce-branch-item-icon {
        width: 14px;
        height: 14px;
        color: #9ca3af;
        flex-shrink: 0;
    }
    .ce-branch-item-name {
        color: #374151;
    }
    :is(.dark) .ce-branch-item-name {
        color: #d1d5db;
    }
    .campaign-edit-save-wrap {
        display: flex;
        justify-content: flex-end;
        gap: 12px;
        margin-top: 24px;
    }
    .campaign-edit-cancel-btn {
        display: flex;
        align-items: center;
        padding: 10px 24px;
        background: #f3f4f6;
        color: #374151;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
        cursor: pointer;
        transition: background 0.15s;
    }
    .campaign-edit-cancel-btn:hover {
        background: #e5e7eb;
    }
    :is(.dark) .campaign-edit-cancel-btn {
        background: rgb(55, 65, 81);
        color: #d1d5db;
        border-color: rgb(75, 85, 99);
    }
    .campaign-edit-save-btn {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 10px 24px;
        background: #16a34a;
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 600;
        cursor: pointer;
        transition: background 0.15s;
    }
    .campaign-edit-save-btn:hover {
        background: #15803d;
    }
    .campaign-edit-save-btn:disabled,
    .campaign-edit-save-btn[disabled] {
        background: #16a34a;
        opacity: 0.7;
        cursor: not-allowed;
    }
    .campaign-edit-save-btn:disabled:hover,
    .campaign-edit-save-btn[disabled]:hover {
        background: #16a34a;
    }
    .campaign-edit-save-icon { width: 18px; height: 18px; }
    .branch-spinner { animation: branch-spin 0.8s linear infinite; }
    .branch-spinner-track { opacity: 0.25; }
    .branch-spinner-head { opacity: 0.95; }
    @keyframes branch-spin { to { transform: rotate(360deg); } }

    /* === CAMPAIGN TABS === */
    .ce-tabs {
        display: flex;
        gap: 4px;
        flex-wrap: wrap;
        padding: 4px;
        background: #f3f4f6;
        border-radius: 10px;
        margin-bottom: 4px;
    }
    :is(.dark) .ce-tabs {
        background: rgb(31, 41, 55);
    }
    .ce-tab {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 8px 14px;
        border: none;
        border-radius: 8px;
        background: transparent;
        font-size: 13px;
        font-weight: 500;
        color: #6b7280;
        cursor: pointer;
        transition: all 0.15s;
        white-space: nowrap;
    }
    .ce-tab:hover {
        color: #374151;
        background: rgba(255, 255, 255, 0.5);
    }
    :is(.dark) .ce-tab:hover {
        color: #d1d5db;
        background: rgba(255, 255, 255, 0.05);
    }
    .ce-tab-active {
        background: #fff;
        color: #6366f1;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    }
    :is(.dark) .ce-tab-active {
        background: rgb(55, 65, 81);
        color: #a5b4fc;
    }
    .ce-tab-icon {
        width: 16px;
        height: 16px;
    }
    @media (max-width: 640px) {
        .ce-tab span { display: none; }
        .ce-tab-icon { width: 18px; height: 18px; }
        .ce-tab { padding: 8px 10px; }
    }

    /* === CAMPAIGN CHECKBOX GROUP === */
    .ce-checkbox-group {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 8px;
    }
    .ce-checkbox-item {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 8px 14px;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        background: #f9fafb;
        font-size: 13px;
        font-weight: 500;
        color: #374151;
        cursor: pointer;
        transition: all 0.15s;
    }
    .ce-checkbox-item:has(input:checked) {
        border-color: #6366f1;
        background: #eef2ff;
        color: #4338ca;
    }
    :is(.dark) .ce-checkbox-item {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
        color: #d1d5db;
    }
    :is(.dark) .ce-checkbox-item:has(input:checked) {
        border-color: #818cf8;
        background: rgba(99, 102, 241, 0.15);
        color: #a5b4fc;
    }
    .ce-checkbox-input {
        width: 16px;
        height: 16px;
        accent-color: #6366f1;
    }
    .ce-payment-methods {
        margin-top: 12px;
    }
    .ce-payment-separated {
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin-top: 12px;
    }
    .ce-payment-group {
        background: var(--fi-body-bg, #f9fafb);
        border: 1px solid var(--fi-border-color, #e5e7eb);
        border-radius: 8px;
        padding: 12px;
    }
    .ce-payment-group .rp-filter-label {
        margin-bottom: 8px;
        font-weight: 600;
    }

    /* === CAMPAIGN CUSTOMER SUBSECTION === */
    .ce-customer-subsection {
        padding: 12px 16px;
        border: 1px solid rgba(var(--gray-200), 1);
        border-radius: 8px;
        background: rgba(var(--gray-50), 0.5);
    }
    .dark .ce-customer-subsection {
        border-color: rgba(var(--gray-700), 1);
        background: rgba(var(--gray-800), 0.3);
    }
    .ce-customer-detail-row {
        margin-top: 0.5rem;
    }

    /* === CAMPAIGN PRODUCT SELECTOR === */
    .cp-product-wrap {
        position: relative;
    }
    .cp-product-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 8px;
    }
    .cp-product-chip {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 4px 8px;
        background: #eef2ff;
        color: #4338ca;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 500;
    }
    :is(.dark) .cp-product-chip {
        background: rgba(99, 102, 241, 0.15);
        color: #a5b4fc;
    }
    .cp-product-chip-remove {
        display: flex;
        align-items: center;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        color: #6366f1;
        margin-left: 2px;
    }
    .cp-product-chip-remove:hover {
        color: #ef4444;
    }
    .cp-product-chip-x {
        width: 12px;
        height: 12px;
    }
    .cp-product-dropdown {
        max-height: 350px;
    }
    .cp-product-list {
        max-height: 280px;
    }
    .cp-product-cat-header {
        padding: 6px 14px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #9ca3af;
        background: #f9fafb;
        border-top: 1px solid #f3f4f6;
        position: sticky;
        top: 0;
        z-index: 1;
    }
    :is(.dark) .cp-product-cat-header {
        background: rgb(17, 24, 39);
        border-top-color: rgb(55, 65, 81);
        color: #6b7280;
    }

    /* === CAMPAIGN COUPON TABLE === */
    .ce-coupon-section {
        margin-top: 16px;
        border-top: 1px solid #e5e7eb;
        padding-top: 16px;
    }
    :is(.dark) .ce-coupon-section {
        border-top-color: rgb(55, 65, 81);
    }
    .ce-coupon-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 12px;
    }
    .ce-coupon-title {
        font-size: 14px;
        font-weight: 600;
        color: #374151;
    }
    :is(.dark) .ce-coupon-title {
        color: #d1d5db;
    }
    .ce-coupon-table-wrap {
        overflow-x: auto;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
    }
    :is(.dark) .ce-coupon-table-wrap {
        border-color: rgb(55, 65, 81);
    }
    .ce-coupon-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 13px;
    }
    .ce-coupon-table th {
        padding: 8px 12px;
        text-align: left;
        font-weight: 600;
        color: #6b7280;
        background: #f9fafb;
        border-bottom: 1px solid #e5e7eb;
        white-space: nowrap;
    }
    :is(.dark) .ce-coupon-table th {
        background: rgb(31, 41, 55);
        color: #9ca3af;
        border-bottom-color: rgb(55, 65, 81);
    }
    .ce-coupon-table td {
        padding: 8px 12px;
        border-bottom: 1px solid #f3f4f6;
        color: #374151;
    }
    :is(.dark) .ce-coupon-table td {
        border-bottom-color: rgb(55, 65, 81);
        color: #d1d5db;
    }
    .ce-coupon-table tr:last-child td {
        border-bottom: none;
    }
    .ce-coupon-code {
        font-family: monospace;
        font-weight: 600;
        font-size: 13px;
        color: #1e40af;
        background: #eff6ff;
        padding: 2px 8px;
        border-radius: 4px;
    }
    :is(.dark) .ce-coupon-code {
        background: rgba(59, 130, 246, 0.15);
        color: #93c5fd;
    }
    .ce-coupon-badge {
        display: inline-block;
        font-size: 11px;
        font-weight: 600;
        padding: 2px 8px;
        border-radius: 4px;
    }
    .ce-coupon-active {
        background: #ecfdf5;
        color: #059669;
    }
    :is(.dark) .ce-coupon-active {
        background: rgba(5, 150, 105, 0.15);
        color: #34d399;
    }
    .ce-coupon-used {
        background: #fef2f2;
        color: #dc2626;
    }
    :is(.dark) .ce-coupon-used {
        background: rgba(220, 38, 38, 0.15);
        color: #f87171;
    }
    .ce-coupon-passive {
        background: #f3f4f6;
        color: #6b7280;
    }
    :is(.dark) .ce-coupon-passive {
        background: rgba(107, 114, 128, 0.2);
        color: #d1d5db;
    }
    .ce-coupon-toggle-btn {
        background: none;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        padding: 4px 10px;
        font-size: 12px;
        font-weight: 500;
        color: #6b7280;
        cursor: pointer;
        transition: all 0.15s;
    }
    .ce-coupon-toggle-btn:hover {
        border-color: #6366f1;
        color: #6366f1;
    }
    :is(.dark) .ce-coupon-toggle-btn {
        border-color: rgb(55, 65, 81);
        color: #9ca3af;
    }
    :is(.dark) .ce-coupon-toggle-btn:hover {
        border-color: #818cf8;
        color: #818cf8;
    }
    .ce-coupon-generate {
        margin-top: 12px;
    }
    .ce-coupon-generate-row {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .ce-coupon-qty-input {
        max-width: 100px;
    }
    .ce-coupon-generate-btn {
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 8px 16px;
        background: #3b82f6;
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
        transition: background 0.15s;
        white-space: nowrap;
    }
    .ce-coupon-generate-btn:hover {
        background: #2563eb;
    }
    .ce-coupon-generate-icon {
        width: 16px;
        height: 16px;
    }

    /* Point Code Campaigns */
    .pc-create-modal { max-width: 560px; }
    .pc-codes-modal { max-width: 700px; max-height: 80vh; overflow-y: auto; }
    .pc-form-fields { display: flex; flex-direction: column; gap: 1rem; padding: 1rem 0; }
    .pc-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    @media (max-width: 640px) { .pc-form-row { grid-template-columns: 1fr; } }
    .pc-codes-table-wrap { max-height: 400px; overflow-y: auto; margin: 1rem 0; }
    .pc-th { padding: 8px 12px; font-size: 0.75rem; font-weight: 600; color: rgba(var(--gray-500), 1); text-transform: uppercase; border-bottom: 1px solid rgba(var(--gray-200), 1); }
    :is(.dark) .pc-th { border-color: rgba(var(--gray-700), 1); }
    .pc-th-left { text-align: left; }
    .pc-th-center { text-align: center; }
    .pc-td { padding: 8px 12px; font-size: 0.8125rem; border-bottom: 1px solid rgba(var(--gray-100), 1); }
    :is(.dark) .pc-td { border-color: rgba(var(--gray-800), 1); }
    .pc-td-left { text-align: left; }
    .pc-td-center { text-align: center; }
    .pc-td-empty { padding: 2rem; color: rgba(var(--gray-400), 1); }
    .pc-code-text { font-family: monospace; font-size: 0.875rem; font-weight: 600; letter-spacing: 1px; }
    .pc-code-row:hover { background: rgba(var(--gray-50), 1); }
    :is(.dark) .pc-code-row:hover { background: rgba(var(--gray-800), 0.5); }
    .pc-code-toggle-btn { padding: 4px 12px; border: none; border-radius: 6px; font-size: 0.75rem; font-weight: 600; cursor: pointer; transition: background 0.15s; }
    .pc-code-toggle-cancel { background: #fee2e2; color: #dc2626; }
    .pc-code-toggle-cancel:hover { background: #fecaca; }
    .pc-code-toggle-activate { background: #d1fae5; color: #059669; }
    .pc-code-toggle-activate:hover { background: #a7f3d0; }
    :is(.dark) .pc-code-toggle-cancel { background: rgba(220, 38, 38, 0.2); color: #f87171; }
    :is(.dark) .pc-code-toggle-activate { background: rgba(5, 150, 105, 0.2); color: #34d399; }

    /* Admin Impersonate - Panele Dön Button */
    .wm-return-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        background: #dc2626;
        color: #fff;
        border-radius: 0.5rem;
        font-size: 0.8125rem;
        font-weight: 600;
        text-decoration: none;
        transition: background 0.15s;
        margin-right: 0.5rem;
        animation: wm-pulse 2s infinite;
    }
    .wm-return-btn:hover { background: #b91c1c; color: #fff; }
    .wm-return-btn svg { width: 1rem; height: 1rem; }
    @keyframes wm-pulse {
        0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.4); }
        50% { box-shadow: 0 0 0 6px rgba(220, 38, 38, 0); }
    }

    /* === EPOS BUTTON === */
    .epos-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        background: #059669;
        color: #fff;
        border-radius: 0.5rem;
        font-size: 0.8125rem;
        font-weight: 600;
        text-decoration: none;
        transition: background 0.15s;
        margin-right: 0.5rem;
    }
    .epos-btn-form { display: inline; margin: 0; padding: 0; }
    .epos-btn:hover { background: #047857; color: #fff; }
    .epos-btn-disabled { opacity: 0.7; cursor: pointer; }
    .epos-btn-disabled:hover { background: #059669; }
    .epos-btn-icon { width: 1rem; height: 1rem; }
    @media (max-width: 640px) {
        .epos-btn-text { display: none; }
    }

    /* EPOS Branch Select Modal */
    .epos-modal { position: relative; }
    .epos-modal-close-btn {
        position: absolute; top: 0.75rem; right: 0.75rem; z-index: 10;
        width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center;
        background: none; border: none; font-size: 1.25rem; color: #94a3b8;
        cursor: pointer; border-radius: 0.375rem; transition: all 0.15s; line-height: 1;
    }
    .epos-modal-close-btn:hover { background: #f1f5f9; color: #475569; }
    :is(.dark) .epos-modal-close-btn:hover { background: #334155; color: #e2e8f0; }
    .epos-modal-body { padding-bottom: 2rem !important; }
    .epos-modal-desc { font-size: 0.8125rem; color: #64748b; margin-bottom: 0.75rem; }
    .epos-modal-select-wrap { position: relative; }
    .epos-modal-select {
        display: flex; align-items: center; gap: 0.5rem; width: 100%;
        padding: 0.625rem 0.875rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        background: #fff; font-size: 0.875rem; font-family: inherit; color: #0f172a;
        cursor: pointer; text-align: left; transition: border-color 0.15s;
    }
    .epos-modal-select:hover { border-color: #cbd5e1; }
    .epos-modal-select-icon { width: 1rem; height: 1rem; color: #94a3b8; flex-shrink: 0; }
    .epos-modal-select-text { flex: 1; }
    .epos-modal-select-arrow { width: 1rem; height: 1rem; color: #94a3b8; flex-shrink: 0; }
    .epos-modal-dropdown {
        position: absolute; top: calc(100% + 0.25rem); left: 0; right: 0; z-index: 50;
        background: #fff; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        box-shadow: 0 8px 24px rgba(0,0,0,0.1); overflow: hidden;
    }
    .epos-modal-dropdown-search {
        width: 100%; padding: 0.5rem 0.75rem; border: none; border-bottom: 1px solid #e2e8f0;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; outline: none;
    }
    .epos-modal-dropdown-search::placeholder { color: #94a3b8; }
    .epos-modal-dropdown-list { max-height: 200px; overflow-y: auto; }
    .epos-modal-dropdown-item {
        display: flex; align-items: center; justify-content: space-between;
        padding: 0.5rem 0.75rem; font-size: 0.8125rem; color: #374151;
        cursor: pointer; transition: background 0.1s;
    }
    .epos-modal-dropdown-item:hover { background: #f1f5f9; }
    .epos-modal-dropdown-item.sel { background: #f0fdf4; color: #166534; font-weight: 600; }
    .epos-modal-dropdown-check { width: 0.875rem; height: 0.875rem; color: #10b981; flex-shrink: 0; }
    .wh-modal-btn-loading { opacity: 0.5; }
    :is(.dark) .epos-modal-select { background: #1e293b; border-color: #334155; color: #e2e8f0; }
    :is(.dark) .epos-modal-dropdown { background: #1e293b; border-color: #334155; }
    :is(.dark) .epos-modal-dropdown-search { color: #e2e8f0; border-color: #334155; }
    :is(.dark) .epos-modal-dropdown-item { color: #e2e8f0; }
    :is(.dark) .epos-modal-dropdown-item:hover { background: #0f172a; }
    :is(.dark) .epos-modal-dropdown-item.sel { background: rgba(16,163,74,0.1); }

    /* === LOYALTY PROGRAM STYLES === */

    /* Color Picker Palette */
    .ly-color-palette {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 8px;
    }
    .ly-color-swatch {
        width: 36px;
        height: 36px;
        border-radius: 8px;
        border: 2px solid transparent;
        cursor: pointer;
        padding: 2px;
        transition: all 0.15s;
        background: none;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .ly-color-swatch:hover {
        transform: scale(1.15);
    }
    .ly-color-swatch-selected {
        border-color: #374151;
        box-shadow: 0 0 0 2px rgba(55, 65, 81, 0.3);
    }
    :is(.dark) .ly-color-swatch-selected {
        border-color: #d1d5db;
        box-shadow: 0 0 0 2px rgba(209, 213, 219, 0.3);
    }
    .ly-color-swatch-inner {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 6px;
    }
    .ly-color-swatch-inner[data-color="#e53935"] { background: #e53935; }
    .ly-color-swatch-inner[data-color="#d81b60"] { background: #d81b60; }
    .ly-color-swatch-inner[data-color="#8e24aa"] { background: #8e24aa; }
    .ly-color-swatch-inner[data-color="#5e35b1"] { background: #5e35b1; }
    .ly-color-swatch-inner[data-color="#3949ab"] { background: #3949ab; }
    .ly-color-swatch-inner[data-color="#1e88e5"] { background: #1e88e5; }
    .ly-color-swatch-inner[data-color="#039be5"] { background: #039be5; }
    .ly-color-swatch-inner[data-color="#00acc1"] { background: #00acc1; }
    .ly-color-swatch-inner[data-color="#00897b"] { background: #00897b; }
    .ly-color-swatch-inner[data-color="#43a047"] { background: #43a047; }
    .ly-color-swatch-inner[data-color="#7cb342"] { background: #7cb342; }
    .ly-color-swatch-inner[data-color="#c0ca33"] { background: #c0ca33; }
    .ly-color-swatch-inner[data-color="#fdd835"] { background: #fdd835; }
    .ly-color-swatch-inner[data-color="#ffb300"] { background: #ffb300; }
    .ly-color-swatch-inner[data-color="#fb8c00"] { background: #fb8c00; }
    .ly-color-swatch-inner[data-color="#f4511e"] { background: #f4511e; }
    .ly-color-swatch-inner[data-color="#8d6e63"] { background: #8d6e63; }
    .ly-color-swatch-inner[data-color="#bdbdbd"] { background: #bdbdbd; }
    .ly-color-swatch-inner[data-color="#78909c"] { background: #78909c; }
    .ly-color-swatch-none {
        border: 2px dashed #d1d5db;
    }
    .ly-color-none-icon {
        width: 16px;
        height: 16px;
        color: #9ca3af;
    }
    :is(.dark) .ly-color-swatch-none {
        border-color: rgb(75, 85, 99);
    }

    /* Icon Picker */
    .ly-icon-picker-wrap {
        border: 1px solid var(--input-border-color, #d1d5db);
        border-radius: var(--radius-lg, 0.5rem);
        overflow: hidden;
        margin-top: 8px;
    }
    :is(.dark) .ly-icon-picker-wrap {
        border-color: rgb(255 255 255 / 0.1);
    }
    .ly-icon-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
        gap: 4px;
        padding: 10px;
        max-height: 240px;
        overflow-y: auto;
    }
    .ly-icon-item {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        border: 1px solid transparent;
        border-radius: 8px;
        background: none;
        cursor: pointer;
        font-size: 20px;
        color: #374151;
        transition: all 0.15s;
    }
    .ly-icon-item:hover {
        background: #f3f4f6;
        border-color: #d1d5db;
    }
    :is(.dark) .ly-icon-item {
        color: #d1d5db;
    }
    :is(.dark) .ly-icon-item:hover {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
    }
    .ly-icon-item-selected {
        background: #eef2ff;
        border-color: #6366f1;
        color: #4338ca;
    }
    :is(.dark) .ly-icon-item-selected {
        background: rgba(99, 102, 241, 0.15);
        border-color: #818cf8;
        color: #a5b4fc;
    }
    .ly-icon-selected-preview {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 14px;
        background: #eef2ff;
        border: 1px solid #c7d2fe;
        border-radius: 8px;
        font-size: 14px;
        color: #4338ca;
        margin-bottom: 8px;
    }
    .ly-icon-selected-preview i {
        font-size: 24px;
    }
    :is(.dark) .ly-icon-selected-preview {
        background: rgba(99, 102, 241, 0.15);
        border-color: rgba(99, 102, 241, 0.3);
        color: #a5b4fc;
    }
    .ly-icon-remove-btn {
        margin-left: auto;
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background: #ef4444;
        color: #fff;
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
    }
    .ly-icon-remove-x {
        width: 12px;
        height: 12px;
    }

    /* Period Rows */
    .ly-period-row {
        display: flex;
        align-items: flex-end;
        gap: 8px;
        padding: 12px;
        background: #f9fafb;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
    }
    :is(.dark) .ly-period-row {
        background: rgb(30, 35, 45);
        border-color: rgb(55, 65, 81);
    }
    .ly-period-fields {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 12px;
        flex: 1;
    }
    @media (max-width: 768px) {
        .ly-period-fields {
            grid-template-columns: 1fr;
        }
    }
    .ly-period-remove-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border: 1px solid #fecaca;
        border-radius: 8px;
        background: #fef2f2;
        color: #ef4444;
        cursor: pointer;
        flex-shrink: 0;
        transition: all 0.15s;
        padding: 0;
        margin-bottom: 4px;
    }
    .ly-period-remove-btn:hover {
        background: #fee2e2;
        border-color: #f87171;
    }
    :is(.dark) .ly-period-remove-btn {
        background: rgba(239, 68, 68, 0.1);
        border-color: rgba(239, 68, 68, 0.3);
    }
    .ly-period-remove-icon {
        width: 14px;
        height: 14px;
    }
    .ly-add-btn {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 8px 16px;
        background: none;
        border: 1px dashed #3b82f6;
        border-radius: 8px;
        color: #3b82f6;
        font-size: 13px;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.15s;
    }
    .ly-add-btn:hover {
        background: #eff6ff;
    }
    :is(.dark) .ly-add-btn {
        border-color: #60a5fa;
        color: #60a5fa;
    }
    :is(.dark) .ly-add-btn:hover {
        background: rgba(96, 165, 250, 0.1);
    }
    .ly-add-btn-icon {
        width: 16px;
        height: 16px;
    }

    /* Condition Sections */
    .ly-condition-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }
    .ly-condition-passive-text {
        font-size: 13px;
        color: #9ca3af;
        font-style: italic;
        margin: 0;
    }

    /* Special Day Row */
    .ly-special-day-row {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 8px;
    }
    .ly-special-day-row .campaign-edit-input {
        flex: 1;
    }

    /* Info Note */
    .ly-info-note {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 14px;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        font-size: 13px;
        color: #1e40af;
    }
    :is(.dark) .ly-info-note {
        background: rgba(59, 130, 246, 0.1);
        border-color: rgba(59, 130, 246, 0.3);
        color: #93c5fd;
    }
    .ly-info-note-icon {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }

    /* ═══ ACCOUNT SELECT (SMS Login) ═══ */
    .acc-select-wrap { margin: -0.25rem 0; }
    .acc-select-label { font-size: 0.8125rem; font-weight: 600; color: #374151; margin-bottom: 0.625rem; }
    .acc-select-list { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; }
    .acc-select-card {
        display: flex; align-items: center; gap: 0.75rem;
        padding: 0.75rem 1rem; border: 2px solid #e2e8f0; border-radius: 0.625rem;
        cursor: pointer; transition: all 0.15s; position: relative; background: #fff;
    }
    .acc-select-card:hover { border-color: #cbd5e1; background: #f8fafc; }
    .acc-select-card-active { border-color: #16a34a !important; background: #f0fdf4 !important; }
    .acc-select-card-left { flex: 1; min-width: 0; }
    .acc-select-restaurant { font-size: 0.875rem; font-weight: 700; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .acc-select-branch { font-size: 0.6875rem; color: #64748b; margin-top: 0.0625rem; }
    .acc-select-card-right { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
    .acc-select-user { font-size: 0.75rem; font-weight: 600; color: #475569; }
    .acc-select-badge {
        font-size: 0.5625rem; font-weight: 700; text-transform: uppercase;
        padding: 0.125rem 0.375rem; border-radius: 9999px;
        background: #dbeafe; color: #1d4ed8; letter-spacing: 0.25px;
    }
    .acc-select-check {
        width: 1.25rem; height: 1.25rem; border-radius: 50%;
        background: #16a34a; color: #fff; display: none;
        align-items: center; justify-content: center; flex-shrink: 0;
    }
    .acc-select-card-active .acc-select-check { display: flex; }
    .acc-select-check svg { width: 0.75rem; height: 0.75rem; }
    .acc-select-remember {
        display: flex; align-items: center; gap: 0.5rem;
        font-size: 0.8125rem; color: #475569; cursor: pointer; margin-bottom: 1rem;
    }
    .acc-select-checkbox {
        width: 1rem; height: 1rem; border-radius: 0.25rem;
        border: 1.5px solid #cbd5e1; accent-color: #16a34a;
    }
    .acc-select-btn {
        display: flex; align-items: center; justify-content: center; gap: 0.5rem;
        width: 100%; padding: 0.6875rem; border-radius: 0.5rem;
        background: #16a34a; color: #fff; border: none;
        font-size: 0.875rem; font-weight: 700; font-family: inherit;
        cursor: pointer; transition: background 0.15s;
    }
    .acc-select-btn:hover { background: #15803d; }
    .acc-select-btn-disabled { opacity: 0.5; cursor: not-allowed !important; }
    .acc-select-btn-icon { width: 1rem; height: 1rem; }
    .acc-select-spin { width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: tspin 0.5s linear infinite; }

    /* Dark mode */
    :is(.dark) .acc-select-card { background: #1e293b; border-color: #334155; }
    :is(.dark) .acc-select-card:hover { background: #0f172a; border-color: #475569; }
    :is(.dark) .acc-select-card-active { background: rgba(22,163,74,0.1) !important; border-color: #16a34a !important; }
    :is(.dark) .acc-select-restaurant { color: #f1f5f9; }
    :is(.dark) .acc-select-user { color: #94a3b8; }
    :is(.dark) .acc-select-label { color: #e2e8f0; }

    /* ═══ ONBOARDING WIZARD ═══ */
    .onb-overlay {
        position: fixed; inset: 0; z-index: 9999;
        background: rgba(15, 23, 42, 0.85); backdrop-filter: blur(4px);
        display: flex; align-items: center; justify-content: center;
        padding: 1rem;
    }
    .onb-container {
        width: 720px; max-width: 100%; max-height: 92vh;
        background: #fff; border-radius: 1.25rem;
        box-shadow: 0 25px 80px rgba(0,0,0,0.4);
        display: flex; flex-direction: column; overflow: hidden;
    }
    .onb-progress {
        display: flex; align-items: center; padding: 1.25rem 2rem;
        background: #f8fafc; border-bottom: 1px solid #e2e8f0;
    }
    .onb-progress-item { display: flex; align-items: center; flex: 1; }
    .onb-progress-item:last-child { flex: 0; }
    .onb-dot {
        width: 2rem; height: 2rem; border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        font-size: 0.75rem; font-weight: 700; flex-shrink: 0;
        background: #e2e8f0; color: #94a3b8; transition: all 0.3s;
    }
    .onb-dot-active { background: #d71920; color: #fff; box-shadow: 0 0 0 4px rgba(215,25,32,0.15); transform: scale(1.1); }
    .onb-dot-done { background: #10b981; color: #fff; }
    .onb-dot-check { width: 0.875rem; height: 0.875rem; }
    .onb-line { flex: 1; height: 2px; background: #e2e8f0; margin: 0 0.5rem; transition: background 0.3s; }
    .onb-line-done { background: #10b981; }
    .onb-body { flex: 1; overflow-y: auto; padding: 2rem; }
    .onb-step { animation: onbFadeIn 0.3s ease; }
    @keyframes onbFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

    /* Step Header */
    .onb-step-header { margin-bottom: 1.5rem; }
    .onb-badge { display: inline-block; padding: 0.125rem 0.625rem; background: #fef2f2; color: #d71920; font-size: 0.6875rem; font-weight: 700; border-radius: 9999px; margin-bottom: 0.5rem; }
    .onb-title { font-size: 1.375rem; font-weight: 800; color: #0f172a; margin-bottom: 0.25rem; }
    .onb-desc { font-size: 0.8125rem; color: #64748b; line-height: 1.5; }
    .onb-section-title { font-size: 0.9375rem; font-weight: 700; color: #0f172a; margin-bottom: 0.5rem; }
    .onb-sub-title { font-size: 0.875rem; font-weight: 600; color: #374151; margin-bottom: 0.625rem; }
    .onb-mt-24 { margin-top: 1.5rem; }
    .onb-mb-12 { margin-bottom: 0.75rem; }
    .onb-desc-mb { margin-bottom: 0.75rem; }
    .onb-empty { font-size: 0.8125rem; color: #94a3b8; font-style: italic; }

    /* Welcome */
    .onb-welcome { text-align: center; padding: 2rem 0; }
    .onb-welcome-img { max-width: 222px; width: 100%; height: auto; margin: 0 auto 1.5rem; display: block; }
    .onb-welcome-title { font-size: 1.75rem; font-weight: 900; color: #0f172a; margin-bottom: 0.5rem; }
    .onb-welcome-restaurant { font-size: 1.125rem; font-weight: 600; color: #d71920; margin-bottom: 1rem; }
    .onb-welcome-desc { font-size: 0.9375rem; color: #64748b; line-height: 1.7; max-width: 480px; margin: 0 auto 2rem; }
    .onb-welcome-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.625rem; max-width: 420px; margin: 0 auto; text-align: left; }
    .onb-welcome-grid-item {
        display: flex; align-items: center; gap: 0.5rem;
        padding: 0.625rem 0.875rem; border: 1px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.8125rem; color: #374151; font-weight: 500; background: #f8fafc;
    }
    .onb-welcome-grid-item svg { width: 1.125rem; height: 1.125rem; color: #d71920; flex-shrink: 0; }
    :is(.dark) .onb-welcome-grid-item { background: rgb(30,35,45); border-color: rgb(55,65,81); color: #d1d5db; }

    /* Cards (Operations) */
    .onb-cards { display: grid; gap: 0.75rem; margin-bottom: 1.5rem; }
    .onb-cards-4 { grid-template-columns: repeat(4, 1fr); }
    .onb-cards-3 { grid-template-columns: repeat(3, 1fr); }
    .onb-card {
        position: relative; padding: 1.25rem 0.875rem; border: 2px solid #e2e8f0; border-radius: 0.75rem;
        text-align: center; cursor: pointer; transition: all 0.2s; background: #fff;
    }
    .onb-card:hover { border-color: #cbd5e1; background: #f8fafc; }
    .onb-card.sel { border-color: #d71920; background: #fef2f2; }
    .onb-card-check {
        position: absolute; top: 0.5rem; right: 0.5rem; width: 1.25rem; height: 1.25rem;
        background: #d71920; color: #fff; border-radius: 50%; display: none;
        align-items: center; justify-content: center;
    }
    .onb-card.sel .onb-card-check { display: flex; }
    .onb-card-check svg { width: 0.75rem; height: 0.75rem; }
    .onb-card-icon { width: 2rem; height: 2rem; margin: 0 auto 0.5rem; color: #64748b; }
    .onb-card.sel .onb-card-icon { color: #d71920; }
    .onb-card-title { font-size: 0.8125rem; font-weight: 700; color: #0f172a; margin-bottom: 0.125rem; }
    .onb-card-desc { font-size: 0.6875rem; color: #94a3b8; }

    /* Subsection (Platforms) */
    .onb-subsection { margin-bottom: 1.5rem; padding: 1rem; background: #f8fafc; border-radius: 0.75rem; border: 1px solid #e2e8f0; }
    .onb-platforms { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
    @media (max-width: 640px) { .onb-platforms { grid-template-columns: repeat(2, 1fr); } }
    .onb-platform {
        display: flex; align-items: center; gap: 0.5rem;
        padding: 0.5rem 1rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.8125rem; font-weight: 600; color: #475569; cursor: pointer; transition: all 0.15s;
    }
    .onb-platform:hover { border-color: #cbd5e1; }
    .onb-platform.sel { border-color: #d71920; background: #fef2f2; color: #d71920; }
    .onb-platform-logo { width: 2rem; height: 2rem; object-fit: contain; border-radius: 0.25rem; }

    /* Radio Cards (Tracking) */
    .onb-radio-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
    .onb-radio-card {
        padding: 1rem; border: 2px solid #e2e8f0; border-radius: 0.75rem;
        text-align: center; cursor: pointer; transition: all 0.2s;
    }
    .onb-radio-card:hover { border-color: #cbd5e1; }
    .onb-radio-card.sel { border-color: #d71920; background: #fef2f2; }
    .onb-radio-icon { width: 1.5rem; height: 1.5rem; margin: 0 auto 0.375rem; color: #64748b; }
    .onb-radio-card.sel .onb-radio-icon { color: #d71920; }
    .onb-radio-title { font-size: 0.8125rem; font-weight: 700; color: #0f172a; }
    .onb-radio-desc { font-size: 0.6875rem; color: #94a3b8; }

    /* Working Hours */
    .onb-toggle-row { display: flex; align-items: center; gap: 0.625rem; cursor: pointer; margin-bottom: 0.75rem; font-size: 0.875rem; font-weight: 600; color: #374151; }
    .onb-toggle-inline { margin-bottom: 0; font-size: 0.75rem; }
    .onb-toggle {
        width: 2.5rem; height: 1.375rem; border-radius: 9999px; background: #cbd5e1;
        position: relative; transition: background 0.2s; flex-shrink: 0; cursor: pointer;
    }
    .onb-toggle.on { background: #16a34a; }
    .onb-toggle-dot {
        width: 1rem; height: 1rem; border-radius: 50%; background: #fff;
        position: absolute; top: 0.1875rem; left: 0.1875rem; transition: transform 0.2s;
        box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    }
    .onb-toggle.on .onb-toggle-dot { transform: translateX(1.125rem); }
    .onb-toggle-sm { width: 2rem; height: 1.125rem; }
    .onb-toggle-sm .onb-toggle-dot { width: 0.8125rem; height: 0.8125rem; top: 0.15625rem; left: 0.15625rem; }
    .onb-toggle-sm.on .onb-toggle-dot { transform: translateX(0.875rem); }

    /* Hours v2 (row-based, full width) */
    .onb-hours2 { display: flex; flex-direction: column; gap: 0.25rem; margin-top: 1rem; }
    .onb-hours2-row {
        display: flex; align-items: center; gap: 0.75rem;
        padding: 0.5rem 0.75rem; border: 1px solid #e2e8f0; border-radius: 0.5rem;
        background: #fff; transition: opacity 0.15s;
    }
    .onb-hours2-closed { opacity: 0.45; }
    :is(.dark) .onb-hours2-row { background: rgb(17,24,39); border-color: rgb(55,65,81); }
    .onb-hours2-day { font-size: 0.8125rem; font-weight: 700; color: #0f172a; width: 5.5rem; flex-shrink: 0; }
    :is(.dark) .onb-hours2-day { color: #e2e8f0; }
    .onb-hours2-inputs { display: flex; align-items: center; gap: 0.375rem; flex: 1; justify-content: center; }
    .onb-hours2-input {
        width: 8rem; padding: 0.375rem 0.5rem; border: 1.5px solid #e2e8f0; border-radius: 0.375rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; text-align: center; outline: none;
        -webkit-appearance: none; appearance: none;
    }
    .onb-hours2-input:focus { border-color: #00d66f; box-shadow: 0 0 0 2px rgba(0,214,111,0.1); }
    .onb-hours2-input:disabled { background: #f1f5f9; color: #94a3b8; }
    :is(.dark) .onb-hours2-input { background: rgb(30,35,45); border-color: rgb(55,65,81); color: #e2e8f0; }
    :is(.dark) .onb-hours2-input:disabled { background: rgb(17,24,39); }
    .onb-hours2-sep { color: #94a3b8; font-size: 0.75rem; }
    .onb-hours2-status { display: flex; align-items: center; gap: 0.375rem; flex-shrink: 0; }
    .onb-hours2-status-text { font-size: 0.6875rem; font-weight: 600; color: #dc2626; }
    .onb-hours2-status-text.on { color: #16a34a; }
    .onb-hours2-toggle {
        width: 2rem; height: 1.125rem; border-radius: 9999px; background: #dc2626;
        position: relative; cursor: pointer; transition: background 0.2s; border: none; flex-shrink: 0;
    }
    .onb-hours2-toggle.on { background: #16a34a; }
    .onb-hours2-toggle-dot {
        width: 0.8125rem; height: 0.8125rem; border-radius: 50%; background: #fff;
        position: absolute; top: 0.15625rem; left: 0.15625rem; transition: transform 0.2s;
        box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    }
    .onb-hours2-toggle.on .onb-hours2-toggle-dot { transform: translateX(0.875rem); }

    .onb-hours { display: flex; flex-direction: column; gap: 0.375rem; }
    .onb-hours-row { display: flex; align-items: center; gap: 0.5rem; padding: 0.375rem 0; }
    .onb-hours-row.disabled { opacity: 0.4; }
    .onb-hours-day { width: 5.5rem; font-size: 0.8125rem; font-weight: 600; color: #374151; flex-shrink: 0; }
    .onb-hours-input {
        width: 6rem; padding: 0.375rem 0.5rem; border: 1.5px solid #e2e8f0; border-radius: 0.375rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; outline: none;
    }
    .onb-hours-input:focus { border-color: #00d66f; box-shadow: 0 0 0 2px rgba(0,214,111,0.1); }
    .onb-hours-input:disabled { background: #f1f5f9; color: #94a3b8; }
    .onb-hours-sep { color: #94a3b8; font-weight: 600; }
    .onb-hours-toggle {
        padding: 0.25rem 0.625rem; border: 1.5px solid #e2e8f0; border-radius: 0.375rem;
        font-size: 0.6875rem; font-weight: 700; cursor: pointer; background: #ecfdf5; color: #059669;
        font-family: inherit; transition: all 0.15s;
    }
    .onb-hours-toggle.closed { background: #fef2f2; color: #dc2626; border-color: #fecaca; }

    /* Tax Rates */
    .onb-tax-list { display: flex; flex-direction: column; gap: 0.375rem; }
    .onb-tax-item {
        display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0.875rem;
        border: 1.5px solid #e2e8f0; border-radius: 0.5rem; cursor: pointer; transition: all 0.15s;
    }
    .onb-tax-item:hover { border-color: #cbd5e1; }
    .onb-tax-item.sel { border-color: #d71920; background: #fef2f2; }
    .onb-radio-dot {
        width: 1rem; height: 1rem; border-radius: 50%; border: 2px solid #cbd5e1;
        flex-shrink: 0; transition: all 0.15s; position: relative;
    }
    .onb-radio-dot.on { border-color: #d71920; background: #d71920; }
    .onb-radio-dot.on::after { content: ''; position: absolute; inset: 3px; border-radius: 50%; background: #fff; }
    .onb-tax-name { font-size: 0.875rem; font-weight: 600; color: #0f172a; flex: 1; }
    .onb-tax-rate { font-size: 0.8125rem; font-weight: 700; color: #64748b; }

    /* Payment Methods */
    .onb-payment-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; }
    .onb-payment-card {
        position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
        gap: 0.25rem; padding: 0.5rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.75rem; font-weight: 600; color: #475569; cursor: pointer; transition: all 0.15s;
        min-height: 60px; text-align: center;
    }
    .onb-payment-card:hover { border-color: #cbd5e1; }
    .onb-payment-card.sel { border-color: #16a34a; background: #f0fdf4; color: #166534; }
    .onb-show-more-btn {
        display: block; width: 100%; margin-top: 0.5rem; padding: 0.5rem;
        background: none; border: 1.5px dashed #cbd5e1; border-radius: 0.5rem;
        color: #64748b; font-size: 0.75rem; font-weight: 600; cursor: pointer;
        font-family: inherit; transition: all 0.15s; text-align: center;
    }
    .onb-show-more-btn:hover { border-color: #6366f1; color: #6366f1; }

    /* Cuisine Cards */
    .onb-section-title-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem; }
    .onb-section-title-row .onb-section-title { margin-bottom: 0; }
    .onb-error-badge {
        font-size: 0.6875rem; font-weight: 600; color: #dc2626; background: #fef2f2;
        padding: 0.125rem 0.5rem; border-radius: 9999px; border: 1px solid #fecaca;
    }
    .onb-cuisine-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; margin-bottom: 0.5rem; }
    .onb-cuisine-card {
        position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
        gap: 0.25rem; padding: 0.5rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.75rem; font-weight: 600; color: #475569; cursor: pointer; transition: all 0.15s;
        min-height: 60px; text-align: center;
    }
    .onb-cuisine-card:hover { border-color: #cbd5e1; }
    .onb-cuisine-card.sel { border-color: #d71920; background: #fef2f2; color: #d71920; }
    @media (max-width: 768px) { .onb-cuisine-grid { grid-template-columns: repeat(2, 1fr); } }

    /* Feature Cards */
    .onb-feature-card { border: 1.5px solid #e2e8f0; border-radius: 0.75rem; margin-bottom: 0.75rem; overflow: hidden; }
    .onb-feature-header { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; cursor: pointer; }
    .onb-feature-header:hover { background: #f8fafc; }
    .onb-feature-info { display: flex; align-items: center; gap: 0.875rem; }
    .onb-feature-icon { width: 2rem; height: 2rem; color: #d71920; flex-shrink: 0; }
    .onb-feature-title { font-size: 0.9375rem; font-weight: 700; color: #0f172a; }
    .onb-feature-desc { font-size: 0.75rem; color: #64748b; margin-top: 0.125rem; }
    .onb-feature-sub { padding: 0.875rem 1.25rem; background: #f8fafc; border-top: 1px solid #e2e8f0; }
    .onb-feature-sub-option { display: flex; align-items: center; gap: 0.75rem; cursor: pointer; }
    .onb-feature-sub-title { font-size: 0.8125rem; font-weight: 600; color: #0f172a; }
    .onb-feature-sub-desc { font-size: 0.6875rem; color: #94a3b8; }

    /* Congrats */
    /* Loading */
    .onb-loading { text-align: center; padding: 2rem 2rem 4rem 2rem; }
    .onb-loading-spinner {
        width: 3rem; height: 3rem; border: 3px solid #e2e8f0; border-top-color: #d71920;
        border-radius: 50%; animation: tspin 0.7s linear infinite; margin: 0 auto 1.5rem;
    }
    .onb-loading-gif { width: 8rem; height: auto; margin: 10px auto; display: block; }
    .onb-loading-title { font-size: 1.25rem; font-weight: 800; color: #0f172a; margin-bottom: 0.375rem; }
    .onb-loading-desc { font-size: 0.875rem; color: #64748b; }
    :is(.dark) .onb-loading-title { color: #f1f5f9; }
    :is(.dark) .onb-loading-spinner { border-color: #334155; border-top-color: #d71920; }

    /* Cuisine has demo indicator */


    .onb-congrats { text-align: center; padding: 2rem 0; }
    .onb-congrats-emoji { font-size: 3.5rem; margin-bottom: 1rem; animation: onbBounce 0.6s ease; }
    @keyframes onbBounce { 0% { transform: scale(0); } 60% { transform: scale(1.2); } 100% { transform: scale(1); } }
    .onb-congrats-title { font-size: 1.75rem; font-weight: 900; color: #0f172a; margin-bottom: 0.5rem; }
    .onb-congrats-desc { font-size: 0.9375rem; color: #64748b; margin-bottom: 2rem; }
    .onb-congrats-tips { max-width: 420px; margin: 0 auto; text-align: left; display: flex; flex-direction: column; gap: 0.75rem; }
    .onb-congrats-tip { display: flex; align-items: flex-start; gap: 0.625rem; font-size: 0.8125rem; color: #475569; line-height: 1.5; }
    .onb-congrats-tip svg { width: 1.125rem; height: 1.125rem; color: #d71920; flex-shrink: 0; margin-top: 0.125rem; }
    .onb-congrats-tip strong { font-weight: 700; color: #0f172a; }

    /* Footer */
    .onb-footer { display: flex; align-items: center; justify-content: space-between; padding: 1rem 2rem; border-top: 1px solid #e2e8f0; background: #f8fafc; }
    .onb-footer-center { justify-content: center; }
    .onb-footer-right { display: flex; align-items: center; gap: 0.75rem; margin-left: auto; }
    .onb-btn {
        display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.625rem 1.25rem;
        border-radius: 0.5rem; font-size: 0.875rem; font-weight: 700; border: none;
        cursor: pointer; transition: all 0.15s; font-family: inherit;
    }
    .onb-btn svg { width: 0.875rem; height: 0.875rem; }
    .onb-btn-primary { background: #d71920; color: #fff; }
    .onb-btn-primary:hover { background: #b91518; }
    .onb-btn-primary:disabled { background: #cbd5e1; cursor: not-allowed; }
    .onb-btn-lg { padding: 0.75rem 2rem; font-size: 1rem; }
    .onb-btn-ghost { background: none; color: #64748b; }
    .onb-btn-ghost:hover { color: #0f172a; }
    .onb-btn-skip { background: none; color: #94a3b8; font-weight: 600; }
    .onb-btn-skip:hover { color: #64748b; }
    .onb-spin { width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: tspin 0.5s linear infinite; }

    /* Responsive */
    @media (max-width: 768px) {
        .onb-cards-4 { grid-template-columns: repeat(2, 1fr); }
        .onb-cards-3 { grid-template-columns: repeat(2, 1fr); }
        .onb-radio-cards { grid-template-columns: 1fr; }
        .onb-payment-grid { grid-template-columns: repeat(2, 1fr); }
        .onb-body { padding: 1.25rem; }
        .onb-footer { padding: 0.875rem 1.25rem; }
        .onb-hours-day { width: 4rem; font-size: 0.75rem; }
        .onb-hours-input { width: 5rem; }
    }

    /* Dark mode */
    :is(.dark) .onb-container { background: #1e293b; }
    :is(.dark) .onb-progress { background: #0f172a; border-color: #334155; }
    :is(.dark) .onb-dot { background: #334155; color: #64748b; }
    :is(.dark) .onb-line { background: #334155; }
    :is(.dark) .onb-title, :is(.dark) .onb-welcome-title, :is(.dark) .onb-congrats-title { color: #f1f5f9; }
    :is(.dark) .onb-card { background: #0f172a; border-color: #334155; }
    :is(.dark) .onb-card:hover { background: #1e293b; border-color: #475569; }
    :is(.dark) .onb-card.sel { background: rgba(215,25,32,0.1); border-color: #d71920; }
    :is(.dark) .onb-card-title, :is(.dark) .onb-radio-title, :is(.dark) .onb-section-title, :is(.dark) .onb-feature-title, :is(.dark) .onb-feature-sub-title { color: #e2e8f0; }
    :is(.dark) .onb-footer { background: #0f172a; border-color: #334155; }
    :is(.dark) .onb-hours-input { background: #0f172a; border-color: #334155; color: #e2e8f0; }
    :is(.dark) .onb-tax-item, :is(.dark) .onb-payment-card, :is(.dark) .onb-feature-card { border-color: #334155; }
    :is(.dark) .onb-subsection, :is(.dark) .onb-feature-sub, :is(.dark) .onb-feature-header:hover { background: #0f172a; border-color: #334155; }
    :is(.dark) .onb-platform { border-color: #334155; color: #94a3b8; }
    :is(.dark) .onb-radio-card { border-color: #334155; }
    :is(.dark) .onb-cuisine-tag { border-color: #334155; color: #94a3b8; }

    /* ═══ SUPPORT BUTTON (Header) ═══ */
    .support-btn {
        display: inline-flex; align-items: center; gap: 0.375rem;
        padding: 0.375rem 0.75rem; background: #d71920; color: #fff;
        border-radius: 0.5rem; font-size: 0.8125rem; font-weight: 600;
        text-decoration: none; transition: all 0.15s; position: relative;
    }
    .support-btn:hover { background: #b91518; color: #fff; }
    .support-btn-icon { width: 1rem; height: 1rem; }
    .support-btn-text { white-space: nowrap; }
    .support-btn-badge {
        position: absolute; top: -0.375rem; right: -0.375rem; min-width: 1.125rem; height: 1.125rem;
        background: #fff; color: #d71920; font-size: 0.625rem; font-weight: 800;
        border-radius: 9999px; display: flex; align-items: center; justify-content: center;
        padding: 0 0.25rem; line-height: 1; border: 2px solid #d71920;
    }
    @media (max-width: 640px) {
        .support-btn-text { display: none; }
    }

    /* ═══ SUPPORT PAGES ═══ */
    .sp-detail { max-width: 800px; }
    .sp-back-row { margin-bottom: 1rem; }
    .sp-header-card { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.75rem; padding: 1.25rem; margin-bottom: 1.25rem; }
    .sp-header-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
    .sp-header-actions { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
    .sp-subject { font-size: 1.125rem; font-weight: 700; color: #0f172a; margin-bottom: 0.375rem; }
    .sp-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: 0.75rem; color: #64748b; }
    .sp-meta span { padding: 0.125rem 0.5rem; background: #e2e8f0; border-radius: 9999px; }
    .sp-status-select { padding: 0.375rem 0.5rem; border: 1.5px solid #e2e8f0; border-radius: 0.375rem; font-size: 0.75rem; font-family: inherit; }

    /* Thread */
    .sp-thread { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1.25rem; }
    .sp-msg { border: 1px solid #e2e8f0; border-radius: 0.75rem; padding: 1rem; }
    .sp-msg-restaurant { background: #fff; border-left: 3px solid #3b82f6; }
    .sp-msg-admin { background: #f0fdf4; border-left: 3px solid #10b981; }
    .sp-msg-header { display: flex; justify-content: space-between; margin-bottom: 0.5rem; }
    .sp-msg-author { font-size: 0.8125rem; font-weight: 700; color: #0f172a; }
    .sp-msg-date { font-size: 0.6875rem; color: #94a3b8; }
    .sp-msg-body { font-size: 0.8125rem; color: #374151; line-height: 1.6; }
    .sp-msg-files { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: 0.5rem; }
    .sp-file { font-size: 0.6875rem; padding: 0.25rem 0.5rem; background: #f1f5f9; border-radius: 0.25rem; color: #3b82f6; text-decoration: none; }
    .sp-file:hover { background: #e2e8f0; }
    .sp-badge-admin { font-size: 0.5625rem; padding: 0.0625rem 0.375rem; background: #10b981; color: #fff; border-radius: 9999px; margin-left: 0.375rem; font-weight: 700; }

    /* Status badges */
    .sp-status-badge { padding: 0.125rem 0.5rem; border-radius: 9999px; font-size: 0.6875rem; font-weight: 700; }
    .sp-status-0 { background: #fef2f2; color: #dc2626; }
    .sp-status-1 { background: #fffbeb; color: #d97706; }
    .sp-status-2 { background: #f0fdf4; color: #16a34a; }
    .sp-status-3 { background: #eff6ff; color: #2563eb; }
    .sp-status-4, .sp-status-5 { background: #f1f5f9; color: #64748b; }

    /* Reply Form */
    .sp-reply-form { border: 1px solid #e2e8f0; border-radius: 0.75rem; padding: 1rem; }
    .sp-textarea {
        width: 100%; padding: 0.625rem 0.875rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; resize: vertical; outline: none;
    }
    .sp-textarea:focus { border-color: #10b981; box-shadow: 0 0 0 2px rgba(16,163,74,0.1); }
    .sp-reply-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 0.625rem; }
    .sp-file-input { font-size: 0.75rem; color: #64748b; }
    .sp-closed-notice { text-align: center; padding: 1rem; color: #94a3b8; font-size: 0.8125rem; font-style: italic; }

    /* Buttons */
    .sp-btn {
        display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.5rem 1rem;
        border-radius: 0.5rem; font-size: 0.8125rem; font-weight: 600; border: none;
        cursor: pointer; font-family: inherit; transition: all 0.15s;
    }
    .sp-btn-sm { padding: 0.375rem 0.625rem; font-size: 0.75rem; }
    .sp-btn-primary { background: #16a34a; color: #fff; }
    .sp-btn-primary:hover { background: #15803d; }
    .sp-btn-primary:disabled { opacity: 0.5; }
    .sp-btn-info { background: #3b82f6; color: #fff; }
    .sp-btn-info:hover { background: #2563eb; }
    .sp-btn-ghost { background: none; color: #64748b; }
    .sp-btn-ghost:hover { color: #0f172a; }
    .sp-btn-icon-sm { width: 0.875rem; height: 0.875rem; }

    /* Create Form */
    .sp-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
    .sp-form-full { grid-column: 1 / -1; }
    .sp-form-group { display: flex; flex-direction: column; }
    .sp-label { font-size: 0.8125rem; font-weight: 600; color: #374151; margin-bottom: 0.25rem; }
    .sp-input {
        padding: 0.5rem 0.75rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; outline: none;
    }
    .sp-input:focus { border-color: #10b981; box-shadow: 0 0 0 2px rgba(16,163,74,0.1); }
    .sp-hint { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.25rem; }
    .sp-form-actions { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1rem; }

    /* Dark mode */
    :is(.dark) .sp-header-card { background: #1e293b; border-color: #334155; }
    :is(.dark) .sp-subject { color: #f1f5f9; }
    :is(.dark) .sp-meta span { background: #334155; color: #94a3b8; }
    :is(.dark) .sp-msg { border-color: #334155; }
    :is(.dark) .sp-msg-restaurant { background: #1e293b; }
    :is(.dark) .sp-msg-admin { background: rgba(16,163,74,0.05); }
    :is(.dark) .sp-msg-author { color: #e2e8f0; }
    :is(.dark) .sp-msg-body { color: #cbd5e1; }
    :is(.dark) .sp-reply-form { border-color: #334155; }
    :is(.dark) .sp-textarea, :is(.dark) .sp-input { background: #0f172a; border-color: #334155; color: #e2e8f0; }
    :is(.dark) .sp-label { color: #e2e8f0; }

    /* ═══ GROUP PRODUCTS MANAGER ═══ */
    .gpm-header { margin-bottom: 0.375rem; }
    .gpm-header-cols {
        display: grid; grid-template-columns: 40px 3fr 2fr 1fr 32px; gap: 0.5rem;
        font-size: 0.6875rem; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;
        padding: 0 0.5rem;
    }
    .gpm-header-cols span:nth-child(3), .gpm-header-cols span:nth-child(4) { text-align: center; }
    .gpm-empty { font-size: 0.8125rem; color: #94a3b8; text-align: center; padding: 1rem; font-style: italic; }
    .gpm-list { display: flex; flex-direction: column; gap: 0.25rem; margin-bottom: 1rem; }
    .gpm-row {
        display: grid; grid-template-columns: 40px 3fr 2fr 1fr 32px; gap: 0.5rem; align-items: center;
        padding: 0.5rem; border: 1px solid #e2e8f0; border-radius: 0.5rem; background: #fff;
    }
    :is(.dark) .gpm-row { background: rgb(17,24,39); border-color: rgb(55,65,81); }
    .gpm-name { font-size: 0.8125rem; font-weight: 500; color: #0f172a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    :is(.dark) .gpm-name { color: #e2e8f0; }
    .gpm-price-input {
        width: 100%; padding: 0.25rem 0.5rem; border: 1px solid #e2e8f0; border-radius: 0.375rem;
        font-size: 0.8125rem; text-align: center; font-family: inherit; color: #0f172a; outline: none;
    }
    .gpm-price-input:focus { border-color: #6366f1; }
    :is(.dark) .gpm-price-input { background: rgb(30,35,45); border-color: rgb(55,65,81); color: #e2e8f0; }
    .gpm-toggle-wrap { display: flex; justify-content: center; }
    .gpm-switch {
        width: 2rem; height: 1.125rem; border-radius: 9999px; background: #cbd5e1;
        position: relative; cursor: pointer; transition: background 0.2s;
    }
    .gpm-switch.on { background: #16a34a; }
    .gpm-switch-dot {
        width: 0.8125rem; height: 0.8125rem; border-radius: 50%; background: #fff;
        position: absolute; top: 0.15625rem; left: 0.15625rem; transition: transform 0.2s;
        box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    }
    .gpm-switch.on .gpm-switch-dot { transform: translateX(0.875rem); }
    .gpm-remove { background: none; border: none; cursor: pointer; color: #94a3b8; padding: 0.125rem; display: flex; }
    .gpm-remove:hover { color: #ef4444; }
    .gpm-remove svg { width: 1rem; height: 1rem; }
    .gpm-sort-btns { display: flex; flex-direction: column; gap: 1px; }
    .gpm-sort-btn {
        background: none; border: none; cursor: pointer; color: #94a3b8; padding: 0; display: flex;
        align-items: center; justify-content: center; width: 18px; height: 14px; border-radius: 2px;
        transition: color 0.1s;
    }
    .gpm-sort-btn:hover:not(:disabled) { color: #6366f1; }
    .gpm-sort-btn:disabled { color: #e2e8f0; cursor: default; }
    .gpm-sort-btn svg { width: 12px; height: 12px; }
    .gpm-add-btn {
        display: flex; align-items: center; justify-content: center; gap: 0.375rem; margin-top: 0.5rem;
        width: 100%; padding: 0.625rem 1rem; border: 1.5px dashed #cbd5e1; border-radius: 0.5rem;
        background: none; color: #64748b; font-size: 0.8125rem; font-weight: 600;
        cursor: pointer; font-family: inherit; transition: all 0.15s;
    }
    .gpm-add-btn:hover { border-color: #6366f1; color: #6366f1; }
    .gpm-add-btn svg { width: 1rem; height: 1rem; }

    /* Modal */
    .gpm-modal { max-width: 560px; max-height: 80vh; display: flex; flex-direction: column; text-align: left; position: relative; }
    .gpm-modal > .wh-modal-close { position: absolute; top: 0.75rem; right: 0.75rem; z-index: 10; }
    .gpm-modal .wh-modal-header { margin-bottom: 1rem; text-align: center; padding-right: 2rem; }
    .gpm-modal .wh-modal-footer { margin-top: 1rem; display: block !important; text-align: right; }
    .gpm-modal .gpm-modal-list { margin-bottom: 0.75rem; }
    .gpm-cat-filter {
        width: 100%; padding: 0.5rem 0.75rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; outline: none; margin-bottom: 0.5rem;
        background: #fff; cursor: pointer; appearance: auto;
    }
    .gpm-cat-filter:focus { border-color: #6366f1; box-shadow: 0 0 0 2px rgba(99,102,241,0.1); }
    :is(.dark) .gpm-cat-filter { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e2e8f0; }
    .gpm-search {
        width: 100%; padding: 0.5rem 0.75rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; outline: none; margin-bottom: 0.75rem;
    }
    .gpm-search:focus { border-color: #6366f1; }
    :is(.dark) .gpm-search { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e2e8f0; }
    .gpm-modal-list { max-height: 400px; overflow-y: auto; display: flex; flex-direction: column; gap: 0.25rem; }
    .gpm-modal-group { margin-bottom: 0.5rem; }
    .gpm-modal-group-header {
        font-size: 0.6875rem; font-weight: 700; color: #fff; text-transform: uppercase;
        letter-spacing: 0.5px; padding: 10px; background: #333; text-align: center;
        border-radius: 0.375rem; margin-bottom: 0.25rem; position: sticky; top: 0; z-index: 1;
    }
    :is(.dark) .gpm-modal-group-header { background: rgb(55,65,81); color: #e2e8f0; }
    .gpm-modal-item {
        border: 1px solid #e2e8f0; border-radius: 0.5rem; padding: 0.625rem 0.75rem; transition: all 0.1s;
        display: flex; align-items: center; gap: 0.5rem; cursor: pointer; margin: 5px 0;
    }
    .gpm-modal-item-sel { border-color: #16a34a; background: #f0fdf4; }
    :is(.dark) .gpm-modal-item { border-color: rgb(55,65,81); }
    :is(.dark) .gpm-modal-item-sel { border-color: #16a34a; background: rgba(16,163,74,0.1); }
    .gpm-modal-check-wrap { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
    .gpm-modal-checkbox {
        width: 1.25rem; height: 1.25rem; border-radius: 0.25rem; border: 2px solid #cbd5e1;
        display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all 0.15s;
    }
    .gpm-modal-checkbox.on { background: #16a34a; border-color: #16a34a; }
    .gpm-modal-checkbox svg { width: 0.75rem; height: 0.75rem; color: #fff; }
    .gpm-modal-name { font-size: 0.8125rem; font-weight: 500; color: #0f172a; }
    :is(.dark) .gpm-modal-name { color: #e2e8f0; }
    .gpm-modal-fields {
        display: flex; align-items: center; gap: 1rem; margin-top: 0.5rem; padding-top: 0.5rem;
        border-top: 1px solid #e2e8f0; margin-left: 1.75rem;
    }
    :is(.dark) .gpm-modal-fields { border-top-color: rgb(55,65,81); }
    .gpm-modal-field { display: flex; align-items: center; gap: 0.375rem; }
    .gpm-modal-field-label { font-size: 0.6875rem; color: #64748b; white-space: nowrap; }
    .gpm-modal-field-input {
        width: 5rem; padding: 0.25rem 0.5rem; border: 1px solid #e2e8f0; border-radius: 0.25rem;
        font-size: 0.75rem; text-align: center; font-family: inherit;
    }
    :is(.dark) .gpm-modal-field-input { background: rgb(30,35,45); border-color: rgb(55,65,81); color: #e2e8f0; }
    .gpm-modal-field-toggle { cursor: pointer; }
    .gpm-modal-field-toggle input { accent-color: #16a34a; }
    .gpm-modal-count { font-size: 0.75rem; color: #64748b; margin-right: auto; }
    .gpm-group-names { display: none !important; }
    .gpm-name-modal { max-width: 420px; }
    .gpm-name-fields { display: flex; flex-direction: column; gap: 0.625rem; }
    .gpm-name-field-row { display: flex; flex-direction: column; gap: 0.25rem; }
    .gpm-name-field-label { font-size: 0.75rem; font-weight: 600; color: #374151; }
    :is(.dark) .gpm-name-field-label { color: #d1d5db; }
    .gpm-name-field-input {
        width: 100%; padding: 0.5rem 0.75rem; border: 1.5px solid #e2e8f0; border-radius: 0.5rem;
        font-size: 0.875rem; font-family: inherit; color: #0f172a; outline: none;
    }
    .gpm-name-field-input:focus { border-color: #6366f1; box-shadow: 0 0 0 2px rgba(99,102,241,0.1); }
    :is(.dark) .gpm-name-field-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e2e8f0; }
    /* Inline grup adı (modal adım 2 üstünde) */
    .gpm-inline-name { margin-bottom: 0.625rem; }
    .gpm-inline-name-toggle {
        display: flex; align-items: center; gap: 0.375rem; width: 100%;
        background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.5rem;
        padding: 0.5rem 0.75rem; cursor: pointer; font-size: 0.8125rem; color: #374151;
        font-family: inherit; transition: border-color 0.15s; text-align: left;
    }
    .gpm-inline-name-toggle:hover { border-color: #cbd5e1; }
    :is(.dark) .gpm-inline-name-toggle { background: rgb(30,35,45); border-color: rgb(55,65,81); color: #d1d5db; }
    .gpm-inline-name-icon { width: 0.875rem; height: 0.875rem; color: #6366f1; flex-shrink: 0; }
    .gpm-inline-name-arrow { width: 0.875rem; height: 0.875rem; color: #94a3b8; margin-left: auto; flex-shrink: 0; transition: transform 0.2s; }
    .gpm-arrow-open { transform: rotate(180deg); }
    .gpm-inline-name-toggle strong { color: #0f172a; }
    :is(.dark) .gpm-inline-name-toggle strong { color: #f1f5f9; }
    .gpm-inline-name-fields { display: flex; flex-direction: column; gap: 0.375rem; margin-top: 0.5rem; padding: 0.625rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.5rem; }
    :is(.dark) .gpm-inline-name-fields { background: rgb(30,35,45); border-color: rgb(55,65,81); }
    .gpm-inline-name-row { display: flex; align-items: center; gap: 0.5rem; }
    .gpm-inline-name-label { font-size: 0.6875rem; font-weight: 600; color: #64748b; width: 4.5rem; flex-shrink: 0; }
    .gpm-inline-name-input {
        flex: 1; padding: 0.375rem 0.625rem; border: 1px solid #e2e8f0; border-radius: 0.375rem;
        font-size: 0.8125rem; font-family: inherit; color: #0f172a; outline: none;
    }
    .gpm-inline-name-input:focus { border-color: #6366f1; }
    :is(.dark) .gpm-inline-name-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e2e8f0; }

    .gpm-step-desc { font-size: 0.875rem; color: #374151; line-height: 1.6; margin-bottom: 0.75rem; }
    :is(.dark) .gpm-step-desc { color: #d1d5db; }
    .gpm-step-hint { font-size: 0.75rem; color: #94a3b8; font-style: italic; }

    /* Sidebar - Yönetime Dön */
    .sidebar-back-to-head {
        padding: 0.75rem 1rem;
        border-top: 1px solid rgba(0,0,0,0.05);
    }
    .sidebar-back-btn {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        width: 100%;
        padding: 0.625rem 1rem;
        background: #d71920;
        color: #fff;
        border: none;
        border-radius: 0.5rem;
        font-size: 0.8125rem;
        font-weight: 600;
        font-family: inherit;
        cursor: pointer;
        transition: background 0.15s;
    }
    .sidebar-back-btn:hover {
        background: #b91518;
    }
    .sidebar-back-icon {
        width: 1rem;
        height: 1rem;
        flex-shrink: 0;
    }
    .dark .sidebar-back-to-head {
        border-top-color: rgba(255,255,255,0.08);
    }

    /* === THEME SETTINGS - VISUAL SELECT === */
    .ts-label {
        font-size: 14px;
        font-weight: 600;
        color: #111827;
    }
    :is(.dark) .ts-label {
        color: #e5e7eb;
    }
    .ts-helper {
        font-size: 13px;
        color: #6b7280;
        margin-top: 2px;
    }
    :is(.dark) .ts-helper {
        color: #9ca3af;
    }

    .ts-visual-select {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        margin-top: 8px;
    }
    @media (max-width: 768px) {
        .ts-visual-select {
            grid-template-columns: 1fr;
        }
    }

    .ts-visual-card {
        background: #fff;
        border: 2px solid #e5e7eb;
        border-radius: 12px;
        padding: 0;
        cursor: pointer;
        transition: all 0.2s;
        overflow: hidden;
        text-align: left;
        width: 100%;
    }
    .ts-visual-card:hover {
        border-color: #a5b4fc;
        box-shadow: 0 4px 16px rgba(99, 102, 241, 0.1);
    }
    .ts-visual-card-active {
        border-color: #6366f1;
        box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    }
    :is(.dark) .ts-visual-card {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    :is(.dark) .ts-visual-card:hover {
        border-color: #818cf8;
    }
    :is(.dark) .ts-visual-card-active {
        border-color: #818cf8;
        box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.2);
    }

    /* Preview area */
    .ts-visual-preview {
        padding: 16px;
        background: #f9fafb;
        border-bottom: 1px solid #e5e7eb;
        min-height: 160px;
        display: flex;
        align-items: stretch;
    }
    :is(.dark) .ts-visual-preview {
        background: rgb(17, 24, 39);
        border-bottom-color: rgb(55, 65, 81);
    }

    /* Sol Sabit preview */
    .ts-preview-left {
        display: flex;
        gap: 8px;
        width: 100%;
    }
    .ts-mock-sidebar {
        width: 60px;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 6px;
        background: #fff;
        border-radius: 6px;
        border: 1px solid #e5e7eb;
    }
    :is(.dark) .ts-mock-sidebar {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .ts-mock-sidebar-item {
        height: 10px;
        border-radius: 4px;
        background: #e5e7eb;
    }
    :is(.dark) .ts-mock-sidebar-item {
        background: rgb(55, 65, 81);
    }
    .ts-mock-sidebar-item.ts-mock-active {
        background: #6366f1;
    }
    .ts-mock-content {
        flex: 1;
        min-width: 0;
    }
    .ts-mock-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 4px;
    }

    /* Üst Sabit preview */
    .ts-preview-top {
        display: flex;
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }
    .ts-mock-topbar {
        display: flex;
        gap: 4px;
        padding: 6px;
        background: #fff;
        border-radius: 6px;
        border: 1px solid #e5e7eb;
    }
    :is(.dark) .ts-mock-topbar {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .ts-mock-tab {
        height: 8px;
        width: 40px;
        border-radius: 4px;
        background: #e5e7eb;
        flex-shrink: 0;
    }
    :is(.dark) .ts-mock-tab {
        background: rgb(55, 65, 81);
    }
    .ts-mock-tab.ts-mock-active {
        background: #6366f1;
    }
    .ts-mock-content-full {
        flex: 1;
        min-width: 0;
    }
    .ts-mock-grid-wide {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 4px;
    }

    .ts-mock-product {
        height: 112px;
        background: #fff;
        border-radius: 4px;
        border: 1px solid #e5e7eb;
    }
    :is(.dark) .ts-mock-product {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }

    /* Card info area */
    .ts-visual-info {
        padding: 14px 16px;
        display: flex;
        align-items: flex-start;
        gap: 12px;
    }
    .ts-visual-radio {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        border: 2px solid #d1d5db;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        margin-top: 1px;
        transition: border-color 0.15s;
    }
    .ts-visual-card-active .ts-visual-radio {
        border-color: #6366f1;
    }
    :is(.dark) .ts-visual-radio {
        border-color: rgb(75, 85, 99);
    }
    :is(.dark) .ts-visual-card-active .ts-visual-radio {
        border-color: #818cf8;
    }
    .ts-visual-radio-dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: transparent;
        transition: background 0.15s;
    }
    .ts-visual-radio-dot-active {
        background: #6366f1;
    }
    :is(.dark) .ts-visual-radio-dot-active {
        background: #818cf8;
    }
    .ts-visual-title {
        font-size: 14px;
        font-weight: 600;
        color: #111827;
    }
    :is(.dark) .ts-visual-title {
        color: #e5e7eb;
    }
    .ts-visual-desc {
        font-size: 12px;
        color: #6b7280;
        margin-top: 2px;
        line-height: 1.4;
    }
    :is(.dark) .ts-visual-desc {
        color: #9ca3af;
    }

    @keyframes spin {
        to { transform: rotate(360deg); }
    }
    .campaign-edit-save-btn-loading {
        opacity: 0.6;
        pointer-events: none;
    }

    /* Setting group spacing & divider */
    .ts-setting-group {
        margin-bottom: 4px;
    }
    .ts-divider {
        height: 1px;
        background: #e5e7eb;
        margin: 20px 0;
    }
    :is(.dark) .ts-divider {
        background: rgb(55, 65, 81);
    }

    /* 3-column variant */
    .ts-visual-select-3 {
        grid-template-columns: repeat(3, 1fr);
    }
    @media (max-width: 768px) {
        .ts-visual-select-3 {
            grid-template-columns: 1fr;
        }
    }

    /* All previews: fixed height for consistent alignment */
    .ts-visual-preview-sm {
        height: 140px;
        padding: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }

    /* Products per row mock */
    .ts-mock-row-grid {
        display: grid;
        gap: 6px;
        width: 100%;
    }
    .ts-mock-row-2 { grid-template-columns: repeat(2, 1fr); }
    .ts-mock-row-3 { grid-template-columns: repeat(3, 1fr); }
    .ts-mock-row-4 { grid-template-columns: repeat(4, 1fr); }
    .ts-mock-product-tall {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        height: 112px;
    }
    :is(.dark) .ts-mock-product-tall {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }

    /* Product image mock cards */
    .ts-mock-img-cards {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 6px;
        width: 100%;
    }
    .ts-mock-img-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        overflow: hidden;
    }
    :is(.dark) .ts-mock-img-card {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    .ts-mock-img-area {
        width: 100%;
        height: 78px;
        background: linear-gradient(135deg, #e0e7ff 0%, #c7d2fe 100%);
    }
    :is(.dark) .ts-mock-img-area {
        background: linear-gradient(135deg, rgb(55, 48, 107) 0%, rgb(67, 56, 136) 100%);
    }
    .ts-mock-img-body {
        padding: 6px;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }
    .ts-mock-img-line {
        border-radius: 2px;
        height: 5px;
    }
    .ts-mock-img-line-title {
        background: #d1d5db;
        width: 80%;
    }
    .ts-mock-img-line-desc {
        background: #e5e7eb;
        width: 60%;
    }
    .ts-mock-img-line-price {
        background: #6366f1;
        width: 40%;
        margin-top: 2px;
    }
    :is(.dark) .ts-mock-img-line-title { background: rgb(75, 85, 99); }
    :is(.dark) .ts-mock-img-line-desc { background: rgb(55, 65, 81); }
    :is(.dark) .ts-mock-img-line-price { background: #818cf8; }

    /* No-image card */
    .ts-mock-noimg-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        padding: 6px;
        display: flex;
        flex-direction: column;
        gap: 3px;
        justify-content: center;
        height: 112px;
    }
    :is(.dark) .ts-mock-noimg-card {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }

    /* === DELIVERY ZONES === */
    .dz-container { display: flex; flex-direction: column; gap: 16px; }
    .dz-map-wrap { position: relative; border-radius: 12px; overflow: hidden; border: 1px solid #e5e7eb; }
    :is(.dark) .dz-map-wrap { border-color: rgb(55,65,81); }
    .dz-map { height: 450px; width: 100%; z-index: 1; }
    .dz-map-toolbar { position: absolute; top: 10px; right: 10px; z-index: 1000; display: flex; gap: 6px; }
    .dz-map-btn { padding: 8px 14px; border-radius: 8px; border: none; background: #fff; color: #374151; font-size: 13px; font-weight: 600; box-shadow: 0 2px 8px rgba(0,0,0,0.15); cursor: pointer; display: flex; align-items: center; gap: 6px; transition: all 0.15s; }
    .dz-map-btn:hover { background: #f3f4f6; }
    .dz-map-btn-active, .dz-map-btn-draw:hover { background: #3b82f6; color: #fff; }

    .dz-content { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    @media (max-width: 1024px) { .dz-content { grid-template-columns: 1fr; } }

    .dz-form { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 20px; }
    :is(.dark) .dz-form { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .dz-form { position: relative; overflow: hidden; }
    .dz-form-loading > *:not(.dz-form-loader) { opacity: 0.15; pointer-events: none; }
    .dz-form-loader { position: absolute; inset: 0; align-items: center; justify-content: center; z-index: 5; background: rgba(255,255,255,0.5); }
    :is(.dark) .dz-form-loader { background: rgba(31,41,55,0.5); }
    .dz-form-spinner { width: 28px; height: 28px; color: #3b82f6; }
    .dz-form-title { font-size: 16px; font-weight: 700; color: #111827; margin-bottom: 16px; }
    :is(.dark) .dz-form-title { color: #e5e7eb; }
    .dz-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .dz-form-group-wide { grid-column: span 2; }
    .dz-form-label { display: block; font-size: 12px; font-weight: 600; color: #6b7280; margin-bottom: 4px; }
    :is(.dark) .dz-form-label { color: #9ca3af; }
    .dz-form-input { width: 100%; padding: 8px 12px; border: 1px solid #e5e7eb; border-radius: 8px; font-size: 14px; background: #fff; color: #111827; }
    :is(.dark) .dz-form-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .dz-form-input:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 2px rgba(59,130,246,0.15); }
    .dz-color-trigger { display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; cursor: pointer; transition: border-color 0.15s; }
    .dz-color-trigger:hover { border-color: #3b82f6; }
    :is(.dark) .dz-color-trigger { background: rgb(17,24,39); border-color: rgb(55,65,81); }
    .dz-color-preview { width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; border: 2px solid rgba(0,0,0,0.1); }
    .dz-color-trigger-text { flex: 1; font-size: 13px; color: #374151; text-align: left; }
    :is(.dark) .dz-color-trigger-text { color: #d1d5db; }
    .dz-color-dropdown { position: absolute; z-index: 50; top: calc(100% + 4px); left: 0; width: 200px; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
    :is(.dark) .dz-color-dropdown { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .dz-color-swatch { width: 28px; height: 28px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; transition: all 0.15s; padding: 0; }
    .dz-color-swatch:hover { transform: scale(1.15); }
    .dz-color-swatch-active { border-color: #111827; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #111827; }
    :is(.dark) .dz-color-swatch-active { border-color: #fff; box-shadow: 0 0 0 2px rgb(31,41,55), 0 0 0 4px #fff; }
    .dz-form-actions { display: flex; gap: 8px; margin-top: 16px; }
    .dz-btn { padding: 9px 20px; border-radius: 8px; font-size: 13px; font-weight: 600; border: none; cursor: pointer; display: flex; align-items: center; gap: 6px; transition: all 0.15s; }
    .dz-btn-save { background: #16a34a; color: #fff; }
    .dz-btn-save:hover { background: #15803d; }
    .dz-btn-save:disabled { opacity: 0.4; pointer-events: none; }
    .dz-btn-cancel { background: #f3f4f6; color: #6b7280; }
    .dz-btn-cancel:hover { background: #e5e7eb; }
    .dz-btn-delete { background: #fee2e2; color: #dc2626; }
    .dz-btn-delete:hover { background: #dc2626; color: #fff; }

    .dz-toggle { display: flex; align-items: center; gap: 8px; cursor: pointer; }
    .dz-toggle input { display: none; }
    .dz-toggle-slider { width: 40px; height: 22px; background: #d1d5db; border-radius: 11px; position: relative; transition: background 0.2s; }
    .dz-toggle input:checked + .dz-toggle-slider { background: #16a34a; }
    .dz-toggle-slider::after { content: ''; width: 18px; height: 18px; border-radius: 50%; background: #fff; position: absolute; top: 2px; left: 2px; transition: transform 0.2s; }
    .dz-toggle input:checked + .dz-toggle-slider::after { transform: translateX(18px); }
    .dz-toggle-text { font-size: 13px; font-weight: 500; color: #374151; }

    .dz-zones { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 20px; }
    :is(.dark) .dz-zones { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .dz-zones-title { font-size: 16px; font-weight: 700; color: #111827; margin-bottom: 12px; }
    :is(.dark) .dz-zones-title { color: #e5e7eb; }

    .dz-zone-card { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid #e5e7eb; border-radius: 10px; margin-bottom: 8px; transition: border-color 0.15s; }
    :is(.dark) .dz-zone-card { border-color: rgb(55,65,81); }
    .dz-zone-card:hover { border-color: #3b82f6; }
    .dz-zone-card-disabled { opacity: 0.5; }
    .dz-zone-card { outline: none; }
    .dz-zone-card:focus { outline: none; }
    .dz-zone-card-selected { border-color: #3b82f6; background: #eff6ff; }
    :is(.dark) .dz-zone-card-selected { border-color: #60a5fa; background: rgba(59,130,246,0.1); }
    .dz-zone-color { width: 12px; height: 40px; border-radius: 6px; flex-shrink: 0; }
    .dz-zone-info { flex: 1; min-width: 0; }
    .dz-zone-name { font-size: 14px; font-weight: 600; color: #111827; }
    :is(.dark) .dz-zone-name { color: #e5e7eb; }
    .dz-zone-meta { display: flex; gap: 12px; font-size: 12px; color: #6b7280; margin-top: 3px; }
    .dz-zone-meta i { margin-right: 2px; }
    .dz-zone-actions { display: flex; gap: 4px; flex-shrink: 0; }
    .dz-zone-btn { width: 32px; height: 32px; border-radius: 8px; border: none; background: transparent; color: #6b7280; display: flex; align-items: center; justify-content: center; font-size: 13px; cursor: pointer; transition: all 0.15s; }
    .dz-zone-btn:hover { background: #f3f4f6; color: #111827; }
    :is(.dark) .dz-zone-btn:hover { background: rgb(55,65,81); color: #e5e7eb; }
    .dz-zone-btn-danger:hover { background: #fee2e2; color: #dc2626; }

    .dz-empty { text-align: center; padding: 32px 16px; color: #9ca3af; }
    .dz-empty i { font-size: 36px; margin-bottom: 12px; opacity: 0.4; }
    .dz-empty p { font-size: 14px; margin: 4px 0; }
    .dz-empty-hint { font-size: 12px; }

    .dz-map-info { position: absolute; bottom: 10px; left: 10px; z-index: 1000; background: rgba(0,0,0,0.7); color: #fff; font-size: 12px; padding: 6px 12px; border-radius: 6px; }
    .dz-iso-form { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); z-index: 1000; }
    .dz-iso-form-inner { background: #fff; border-radius: 12px; padding: 16px 20px; box-shadow: 0 8px 32px rgba(0,0,0,0.2); min-width: 340px; }
    :is(.dark) .dz-iso-form-inner { background: rgb(31,41,55); }
    .dz-iso-preset { padding: 6px 12px; border-radius: 6px; border: 1px solid #e5e7eb; background: #fff; font-size: 13px; font-weight: 600; color: #374151; cursor: pointer; transition: all 0.15s; }
    .dz-iso-preset:hover { border-color: #3b82f6; color: #3b82f6; }
    .dz-iso-preset-active { background: #3b82f6; border-color: #3b82f6; color: #fff; }
    :is(.dark) .dz-iso-preset { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #e5e7eb; }
    .dz-map-hint { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); z-index: 1000; background: rgba(0,0,0,0.75); color: #fff; font-size: 13px; padding: 8px 16px; border-radius: 8px; white-space: nowrap; }
    .dz-map-hint strong { color: #fbbf24; }
    .dz-map-btn-danger { background: #fee2e2; color: #dc2626; }
    .dz-map-btn-danger:hover { background: #dc2626; color: #fff; }

    .dz-restaurant-marker { background: #dc2626; color: #fff; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; box-shadow: 0 2px 8px rgba(0,0,0,0.3); border: 3px solid #fff; }
    .dz-iso-presets { display: flex; gap: 8px; margin-top: 4px; flex-wrap: wrap; }
    .dz-iso-custom-input { width: 70px; }
    .dz-iso-actions { display: flex; gap: 8px; margin-top: 12px; }

    /* ── Reviews Stats ─────────────────────────────────────────── */
    .rv-stats-row { display: flex; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
    .rv-stat-card { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 18px 22px; flex: 1; min-width: 180px; }
    :is(.dark) .rv-stat-card { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .rv-stat-icon { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .rv-stat-svg { width: 22px; height: 22px; }
    .rv-stat-icon-rating { background: #fef3c7; color: #f59e0b; }
    .rv-stat-icon-total { background: #dbeafe; color: #3b82f6; }
    .rv-stat-icon-trend { background: #d1fae5; color: #10b981; }
    .rv-stat-value { font-size: 22px; font-weight: 800; color: #111827; line-height: 1.2; }
    :is(.dark) .rv-stat-value { color: #f3f4f6; }
    .rv-stat-label { font-size: 13px; color: #6b7280; font-weight: 500; }
    :is(.dark) .rv-stat-label { color: #9ca3af; }

    /* ── Review Detail Modal ──────────────────────────────────── */
    .rv-detail-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
    .rv-detail-avatar { width: 36px; height: 36px; border-radius: 50%; background: #f0fdf4; color: #16a34a; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; flex-shrink: 0; }
    :is(.dark) .rv-detail-avatar { background: rgb(22,78,50); color: #4ade80; }
    .rv-detail-stars { display: flex; gap: 2px; flex-shrink: 0; }
    .rv-detail-comment { font-size: 14px; color: #374151; line-height: 1.6; margin-bottom: 12px; }
    :is(.dark) .rv-detail-comment { color: #d1d5db; }
    .rv-detail-thumbs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
    .rv-detail-tag { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 20px; font-size: 12px; font-weight: 500; }
    .rv-detail-tag-up { background: #d1fae5; color: #065f46; }
    .rv-detail-tag-down { background: #fee2e2; color: #991b1b; }
    :is(.dark) .rv-detail-tag-up { background: rgb(22,78,50); color: #86efac; }
    :is(.dark) .rv-detail-tag-down { background: rgb(69,26,26); color: #fca5a5; }
    .rv-detail-reply { background: #ecfdf5; border-left: 4px solid #10b981; border-radius: 0 8px 8px 0; padding: 12px 16px; margin-top: 16px; }
    :is(.dark) .rv-detail-reply { background: rgb(22,78,50); border-left-color: #34d399; }

    .rv-detail-section { margin-top: 16px; padding-top: 16px; border-top: 1px solid #e5e7eb; }
    :is(.dark) .rv-detail-section { border-top-color: rgb(55,65,81); }
    .rv-detail-section-title { font-size: 13px; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 10px; }
    :is(.dark) .rv-detail-section-title { color: #9ca3af; }
    .rv-detail-product-list { display: flex; flex-direction: column; gap: 6px; }
    .rv-detail-product-row { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: #f9fafb; border-radius: 6px; }
    :is(.dark) .rv-detail-product-row { background: rgb(31,41,55); }

    /* ── Reply Modal Review Box ───────────────────────────────── */
    .rv-reply-review-box { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 14px 16px; margin-bottom: 16px; }
    :is(.dark) .rv-reply-review-box { background: rgb(31,41,55); border-color: rgb(55,65,81); }

    /* ── Area & Table Management ──────────────────────────────── */
    .atm-branch-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
    .atm-branch-label { font-size: 13px; font-weight: 600; color: #374151; }
    :is(.dark) .atm-branch-label { color: #d1d5db; }
    .atm-branch-select { padding: 6px 10px; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; font-size: 13px; }
    :is(.dark) .atm-branch-select { background: rgb(31,41,55); border-color: rgb(75,85,99); color: #d1d5db; }
    .atm-wrap { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; }
    :is(.dark) .atm-wrap { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .atm-panels { display: grid; grid-template-columns: 320px 1fr; gap: 0; min-height: 500px; }
    @media (max-width: 768px) { .atm-panels { grid-template-columns: 1fr; } }
    .atm-panel { padding: 16px; }
    .atm-panel-areas { border-right: 1px solid #e5e7eb; background: #f9fafb; }
    :is(.dark) .atm-panel-areas { border-right-color: rgb(55,65,81); background: rgb(17,24,39); }
    .atm-panel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; gap: 8px; flex-wrap: wrap; }
    .atm-panel-title { font-size: 15px; font-weight: 700; color: #111827; }
    :is(.dark) .atm-panel-title { color: #f3f4f6; }
    .atm-header-actions { display: flex; gap: 6px; }
    .atm-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; border: 1px solid transparent; transition: all 0.15s; }
    .atm-btn:disabled { opacity: 0.5; cursor: not-allowed; }
    .atm-btn-sm { padding: 6px 12px; font-size: 12px; }
    .atm-btn-primary { background: #2563eb; color: #fff; }
    .atm-btn-primary:hover { background: #1d4ed8; }
    .atm-btn-secondary { background: #fff; color: #374151; border-color: #d1d5db; }
    .atm-btn-secondary:hover { background: #f3f4f6; }
    .atm-btn-danger { background: #dc2626; color: #fff; }
    .atm-btn-danger:hover { background: #b91c1c; }
    :is(.dark) .atm-btn-secondary { background: rgb(55,65,81); color: #d1d5db; border-color: rgb(75,85,99); }
    :is(.dark) .atm-btn-secondary:hover { background: rgb(75,85,99); }
    .atm-btn-icon { width: 14px; height: 14px; }
    .atm-inline-form { display: flex; gap: 6px; margin-bottom: 10px; align-items: center; flex-wrap: wrap; }
    .atm-input { padding: 7px 10px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 13px; flex: 1; min-width: 100px; background: #fff; color: #111827; }
    :is(.dark) .atm-input { background: rgb(55,65,81); border-color: rgb(75,85,99); color: #f3f4f6; }
    .atm-input-sm { flex: 0 0 auto; width: 100px; }
    .atm-label { display: block; font-size: 12px; font-weight: 600; color: #6b7280; margin-bottom: 4px; }
    :is(.dark) .atm-label { color: #9ca3af; }
    .atm-list, .atm-tables-grid { display: flex; flex-direction: column; gap: 6px; }
    .atm-tables-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
    .atm-item { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; transition: all 0.15s; }
    :is(.dark) .atm-item { background: rgb(55,65,81); border-color: rgb(75,85,99); }
    .atm-item:hover { border-color: #9ca3af; }
    .atm-item-active { background: #dbeafe; border-color: #3b82f6; }
    :is(.dark) .atm-item-active { background: rgb(30,58,138); border-color: #60a5fa; }
    .atm-item-locked { opacity: 0.7; }
    .atm-drag-handle { cursor: grab; color: #9ca3af; flex-shrink: 0; }
    .atm-drag-handle:active { cursor: grabbing; }
    .atm-drag-icon { width: 16px; height: 16px; }
    .atm-item-name { flex: 1; font-size: 13px; font-weight: 500; color: #111827; cursor: pointer; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    :is(.dark) .atm-item-name { color: #f3f4f6; }
    .atm-badge { background: #e5e7eb; color: #374151; padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; flex-shrink: 0; }
    :is(.dark) .atm-badge { background: rgb(75,85,99); color: #d1d5db; }
    .atm-size-badge { background: #dbeafe; color: #1e40af; padding: 2px 6px; border-radius: 4px; font-size: 10px; font-weight: 600; flex-shrink: 0; }
    :is(.dark) .atm-size-badge { background: rgb(30,58,138); color: #bfdbfe; }
    .atm-open-dot { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; }
    .atm-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; background: transparent; border: none; border-radius: 4px; color: #6b7280; cursor: pointer; transition: all 0.15s; flex-shrink: 0; }
    .atm-icon-btn:hover:not(:disabled) { background: #f3f4f6; color: #374151; }
    .atm-icon-btn:disabled { opacity: 0.3; cursor: not-allowed; }
    :is(.dark) .atm-icon-btn:hover:not(:disabled) { background: rgb(75,85,99); color: #f3f4f6; }
    .atm-icon-btn-danger:hover:not(:disabled) { background: #fee2e2; color: #dc2626; }
    :is(.dark) .atm-icon-btn-danger:hover:not(:disabled) { background: rgb(69,26,26); color: #fca5a5; }
    .atm-icon-sm { width: 14px; height: 14px; }
    .atm-empty { padding: 30px 20px; text-align: center; color: #9ca3af; font-size: 13px; }
    :is(.dark) .atm-empty { color: #6b7280; }
    .atm-tables-area { position: relative; min-height: 400px; }
    .atm-empty-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; color: #9ca3af; font-size: 13px; padding: 20px; }
    :is(.dark) .atm-empty-center { color: #6b7280; }
    .atm-no-branch { padding: 40px; text-align: center; color: #9ca3af; }
    .atm-bulk-form { flex-direction: column; align-items: stretch; gap: 8px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px; padding: 12px; }
    :is(.dark) .atm-bulk-form { background: rgb(30,58,138); border-color: rgb(59,130,246); }
    .atm-bulk-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .atm-bulk-sep { color: #6b7280; font-weight: 600; }
    .atm-bulk-preview { font-size: 12px; color: #2563eb; font-family: monospace; }
    :is(.dark) .atm-bulk-preview { color: #93c5fd; }
    .atm-segmented { display: inline-flex; border: 1px solid #d1d5db; border-radius: 6px; overflow: hidden; }
    .atm-segmented button { padding: 6px 12px; background: #fff; border: none; font-size: 12px; font-weight: 600; color: #6b7280; cursor: pointer; }
    .atm-segmented button.atm-segmented-active { background: #2563eb; color: #fff; }
    :is(.dark) .atm-segmented { border-color: rgb(75,85,99); }
    :is(.dark) .atm-segmented button { background: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .atm-segmented button.atm-segmented-active { background: #3b82f6; color: #fff; }
    .atm-sortable-ghost { opacity: 0.4; background: #f3f4f6; }
    :is(.dark) .atm-sortable-ghost { background: rgb(17,24,39); }
    .atm-modal-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; }
    .atm-modal-backdrop { position: absolute; inset: 0; background: rgba(15,23,42,0.6); backdrop-filter: blur(2px); }
    .atm-modal { position: relative; background: #fff; border-radius: 14px; width: 100%; max-width: 560px; box-shadow: 0 25px 60px rgba(0,0,0,0.3); overflow: hidden; }
    .atm-modal-sm { max-width: 440px; }
    :is(.dark) .atm-modal { background: rgb(31,41,55); }
    .atm-modal-header { padding: 20px 28px; border-bottom: 1px solid #e5e7eb; display: flex; align-items: center; justify-content: space-between; background: linear-gradient(to bottom, #f9fafb, #fff); }
    :is(.dark) .atm-modal-header { border-bottom-color: rgb(55,65,81); background: linear-gradient(to bottom, rgb(17,24,39), rgb(31,41,55)); }
    .atm-modal-title { font-size: 17px; font-weight: 700; color: #111827; }
    :is(.dark) .atm-modal-title { color: #f3f4f6; }
    .atm-modal-body { padding: 24px 28px; }
    .atm-modal-body .atm-input { width: 100%; box-sizing: border-box; padding: 10px 14px; font-size: 14px; }
    .atm-modal-footer { padding: 16px 28px; border-top: 1px solid #e5e7eb; display: flex; gap: 10px; justify-content: flex-end; background: #f9fafb; }
    :is(.dark) .atm-modal-footer { border-top-color: rgb(55,65,81); background: rgb(17,24,39); }
    .atm-modal-footer .atm-btn { padding: 10px 22px; font-size: 13px; }
    .atm-modal-tabs { display: flex; gap: 6px; padding: 14px 28px; border-bottom: 1px solid #e5e7eb; background: #f9fafb; }
    :is(.dark) .atm-modal-tabs { border-bottom-color: rgb(55,65,81); background: rgb(17,24,39); }
    .atm-modal-tab { padding: 9px 20px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; font-size: 13px; font-weight: 600; color: #6b7280; cursor: pointer; transition: all 0.15s; }
    .atm-modal-tab:hover { color: #374151; border-color: #9ca3af; }
    .atm-modal-tab-active { color: #fff !important; background: #2563eb !important; border-color: #2563eb !important; box-shadow: 0 2px 6px rgba(37,99,235,0.25); }
    :is(.dark) .atm-modal-tab { background: rgb(55,65,81); color: #9ca3af; border-color: rgb(75,85,99); }
    :is(.dark) .atm-modal-tab:hover { color: #d1d5db; border-color: rgb(107,114,128); }
    :is(.dark) .atm-modal-tab-active { color: #fff !important; background: #3b82f6 !important; border-color: #3b82f6 !important; }
    .atm-hint { display: block; margin-top: 6px; font-size: 11px; color: #9ca3af; font-weight: 500; line-height: 1.4; }
    :is(.dark) .atm-hint { color: #6b7280; }
    .atm-modal-body .atm-label { display: block; font-size: 12px; font-weight: 700; color: #374151; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.4px; }
    :is(.dark) .atm-modal-body .atm-label { color: #d1d5db; }
    .atm-label-top { margin-top: 18px; }
    .atm-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .atm-modal-body .atm-segmented { display: flex; width: 100%; border: 1px solid #d1d5db; border-radius: 8px; overflow: hidden; }
    .atm-modal-body .atm-segmented button { flex: 1; padding: 12px 14px; background: #fff; border: none; font-size: 13px; font-weight: 600; color: #6b7280; cursor: pointer; transition: all 0.15s; }
    .atm-modal-body .atm-segmented button:hover:not(.atm-segmented-active) { background: #f3f4f6; }
    .atm-modal-body .atm-segmented button.atm-segmented-active { background: #2563eb !important; color: #fff !important; box-shadow: inset 0 2px 4px rgba(0,0,0,0.1); }
    :is(.dark) .atm-modal-body .atm-segmented { border-color: rgb(75,85,99); }
    :is(.dark) .atm-modal-body .atm-segmented button { background: rgb(55,65,81); color: #9ca3af; }
    :is(.dark) .atm-modal-body .atm-segmented button:hover:not(.atm-segmented-active) { background: rgb(75,85,99); }
    :is(.dark) .atm-modal-body .atm-segmented button.atm-segmented-active { background: #3b82f6 !important; color: #fff !important; }
    .atm-confirm-text { font-size: 14px; color: #374151; margin: 0; line-height: 1.6; }
    :is(.dark) .atm-confirm-text { color: #d1d5db; }
    .atm-bulk-preview-box { margin-top: 18px; padding: 14px 16px; background: linear-gradient(to right, #eff6ff, #f0f9ff); border: 1px solid #bfdbfe; border-radius: 8px; }
    :is(.dark) .atm-bulk-preview-box { background: rgb(30,58,138); border-color: rgb(59,130,246); }
    .atm-bulk-preview-label { font-size: 11px; font-weight: 700; color: #1e40af; text-transform: uppercase; letter-spacing: 0.5px; display: block; margin-bottom: 6px; }
    :is(.dark) .atm-bulk-preview-label { color: #93c5fd; }
    .atm-bulk-preview-text { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 13px; color: #1e3a8a; line-height: 1.5; }
    :is(.dark) .atm-bulk-preview-text { color: #dbeafe; }
    .atm-toast { position: fixed; bottom: 24px; right: 24px; padding: 12px 20px; border-radius: 8px; font-size: 13px; font-weight: 600; color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.15); z-index: 10000; opacity: 0; transform: translateY(10px); transition: all 0.3s; }
    .atm-toast-show { opacity: 1; transform: translateY(0); }
    .atm-toast-success { background: #16a34a; }
    .atm-toast-error { background: #dc2626; }

    /* ── Preview Site ─────────────────────────────────────────── */
    .pv-subtitle { font-size: 14px; color: #6b7280; margin-bottom: 20px; }
    :is(.dark) .pv-subtitle { color: #9ca3af; }
    .pv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
    @media (min-width: 1100px) { .pv-grid { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 640px) { .pv-grid { grid-template-columns: 1fr; } }
    .pv-card { display: flex; align-items: center; gap: 16px; padding: 20px; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; cursor: pointer; text-decoration: none; color: inherit; transition: all 0.2s; text-align: left; }
    .pv-card:hover { border-color: #3b82f6; box-shadow: 0 4px 16px rgba(59,130,246,0.12); transform: translateY(-2px); }
    :is(.dark) .pv-card { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    :is(.dark) .pv-card:hover { border-color: #60a5fa; box-shadow: 0 4px 16px rgba(96,165,250,0.15); }
    .pv-card-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .pv-card-icon-web { background: #dbeafe; color: #2563eb; }
    .pv-card-icon-mobile { background: #d1fae5; color: #059669; }
    .pv-card-icon-qr { background: #fef3c7; color: #d97706; }
    .pv-card-icon-qrorder { background: #fce7f3; color: #db2777; }
    .pv-card-icon-kiosk { background: #fef3c7; color: #b45309; }
    .pv-card-icon-res { background: #ede9fe; color: #7c3aed; }
    :is(.dark) .pv-card-icon-web { background: rgb(30,58,138); color: #93c5fd; }
    :is(.dark) .pv-card-icon-mobile { background: rgb(6,78,59); color: #6ee7b7; }
    :is(.dark) .pv-card-icon-qr { background: rgb(120,53,15); color: #fbbf24; }
    :is(.dark) .pv-card-icon-qrorder { background: rgb(131,24,67); color: #f9a8d4; }
    :is(.dark) .pv-card-icon-kiosk { background: rgb(120,53,15); color: #fbbf24; }
    :is(.dark) .pv-card-icon-res { background: rgb(76,29,149); color: #c4b5fd; }
    .pv-icon { width: 24px; height: 24px; }
    .pv-card-body { flex: 1; min-width: 0; }
    .pv-card-title { font-size: 15px; font-weight: 700; color: #111827; margin: 0 0 2px; }
    :is(.dark) .pv-card-title { color: #f3f4f6; }
    .pv-card-desc { font-size: 12px; color: #9ca3af; margin: 0; }
    :is(.dark) .pv-card-desc { color: #6b7280; }
    .pv-card-arrow { width: 18px; height: 18px; color: #d1d5db; flex-shrink: 0; }
    :is(.dark) .pv-card-arrow { color: #4b5563; }
    .pv-card:hover .pv-card-arrow { color: #3b82f6; }

    /* ── Mobile Preview Modal ─────────────────────────────────── */
    .pv-mobile-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(15,23,42,0.85); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 20px; }
    .pv-mobile-wrap { display: flex; flex-direction: column; align-items: center; gap: 0; }
    .pv-mobile-toolbar { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.1); border-radius: 10px 10px 0 0; backdrop-filter: blur(10px); min-width: 320px; justify-content: space-between; }
    .pv-mobile-toolbar-title { font-size: 13px; font-weight: 600; color: #fff; flex: 1; }
    .pv-mobile-toolbar-btn { width: 32px; height: 32px; border-radius: 8px; background: rgba(255,255,255,0.1); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; color: #fff; transition: background 0.15s; }
    .pv-mobile-toolbar-btn:hover { background: rgba(255,255,255,0.2); }
    .pv-mobile-toolbar-icon { width: 16px; height: 16px; }

    /* iPhone 16 Pro Max frame */
    .pv-phone { position: relative; width: 460px; height: 900px; background: #1a1a1a; border-radius: 54px; padding: 15px; box-shadow: 0 0 0 2px #333, 0 0 0 4px #1a1a1a, 0 20px 60px rgba(0,0,0,0.6), inset 0 0 0 2px #2a2a2a; overflow: hidden; }
    .pv-phone-notch { position: absolute; top: 14px; left: 50%; transform: translateX(-50%); z-index: 10; display: flex; justify-content: center; padding-top: 10px; }
    .pv-phone-notch-island { width: 126px; height: 36px; background: #000; border-radius: 20px; }
    .pv-phone-statusbar { position: absolute; top: 0; left: 0; right: 0; height: 54px; z-index: 5; background: #fff; display: flex; align-items: flex-end; justify-content: space-between; padding: 0 32px 8px; pointer-events: none; }
    .pv-sb-time { font-size: 16px; font-weight: 600; color: #000; font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', sans-serif; letter-spacing: -0.2px; line-height: 1; }
    .pv-sb-icons { display: flex; align-items: center; gap: 7px; color: #000; line-height: 1; }
    .pv-sb-icons svg { display: block; }
    .pv-phone-iframe { width: 100%; height: 100%; border: none; background: #fff; padding-top: 54px; padding-bottom: 10px; box-sizing: border-box; overflow: auto; }
    .pv-phone-screen { position: relative; width: 100%; height: 100%; border-radius: 42px; overflow: hidden; background: #000; overflow-x: hidden; }
    .pv-phone-bottom { position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 10; }
    .pv-phone-homebar { width: 134px; height: 5px; background: #fff; border-radius: 3px; opacity: 0.3; }

    @media (max-height: 920px) {
        .pv-phone { width: 340px; height: 736px; border-radius: 46px; padding: 12px; }
        .pv-phone-screen { border-radius: 36px; }
        .pv-phone-notch-island { width: 110px; height: 32px; }
    }
    @media (max-height: 780px) {
        .pv-phone { width: 300px; height: 650px; border-radius: 40px; padding: 10px; }
        .pv-phone-screen { border-radius: 32px; }
    }

    /* ── Tablet Frame (yatay, k-demo tarzı scale yaklaşımı) ──── */
    .pv-tablet { position: relative; width: 1450px; height: 950px; background: #2c2c2e; border-radius: 25px; padding: 30px; box-shadow: 0 20px 40px rgba(0,0,0,0.3), 0 0 0 3px #1a1a1c, inset 0 1px 0 rgba(255,255,255,0.1); flex-shrink: 0; transform-origin: center center; }
    .pv-tablet::before { content: ''; position: absolute; top: 12px; left: 50%; transform: translateX(-50%); width: 50px; height: 5px; background: #4a4a4c; border-radius: 3px; }
    .pv-tablet-screen { width: 100%; height: 100%; border-radius: 12px; overflow: hidden; background: #000; box-shadow: inset 0 0 0 2px #333, 0 8px 16px rgba(0,0,0,0.4); }
    .pv-tablet-iframe { width: 100%; height: 100%; border: none; background: #fff; display: block; }
    @media (min-width: 2200px) { .pv-tablet { transform: scale(0.95); } }
    @media (min-width: 1900px) and (max-width: 2199px) { .pv-tablet { transform: scale(0.85); } }
    @media (min-width: 1600px) and (max-width: 1899px) { .pv-tablet { transform: scale(0.75); } }
    @media (min-width: 1300px) and (max-width: 1599px) { .pv-tablet { transform: scale(0.65); } }
    @media (max-width: 1299px) { .pv-tablet { transform: scale(0.55); } }
    @media (max-width: 1000px) { .pv-tablet { transform: scale(0.45); } }
    @media (max-width: 800px) { .pv-tablet { transform: scale(0.35); } }

    /* ── Terminal Frame (dikey kiosk, sabit boyut + scale) ────── */
    .pv-terminal { position: relative; width: 580px; height: 1040px; background: #111; border-radius: 24px 24px 0 0; padding: 16px 16px 0; box-shadow: 0 0 0 3px #333, 0 0 0 5px #111, 0 20px 60px rgba(0,0,0,0.6); flex-shrink: 0; transform-origin: center center; transform: scale(0.6); }
    .pv-terminal-screen { width: 100%; height: 100%; border-radius: 12px 12px 0 0; overflow: hidden; background: #fff; box-shadow: inset 0 0 0 2px #333; }
    .pv-terminal-iframe { width: 100%; height: 100%; border: none; background: #fff; display: block; }
    .pv-terminal-chin { height: 44px; background: #111; border-radius: 0 0 24px 24px; margin: 0 -16px; box-shadow: 0 0 0 3px #333, 0 0 0 5px #111, 0 10px 30px rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; }
    .pv-terminal-chin::after { content: ''; width: 60px; height: 4px; background: #444; border-radius: 2px; }
    @media (max-height: 900px) { .pv-terminal { transform: scale(0.5); } }
    @media (max-height: 750px) { .pv-terminal { transform: scale(0.4); } }
    @media (max-width: 700px) { .pv-terminal { transform: scale(0.35); } }

    /* ── Panel Locale Switcher ────────────────────────────────── */
    .pls-wrap { position: relative; }
    .pls-btn { display: flex; align-items: center; gap: 4px; padding: 6px 8px; background: transparent; border: none; border-radius: 6px; cursor: pointer; color: #6b7280; transition: all 0.15s; }
    .pls-btn:hover { background: #f3f4f6; color: #374151; }
    :is(.dark) .pls-btn:hover { background: rgb(55,65,81); color: #d1d5db; }
    .pls-icon { width: 18px; height: 18px; }
    .pls-code { font-size: 12px; font-weight: 700; letter-spacing: 0.5px; }
    .pls-dropdown { position: absolute; top: 100%; right: 0; margin-top: 6px; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); min-width: 160px; overflow: hidden; z-index: 50; }
    :is(.dark) .pls-dropdown { background: rgb(31,41,55); border-color: rgb(55,65,81); }
    .pls-option { display: flex; align-items: center; gap: 10px; padding: 10px 14px; text-decoration: none; color: #374151; transition: background 0.1s; font-size: 13px; }
    .pls-option:hover { background: #f3f4f6; }
    :is(.dark) .pls-option { color: #d1d5db; }
    :is(.dark) .pls-option:hover { background: rgb(55,65,81); }
    .pls-option-active { font-weight: 700; color: #2563eb; background: #eff6ff; }
    :is(.dark) .pls-option-active { color: #60a5fa; background: rgb(30,58,138); }
    .pls-option-code { font-weight: 700; font-size: 11px; letter-spacing: 0.5px; min-width: 22px; }
    .pls-option-name { flex: 1; }

    /* ── QR Download Buttons (Site Settings) ──────────────────── */
    .qr-feedback-notice { padding: 12px; background: #fef3c7; border-left: 4px solid #f59e0b; border-radius: 4px; font-size: 13px; color: #92400e; }
    :is(.dark) .qr-feedback-notice { background: rgb(69,48,0); color: #fbbf24; }
    .qr-download-buttons { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
    .qr-download-btn { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; background: #fff; color: #374151; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s; }
    .qr-download-btn:hover { background: #f3f4f6; border-color: #9ca3af; }
    .qr-download-btn:disabled { opacity: 0.5; cursor: not-allowed; }
    :is(.dark) .qr-download-btn { background: rgb(55,65,81); color: #d1d5db; border-color: rgb(75,85,99); }
    :is(.dark) .qr-download-btn:hover { background: rgb(75,85,99); }
    .qr-download-btn-icon { width: 18px; height: 18px; }
    .qr-download-btn-pdf { background: #dbeafe; border-color: #93c5fd; color: #1e40af; }
    .qr-download-btn-pdf:hover { background: #bfdbfe; border-color: #60a5fa; }
    :is(.dark) .qr-download-btn-pdf { background: rgb(30,58,138); color: #bfdbfe; border-color: rgb(59,130,246); }
    :is(.dark) .qr-download-btn-pdf:hover { background: rgb(30,64,175); }
    .qr-download-btn-badge { margin-left: 4px; padding: 2px 8px; background: #1e40af; color: #fff; font-size: 11px; font-weight: 700; border-radius: 10px; letter-spacing: 0.3px; }
    :is(.dark) .qr-download-btn-badge { background: #60a5fa; color: #1e3a8a; }

/* ════════════════════════════════════════════════════════════
   Eklentiler (Add-ons) Settings Page
   ════════════════════════════════════════════════════════════ */
.addons-wrap { display: flex; flex-direction: column; gap: 32px; }
.addons-section { display: flex; flex-direction: column; gap: 10px; }
/* Sectionlar Alpine wrapper içinde flex parent yok → her section'a üst boşluk.
   :first-child hariç tutuyoruz ki sayfanın en üst section'ı ekstra boşluk almasın. */
.addons-section:not(:first-child) { margin-top: 32px; }
.addons-section-title { font-size: 18px; font-weight: 700; margin: 0; color: #0f172a; letter-spacing: -0.2px; }
:is(.dark) .addons-section-title { color: #f3f4f6; }
.addons-section-desc { font-size: 13px; color: #64748b; margin: 0 0 8px; }
:is(.dark) .addons-section-desc { color: #94a3b8; }

/* Branch selector — şube bazlı addon kartlarını filtreler */
.addons-branch-selector {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 14px 18px;
    margin-bottom: 18px;
}
:is(.dark) .addons-branch-selector { background: rgb(31,41,55); border-color: rgb(55,65,81); }
.addons-branch-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.addons-branch-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.addons-branch-pill {
    padding: 6px 14px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #374151;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.1s, border-color 0.1s;
}
.addons-branch-pill:hover { background: #f9fafb; border-color: #cbd5e1; }
.addons-branch-pill-active {
    background: #2563eb !important;
    color: #fff !important;
    border-color: #2563eb !important;
}
:is(.dark) .addons-branch-pill { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #d1d5db; }
:is(.dark) .addons-branch-pill:hover { background: rgb(31,41,55); }
.addons-branch-hint { font-size: 11px; color: #94a3b8; margin: 8px 0 0; }

/* Şube dropdown (çoklu şubede pill yerine aranabilir dropdown) */
.addons-branch-dropdown-trigger {
    display: inline-flex; align-items: center; gap: 6px;
}
.addons-branch-trigger-icon { width: 14px; height: 14px; flex-shrink: 0; }
.addons-branch-trigger-arrow { width: 14px; height: 14px; transition: transform 0.15s; flex-shrink: 0; }
.addons-branch-trigger-arrow-open { transform: rotate(180deg); }
.addons-branch-dropdown {
    position: absolute; top: calc(100% + 4px); left: 0;
    min-width: 240px; max-width: 320px;
    background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.10);
    z-index: 30; overflow: hidden;
}
:is(.dark) .addons-branch-dropdown { background: rgb(17,24,39); border-color: rgb(55,65,81); }
.addons-branch-dropdown-search {
    display: flex; align-items: center; gap: 6px;
    padding: 8px 10px; border-bottom: 1px solid #e5e7eb;
}
:is(.dark) .addons-branch-dropdown-search { border-bottom-color: rgb(55,65,81); }
.addons-branch-dropdown-search-icon { width: 14px; height: 14px; color: #94a3b8; flex-shrink: 0; }
.addons-branch-dropdown-input {
    flex: 1; border: 0; outline: 0; background: transparent;
    font-size: 13px; color: #111827; padding: 2px 0;
}
:is(.dark) .addons-branch-dropdown-input { color: #f3f4f6; }
.addons-branch-dropdown-list {
    max-height: 280px; overflow-y: auto; padding: 4px 0;
}
.addons-branch-dropdown-item {
    display: flex; align-items: center; gap: 8px;
    width: 100%; padding: 8px 12px;
    background: transparent; border: 0; cursor: pointer;
    font-size: 13px; color: #374151; text-align: left;
}
.addons-branch-dropdown-item:hover { background: #f3f4f6; }
:is(.dark) .addons-branch-dropdown-item { color: #d1d5db; }
:is(.dark) .addons-branch-dropdown-item:hover { background: rgb(31,41,55); }
.addons-branch-dropdown-item-active { color: #2563eb; font-weight: 600; }
:is(.dark) .addons-branch-dropdown-item-active { color: #60a5fa; }
.addons-branch-dropdown-item-icon { width: 14px; height: 14px; color: #94a3b8; flex-shrink: 0; }
.addons-branch-dropdown-item-check { width: 14px; height: 14px; color: #2563eb; margin-left: auto; flex-shrink: 0; }
:is(.dark) .addons-branch-dropdown-item-check { color: #60a5fa; }

.addons-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 768px) { .addons-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1280px) { .addons-grid { grid-template-columns: 1fr 1fr 1fr; } }

.addons-card {
    position: relative;
    display: flex; flex-direction: column; gap: 12px;
    padding: 18px 20px; background: #fff;
    border: 1px solid #e5e7eb; border-radius: 14px;
    transition: transform 0.15s ease, border-color 0.15s, box-shadow 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02);
}
/* İçerik üst kısım: ikon + body yatay; action alta düşer */
.addons-card-top { display: flex; gap: 14px; align-items: flex-start; }
.addons-card:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(15,23,42,0.06); }
:is(.dark) .addons-card { background: rgb(31,41,55); border-color: rgb(55,65,81); box-shadow: none; }
:is(.dark) .addons-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.3); }
.addons-card-active {
    border-color: #86efac;
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 40%);
}
:is(.dark) .addons-card-active {
    border-color: #16a34a;
    background: linear-gradient(135deg, rgba(22,163,74,0.1) 0%, rgb(31,41,55) 50%);
}

.addons-card-icon {
    flex-shrink: 0; width: 48px; height: 48px; border-radius: 12px;
    background: #eff6ff; color: #2563eb;
    display: flex; align-items: center; justify-content: center;
}
.addons-card-active .addons-card-icon { background: #dcfce7; color: #16a34a; }
:is(.dark) .addons-card-icon { background: rgba(37,99,235,0.15); color: #93c5fd; }
:is(.dark) .addons-card-active .addons-card-icon { background: rgba(22,163,74,0.2); color: #86efac; }
.addons-card-icon-plain { background: #f9fafb; padding: 8px; }
.addons-card-active .addons-card-icon-plain { background: #fff; padding: 8px; border: 1px solid #86efac; }
:is(.dark) .addons-card-icon-plain { background: rgb(17,24,39); }
:is(.dark) .addons-card-active .addons-card-icon-plain { background: rgb(17,24,39); border: 1px solid #16a34a; }
.addons-icon { width: 26px; height: 26px; }
.addons-platform-logo { max-width: 100%; max-height: 100%; object-fit: contain; }

.addons-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.addons-card-title { font-size: 14px; font-weight: 700; color: #0f172a; line-height: 1.3; letter-spacing: -0.1px; }
:is(.dark) .addons-card-title { color: #f3f4f6; }
.addons-card-desc { font-size: 12px; color: #64748b; line-height: 1.45; }
:is(.dark) .addons-card-desc { color: #94a3b8; }

.addons-card-action {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
}
:is(.dark) .addons-card-action { border-top-color: rgba(255,255,255,0.06); }
/* Status badge ve buton — eşit yükseklik için ortak satır kuralı */
.addons-card-action .addons-status,
.addons-card-action .addons-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 14px;
    font-size: 13px;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}
.addons-card-action .addons-status { width: auto; }
.addons-card-action .addons-btn { width: 100%; }

/* Status badge: green/red dot + label (sabit genişlik — hizalı duruş için) */
.addons-status {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    padding: 8px 16px; border-radius: 8px;
    font-size: 11px; font-weight: 700; letter-spacing: 0.2px;
    text-transform: uppercase;
    width: 100%;
}
.addons-status-on { background: #dcfce7; color: #166534; }
.addons-status-off { background: #f1f5f9; color: #64748b; }
.addons-status-warn { background: #fef3c7; color: #92400e; }
:is(.dark) .addons-status-on { background: rgba(22,163,74,0.2); color: #86efac; }
:is(.dark) .addons-status-off { background: rgba(100,116,139,0.2); color: #cbd5e1; }
:is(.dark) .addons-status-warn { background: rgba(146,64,14,0.25); color: #fcd34d; }

/* Price pill — sağ üst köşeye sabit, başlık ile çakışmaz */
.addons-price-pill {
    display: inline-block;
    padding: 3px 10px;
    background: #eff6ff;
    color: #1e40af;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}
:is(.dark) .addons-price-pill { background: rgba(37,99,235,0.25); color: #93c5fd; }
.addons-price-pill-corner {
    position: absolute;
    top: 12px;
    right: 14px;
    z-index: 1;
}
/* Kart başlığı price pill alanı için sağdan padding bırakır — sığsın */
.addons-card-title { padding-right: 80px; }

/* Trial / cancel_scheduled durum şeridi */
.addons-state-banner {
    display: inline-flex; align-items: center; gap: 6px;
    margin-top: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px; font-weight: 600;
    line-height: 1.4;
}
.addons-state-banner-info { background: #fef3c7; color: #92400e; }
.addons-state-banner-danger { background: #fee2e2; color: #991b1b; }
:is(.dark) .addons-state-banner-info { background: rgba(146,64,14,0.25); color: #fcd34d; }
:is(.dark) .addons-state-banner-danger { background: rgba(127,29,29,0.3); color: #fca5a5; }
.addons-state-icon { width: 14px; height: 14px; flex-shrink: 0; }

/* Reactivate butonu için yeşil — danger butonun yerine */
.addons-btn-success { background: #16a34a; color: #fff; border: 0; }
.addons-btn-success:hover { background: #15803d; }
:is(.dark) .addons-btn-success { background: #16a34a; }

/* Subscribe modal içinde fiyat/trial info */
.addons-modal-icon { width: 48px; height: 48px; }
.addons-modal-info {
    background: #f9fafb;
    border-radius: 10px;
    padding: 14px 18px;
    margin: 16px 0;
    text-align: left;
}
:is(.dark) .addons-modal-info { background: rgb(31,41,55); }
.addons-modal-row {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 14px; color: #374151;
    padding: 4px 0;
}
:is(.dark) .addons-modal-row { color: #d1d5db; }
.addons-modal-row strong { color: #111827; font-weight: 700; }
:is(.dark) .addons-modal-row strong { color: #f3f4f6; }
.addons-modal-row-trial strong { color: #16a34a; }

/* Parent sub trialing uyarısı — addons subscribe modal */
.addons-modal-warn {
    background: #fef3c7;
    border: 1px solid #fde68a;
    color: #92400e;
    border-radius: 8px;
    padding: 10px 14px;
    margin: 10px 0 20px;
    font-size: 13px;
    line-height: 1.45;
}

:is(.dark) .addons-modal-warn { background: rgba(120,53,15,0.25); border-color: rgba(180,83,9,0.5); color: #fcd34d; }

/* Plan değişim preview'ında "yıllığa çevrilecek eklentiler" listesi */
.ms-offer-addons {
    margin-top: 14px;
    padding: 12px 14px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
}
:is(.dark) .ms-offer-addons { background: rgba(30,58,138,0.20); border-color: rgba(59,130,246,0.4); }
.ms-offer-addons-title {
    font-size: 13px; font-weight: 600; color: #1e40af; margin-bottom: 8px;
}
:is(.dark) .ms-offer-addons-title { color: #93c5fd; }
.ms-offer-addons-row {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 6px 0; font-size: 13px;
    border-top: 1px solid rgba(191,219,254,0.6);
}
:is(.dark) .ms-offer-addons-row { border-top-color: rgba(59,130,246,0.25); }
.ms-offer-addons-row:first-of-type { border-top: 0; }
.ms-offer-addons-name { color: #1e3a8a; font-weight: 500; }
:is(.dark) .ms-offer-addons-name { color: #dbeafe; }
.ms-offer-addons-prices { display: flex; align-items: center; gap: 6px; }
.ms-offer-addons-old { color: #9ca3af; text-decoration: line-through; font-size: 12px; }
.ms-offer-addons-arrow { color: #9ca3af; font-size: 13px; }
.ms-offer-addons-new { color: #16a34a; font-weight: 700; }
.ms-offer-addons-hint {
    margin-top: 8px; font-size: 12px; color: #1e40af; opacity: 0.85;
}
:is(.dark) .ms-offer-addons-hint { color: #bfdbfe; }

/* wh-modal-btn spinner — Filament panel'de wh-modal pattern'i kullanan butonlarda */
.wh-modal-btn-spinner { width: 16px; height: 16px; animation: branch-spin 0.9s linear infinite; flex-shrink: 0; }

.addons-dot {
    width: 8px; height: 8px; border-radius: 50%;
    flex-shrink: 0; display: inline-block;
}
.addons-dot-on {
    background: #16a34a;
    box-shadow: 0 0 0 3px rgba(22,163,74,0.18);
    animation: addons-pulse 2s ease-in-out infinite;
}
.addons-dot-off {
    background: #94a3b8;
    box-shadow: 0 0 0 3px rgba(148,163,184,0.15);
}
@keyframes addons-pulse {
    0%, 100% { box-shadow: 0 0 0 3px rgba(22,163,74,0.18); }
    50%      { box-shadow: 0 0 0 5px rgba(22,163,74,0.08); }
}

.addons-btn {
    padding: 8px 16px; border-radius: 8px; font-size: 12px; font-weight: 700;
    cursor: pointer; border: none; transition: all 0.15s;
    letter-spacing: 0.1px;
    width: 100%; text-align: center;
}
.addons-btn:hover { transform: translateY(-1px); }
.addons-btn:disabled { opacity: 0.5; cursor: wait; }
.addons-btn-primary {
    background: #2563eb; color: #fff;
    box-shadow: 0 1px 2px rgba(37,99,235,0.2);
}
.addons-btn-primary:hover { background: #1d4ed8; box-shadow: 0 3px 8px rgba(37,99,235,0.3); }
.addons-btn-danger { background: #fee2e2; color: #991b1b; }
.addons-btn-danger:hover { background: #fecaca; }
:is(.dark) .addons-btn-danger { background: rgba(220,38,38,0.15); color: #fca5a5; }
:is(.dark) .addons-btn-danger:hover { background: rgba(220,38,38,0.25); }

/* ════════════════════════════════════════════════════════════
   Pazaryeri (Marketplaces) Settings Page
   ════════════════════════════════════════════════════════════ */
.mp-wrap { display: flex; flex-direction: column; gap: 20px; }

.mp-empty {
    background: #fff; border: 1px dashed #e5e7eb; border-radius: 12px;
    padding: 48px 24px; text-align: center;
    display: flex; flex-direction: column; align-items: center; gap: 12px;
}
:is(.dark) .mp-empty { background: rgb(31,41,55); border-color: rgb(55,65,81); }
.mp-empty-icon { width: 48px; height: 48px; color: #9ca3af; }
.mp-empty-text { font-size: 14px; color: #64748b; margin: 0; }
:is(.dark) .mp-empty-text { color: #94a3b8; }

.mp-tabs {
    display: flex; flex-wrap: wrap; gap: 8px;
    padding: 8px; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 12px;
}
:is(.dark) .mp-tabs { background: rgb(17,24,39); border-color: rgb(55,65,81); }
.mp-tab {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 14px; border-radius: 8px; cursor: pointer;
    font-size: 13px; font-weight: 600; color: #475569; background: transparent; border: none;
    transition: all 0.15s;
}
.mp-tab:hover { background: #fff; color: #0f172a; }
:is(.dark) .mp-tab { color: #cbd5e1; }
:is(.dark) .mp-tab:hover { background: rgb(31,41,55); color: #f3f4f6; }
.mp-tab-active { background: #fff; color: #2563eb; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
:is(.dark) .mp-tab-active { background: rgb(31,41,55); color: #93c5fd; }
.mp-tab-logo { width: 22px; height: 22px; object-fit: contain; }

.mp-form {
    background: #fff; border: 1px solid #e5e7eb; border-radius: 12px;
    padding: 24px;
}
:is(.dark) .mp-form { background: rgb(31,41,55); border-color: rgb(55,65,81); }
.mp-form-header {
    display: flex; align-items: center; gap: 16px;
    padding-bottom: 16px; margin-bottom: 20px;
    border-bottom: 1px solid #e5e7eb;
}
:is(.dark) .mp-form-header { border-color: rgb(55,65,81); }
.mp-form-logo { width: 48px; height: 48px; object-fit: contain; }
.mp-form-title { font-size: 17px; font-weight: 700; color: #0f172a; margin: 0; }
:is(.dark) .mp-form-title { color: #f3f4f6; }
.mp-form-desc { font-size: 12px; color: #64748b; margin: 4px 0 0; }
:is(.dark) .mp-form-desc { color: #94a3b8; }

.mp-form-fields {
    display: grid; grid-template-columns: 1fr; gap: 14px;
}
@media (min-width: 768px) { .mp-form-fields { grid-template-columns: 1fr 1fr; } }

.mp-field { display: flex; flex-direction: column; gap: 6px; }
.mp-label { font-size: 12px; font-weight: 600; color: #374151; }
:is(.dark) .mp-label { color: #d1d5db; }
.mp-required { color: #dc2626; margin-left: 2px; }
.mp-input {
    width: 100%; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 8px;
    font-size: 13px; background: #fff; color: #0f172a;
    font-family: inherit;
}
.mp-input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,0.1); }
:is(.dark) .mp-input { background: rgb(17,24,39); border-color: rgb(55,65,81); color: #f3f4f6; }

.mp-toggle-row {
    display: flex; align-items: center; gap: 8px; cursor: pointer;
    padding: 10px 12px; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px;
}
:is(.dark) .mp-toggle-row { background: rgb(17,24,39); border-color: rgb(55,65,81); }
.mp-toggle-input { width: 18px; height: 18px; accent-color: #2563eb; cursor: pointer; }
.mp-toggle-label { font-size: 13px; font-weight: 600; color: #374151; }
:is(.dark) .mp-toggle-label { color: #d1d5db; }

.mp-form-actions {
    margin-top: 20px; padding-top: 16px; border-top: 1px solid #e5e7eb;
    display: flex; justify-content: flex-end; gap: 8px;
}
:is(.dark) .mp-form-actions { border-color: rgb(55,65,81); }
.mp-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 600;
    cursor: pointer; border: none; transition: all 0.15s; text-decoration: none;
}
.mp-btn:disabled { opacity: 0.5; cursor: wait; }
.mp-btn-primary { background: #2563eb; color: #fff; }
.mp-btn-primary:hover { background: #1d4ed8; }
.mp-btn-secondary { background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; }
.mp-btn-secondary:hover { background: #e5e7eb; }
.mp-btn-icon { width: 16px; height: 16px; }

/* Bağlantı Testi Modal */
.mp-test-modal-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    display: flex; align-items: center; justify-content: center;
    z-index: 10000;
    padding: 20px;
}
.mp-test-modal {
    background: #fff; border-radius: 14px;
    width: 100%; max-width: 480px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    overflow: hidden;
    animation: mp-modal-pop 0.18s ease-out;
}
@keyframes mp-modal-pop {
    from { opacity: 0; transform: scale(0.96) translateY(10px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}
.mp-test-modal-header {
    display: flex; align-items: center; gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid #eef0f3;
    position: relative;
}
.mp-test-modal-header h3 { margin: 0; font-size: 15px; font-weight: 600; color: #111827; flex: 1; }
.mp-test-modal-icon { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.mp-test-modal-icon svg { width: 22px; height: 22px; }
.mp-test-modal-success .mp-test-modal-icon { background: #ecfdf5; color: #16a34a; }
.mp-test-modal-danger  .mp-test-modal-icon { background: #fef2f2; color: #dc2626; }
.mp-test-modal-warning .mp-test-modal-icon { background: #fffbeb; color: #d97706; }
.mp-test-modal-info    .mp-test-modal-icon { background: #eff6ff; color: #2563eb; }
.mp-test-modal-close {
    background: transparent; border: none;
    width: 32px; height: 32px;
    font-size: 24px; line-height: 1; color: #6b7280;
    cursor: pointer; border-radius: 8px;
}
.mp-test-modal-close:hover { background: #f3f4f6; color: #111827; }

.mp-test-modal-body { padding: 16px 18px; font-size: 14px; color: #374151; line-height: 1.5; }
.mp-test-modal-body p { margin: 0 0 10px; }
.mp-test-modal-body p:last-child { margin-bottom: 0; }

.mp-test-modal-details {
    margin: 12px 0 0;
    display: grid; grid-template-columns: 1fr;
    gap: 8px;
    background: #f9fafb; border: 1px solid #eef0f3; border-radius: 10px;
    padding: 12px 14px;
}
.mp-test-modal-details > div {
    display: flex; justify-content: space-between;
    font-size: 13px;
}
.mp-test-modal-details dt { color: #6b7280; font-weight: 500; margin: 0; }
.mp-test-modal-details dd { color: #111827; font-weight: 600; margin: 0; }

.mp-test-modal-footer {
    padding: 12px 18px;
    border-top: 1px solid #eef0f3;
    display: flex; justify-content: flex-end;
}
.mp-btn-spinner { width: 16px; height: 16px; animation: mp-spin 1s linear infinite; }
@keyframes mp-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.mp-btn[disabled] { opacity: 0.6; cursor: not-allowed; }

/* Şube seçici (Marketplaces sayfası) */
.mp-branch-selector {
    display: flex; align-items: center; gap: 12px;
    padding: 12px 16px; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 12px;
}
:is(.dark) .mp-branch-selector { background: rgb(17,24,39); border-color: rgb(55,65,81); }
.mp-branch-label {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; font-weight: 600; color: #374151; flex-shrink: 0;
}
:is(.dark) .mp-branch-label { color: #d1d5db; }
.mp-branch-icon { width: 18px; height: 18px; color: #6b7280; }
.mp-branch-select {
    flex: 1; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 8px;
    font-size: 13px; background: #fff; color: #0f172a; max-width: 320px;
}
.mp-branch-select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,0.1); }
:is(.dark) .mp-branch-select { background: rgb(31,41,55); border-color: rgb(55,65,81); color: #f3f4f6; }

/* Tax settings - branch switching loading state */
.tax-loading-fade { opacity: 0.4; pointer-events: none; transition: opacity 0.15s; }

/* Payment Options - per-channel sections */
.po-method-list { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 768px) { .po-method-list { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1280px) { .po-method-list { grid-template-columns: 1fr 1fr 1fr; } }

.po-method-row {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 12px 14px; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
    cursor: pointer; transition: border-color 0.15s, background 0.15s;
}
.po-method-row:hover { border-color: #cbd5e1; }
:is(.dark) .po-method-row { background: rgb(31,41,55); border-color: rgb(55,65,81); }
.po-method-row-active { border-color: #16a34a; background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 50%); }
:is(.dark) .po-method-row-active { background: linear-gradient(135deg, rgba(22,163,74,0.1) 0%, rgb(31,41,55) 50%); border-color: #16a34a; }
.po-method-name { font-size: 14px; font-weight: 600; color: #0f172a; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(.dark) .po-method-name { color: #f3f4f6; }

.po-empty { text-align: center; padding: 28px; color: #9ca3af; }
.po-empty-icon { width: 36px; height: 36px; margin: 0 auto 10px; color: #d1d5db; display: block; }
.po-empty p { font-weight: 600; font-size: 13px; margin: 0; }

/* Analog Clock — Mercedes-style (light + dark themes) */
.ac-wrap {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px;
    margin-right: 10px;
    border-radius: 50%;
    transition: transform 0.2s;
    cursor: default;
}
.ac-wrap:hover { transform: scale(1.1); }
.ac-svg { width: 100%; height: 100%; display: block; border-radius: 50%; }

@media (max-width: 799px) { .ac-wrap { display: none; } }

/* Light tema — gümüş çerçeve, açık yüzey */
.ac-bezel { fill: #d1d5db; stroke: #9ca3af; stroke-width: 0.6; }
.ac-face  { fill: #f9fafb; stroke: #e5e7eb; stroke-width: 0.4; }
.ac-tick-main { stroke: #1f2937; }
.ac-tick-sub  { stroke: #9ca3af; }
.ac-hand   { stroke: #111827; }
.ac-second { stroke: #dc2626; }
.ac-center { fill: #111827; stroke: #dc2626; stroke-width: 1; }
.ac-center-dot { fill: #dc2626; }

/* Dark tema — koyu çerçeve, lacivert tabak */
:is(.dark) .ac-bezel { fill: #4b5563; stroke: #1f2937; }
:is(.dark) .ac-face  { fill: #0b0f17; stroke: #1f2937; }
:is(.dark) .ac-tick-main { stroke: #f3f4f6; }
:is(.dark) .ac-tick-sub  { stroke: #9ca3af; }
:is(.dark) .ac-hand   { stroke: #f3f4f6; }
:is(.dark) .ac-second { stroke: #ef4444; }
:is(.dark) .ac-center { fill: #1f2937; stroke: #ef4444; }
:is(.dark) .ac-center-dot { fill: #ef4444; }




/* Sidebar User Footer (sabit alt) */
.sb-user-footer {
    display: flex; align-items: center; justify-content: space-between;
    gap: 8px; padding: 0.75rem 1rem;
    border-top: 1px solid rgba(0,0,0,0.06);
    background: #ffffff;
}
:is(.dark) .sb-user-footer { background: rgb(17,24,39); border-top-color: rgba(255,255,255,0.06); }

.sb-user-info { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; }
.sb-user-avatar {
    flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%;
    background: linear-gradient(135deg, #1e293b, #0f172a);
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700;
}
.sb-user-meta { display: flex; flex-direction: column; min-width: 0; }
.sb-user-name { font-size: 13px; font-weight: 600; color: #0f172a; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(.dark) .sb-user-name { color: #f3f4f6; }
.sb-user-email { font-size: 11px; color: #64748b; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(.dark) .sb-user-email { color: #94a3b8; }

.sb-user-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.sb-action-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 8px;
    background: transparent; border: none; cursor: pointer;
    color: #64748b; transition: background 0.12s, color 0.12s;
}
.sb-action-btn:hover { background: rgba(0,0,0,0.06); color: #0f172a; }
:is(.dark) .sb-action-btn { color: #cbd5e1; }
:is(.dark) .sb-action-btn:hover { background: rgba(255,255,255,0.08); color: #fff; }
.sb-action-btn-danger:hover { background: #fee2e2; color: #dc2626; }
:is(.dark) .sb-action-btn-danger:hover { background: rgba(220,38,38,0.2); color: #fca5a5; }
.sb-action-icon { width: 16px; height: 16px; }

/* Sidebar collapsed (desktop icon-only) — sadece avatar göster */
@media (min-width: 1024px) {
    .fi-body-has-sidebar-collapsible-on-desktop .fi-sidebar:not(.fi-sidebar-open) .sb-user-meta,
    .fi-body-has-sidebar-collapsible-on-desktop .fi-sidebar:not(.fi-sidebar-open) .sb-user-actions {
        display: none !important;
    }
    .fi-body-has-sidebar-collapsible-on-desktop .fi-sidebar:not(.fi-sidebar-open) .sb-user-footer {
        justify-content: center;
        padding: 0.75rem 0.25rem;
    }
    .fi-body-has-sidebar-collapsible-on-desktop .fi-sidebar:not(.fi-sidebar-open) .sb-user-info {
        flex: 0 0 auto;
    }
}

/* Sidebar bg beyaz (light), sayfadan ayırmak için ince ayrım */
@media (min-width: 1024px) {
    .fi-sidebar { background: #ffffff !important; border-right: 1px solid rgba(0,0,0,0.06); }
    :is(.dark) .fi-sidebar { background: rgb(17,24,39) !important; border-right-color: rgba(255,255,255,0.06); }
}

/* Logout confirm modal */
.sb-logout-overlay {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(15,23,42,0.55); backdrop-filter: blur(3px);
    display: flex; align-items: center; justify-content: center;
}
.sb-logout-modal {
    background: #fff; border-radius: 16px; padding: 28px 24px;
    max-width: 380px; width: calc(100% - 32px);
    text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}
:is(.dark) .sb-logout-modal { background: rgb(31,41,55); }
.sb-logout-icon {
    display: flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; margin: 0 auto 14px;
    background: #fee2e2; border-radius: 50%;
}
:is(.dark) .sb-logout-icon { background: rgba(220,38,38,0.2); }
.sb-logout-title { font-size: 16px; font-weight: 700; color: #0f172a; margin: 0 0 6px; }
:is(.dark) .sb-logout-title { color: #f3f4f6; }
.sb-logout-desc { font-size: 13px; color: #64748b; margin: 0 0 20px; line-height: 1.5; }
:is(.dark) .sb-logout-desc { color: #94a3b8; }
.sb-logout-actions { display: flex; gap: 8px; justify-content: center; }
.sb-logout-btn {
    padding: 9px 18px; border-radius: 8px; font-size: 13px; font-weight: 600;
    cursor: pointer; border: none; transition: all 0.15s; min-width: 110px;
}
.sb-logout-btn-cancel { background: #f1f5f9; color: #475569; }
.sb-logout-btn-cancel:hover { background: #e2e8f0; }
:is(.dark) .sb-logout-btn-cancel { background: rgb(55,65,81); color: #e5e7eb; }
:is(.dark) .sb-logout-btn-cancel:hover { background: rgb(75,85,99); }
.sb-logout-btn-confirm { background: #dc2626; color: #fff; }
.sb-logout-btn-confirm:hover { background: #b91c1c; }

/* Product image lightbox */
.pi-lightbox {
    position: fixed; inset: 0; z-index: 99999;
    background: rgba(0,0,0,0.85); backdrop-filter: blur(4px);
    display: none; align-items: center; justify-content: center;
    flex-direction: column; gap: 16px; padding: 32px;
}
.pi-lightbox.pi-lightbox-open { display: flex; }
.pi-lightbox-img {
    max-width: 90vw; max-height: 80vh;
    border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,0.5);
    object-fit: contain; background: #1f2937;
}
.pi-lightbox-caption { color: #f3f4f6; font-size: 14px; font-weight: 600; text-align: center; }
.pi-lightbox-close {
    position: absolute; top: 24px; right: 32px;
    width: 40px; height: 40px; border-radius: 50%;
    background: rgba(255,255,255,0.1); color: #fff;
    border: none; font-size: 28px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s;
}
.pi-lightbox-close:hover { background: rgba(255,255,255,0.2); }
img.product-thumb-clickable { cursor: pointer; transition: opacity 0.15s; }
img.product-thumb-clickable:hover { opacity: 0.75; }


/* === MySubscription Page === */
.ms-card { background:#fff; border-radius:12px; box-shadow:0 1px 3px rgba(0,0,0,0.05); border:1px solid #e5e7eb; }
.dark .ms-card { background:#1f2937; border-color:#374151; }
.ms-tabs { display:flex; gap:4px; border-bottom:1px solid #e5e7eb; padding:0 16px; overflow-x:auto; }
.dark .ms-tabs { border-color:#374151; }
.ms-tab { display:flex; align-items:center; gap:8px; padding:14px 18px; font-size:14px; font-weight:500; color:#6b7280; border-bottom:2px solid transparent; cursor:pointer; background:none; border-top:0; border-left:0; border-right:0; transition:all 0.15s; white-space:nowrap; }
.ms-tab:hover { color:#111827; }
.dark .ms-tab { color:#9ca3af; }
.dark .ms-tab:hover { color:#f9fafb; }
.ms-tab.active { color:#10b981; border-bottom-color:#10b981; }
.ms-tab svg { width:16px; height:16px; }
.ms-body { padding:24px; }
.ms-grid-3 { display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-bottom:24px; }
@media (max-width:768px) { .ms-grid-3 { grid-template-columns:1fr; } }
.ms-stat { padding:16px; border:1px solid #e5e7eb; border-radius:10px; }
.dark .ms-stat { border-color:#374151; background:#111827; }
.ms-stat-label { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:6px; }
.ms-stat-value { font-size:18px; font-weight:600; color:#111827; }
.dark .ms-stat-value { color:#f9fafb; }
.ms-stat-sub { font-size:12px; color:#6b7280; margin-top:2px; }
.ms-badge { display:inline-block; padding:3px 10px; border-radius:12px; font-size:12px; font-weight:500; }
.ms-badge-success { background:#d1fae5; color:#065f46; }
.ms-badge-warning { background:#fef3c7; color:#92400e; }
.ms-badge-trial { background:#dbeafe; color:#1e40af; }
.dark .ms-badge-trial { background:rgba(37,99,235,0.25); color:#93c5fd; }
.ms-badge-danger { background:#fee2e2; color:#991b1b; }
.ms-badge-gray { background:#f3f4f6; color:#374151; }
.ms-badge-info { background:#dbeafe; color:#1e40af; }
.ms-section { padding:18px; border:1px solid #e5e7eb; border-radius:10px; margin-bottom:16px; }
.dark .ms-section { border-color:#374151; }
.ms-section-header { display:flex; align-items:center; justify-content:space-between; }
.ms-section-title { font-size:14px; font-weight:600; color:#111827; }
.dark .ms-section-title { color:#f9fafb; }
.ms-section-desc { font-size:12px; color:#6b7280; margin-top:4px; }
.ms-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:8px; font-size:13px; font-weight:500; cursor:pointer; text-decoration:none; border:0; transition:all 0.15s; }
.ms-btn-primary { background:#10b981; color:#fff; }
.ms-btn-primary:hover { background:#059669; }
.ms-btn-outline { background:transparent; border:1px solid #d1d5db; color:#374151; }
.ms-btn-outline:hover { background:#f9fafb; }
.dark .ms-btn-outline { border-color:#4b5563; color:#d1d5db; }
.dark .ms-btn-outline:hover { background:#1f2937; }
.ms-btn-danger-outline { background:transparent; border:1px solid #fecaca; color:#dc2626; }
.ms-btn-danger-outline:hover { background:#fef2f2; }
.ms-btn:disabled { opacity:0.5; cursor:not-allowed; }
.ms-toggle { position:relative; width:44px; height:24px; border-radius:9999px; cursor:pointer; transition:background 0.15s; border:0; }
.ms-toggle.on { background:#10b981; }
.ms-toggle.off { background:#d1d5db; }
.ms-toggle::after { content:''; position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform 0.15s; }
.ms-toggle.on::after { transform:translateX(20px); }
.ms-offer { background:linear-gradient(135deg, #fef3c7, #fde68a); border:1px solid #fbbf24; border-radius:10px; padding:16px; margin-top:16px; }
.ms-usage { background:linear-gradient(135deg,#dbeafe,#e0e7ff); border-radius:10px; padding:18px; margin-bottom:24px; }
.dark .ms-usage { background:linear-gradient(135deg,rgba(30,58,138,0.2),rgba(55,48,163,0.2)); }
.ms-card-item { display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid #e5e7eb; border-radius:10px; margin-bottom:10px; }
.ms-card-item.default { border-color:#10b981; background:#f0fdf4; }
.dark .ms-card-item { border-color:#374151; }
.dark .ms-card-item.default { background:rgba(6,78,59,0.2); }
.ms-card-brand { width:48px; height:32px; border-radius:5px; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; color:#fff; background:#374151; text-transform:uppercase; }
.ms-card-brand.visa { background:#1a1f71; }
.ms-card-brand.mastercard { background:#eb001b; }
.ms-card-brand.amex { background:#2e77bb; }
.ms-table { width:100%; border-collapse:collapse; font-size:13px; }
.ms-table thead th { text-align:left; padding:10px 12px; font-size:11px; text-transform:uppercase; color:#6b7280; font-weight:600; letter-spacing:0.5px; border-bottom:1px solid #e5e7eb; }
.dark .ms-table thead th { color:#9ca3af; border-color:#374151; }
.ms-table tbody td { padding:12px; border-bottom:1px solid #f3f4f6; color:#374151; }
.dark .ms-table tbody td { color:#d1d5db; border-color:#1f2937; }
.ms-table tbody tr:hover { background:#f9fafb; }
.dark .ms-table tbody tr:hover { background:#1f2937; }
.ms-empty { text-align:center; padding:48px 20px; color:#9ca3af; }
.ms-empty svg { width:48px; height:48px; margin:0 auto 12px; opacity:0.4; }
.ms-bordered-list { margin-top:8px; }
.ms-page-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; justify-content:flex-end; }

/* MySubscription multi-sub */
.ms-overview-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:20px; gap:16px; flex-wrap:wrap; }
.ms-overview-header-right { justify-content:flex-end; }
.ms-add-sub-icon { width:16px; height:16px; }
.ms-portal-icon { width:16px; height:16px; }

/* Page-level loading overlay (Stripe işlemleri çift tıklama engeli) */
.ms-page-loading {
    position:fixed !important;
    top:0; left:0; right:0; bottom:0;
    z-index:99999;
    background:rgba(15,23,42,0.35);
    backdrop-filter:blur(1px);
    display:flex !important;
    align-items:center;
    justify-content:center;
    pointer-events:auto;
}
.ms-page-loading-spinner {
    width:56px !important; height:56px !important;
    color:#16a34a;
}
/* ms-toggle disabled görünümü (auto-renew sırasında) */
.ms-toggle:disabled { opacity:0.5; cursor:not-allowed; }
.ms-totals { flex:1; min-width:240px; }
.ms-totals-label { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:4px; }
.ms-totals-value { display:flex; gap:14px; flex-wrap:wrap; font-size:28px; font-weight:700; color:#111827; line-height:1.1; }
.dark .ms-totals-value { color:#f9fafb; }
.ms-totals-amount { display:inline-block; }
.ms-totals-sub { font-size:12px; color:#9ca3af; margin-top:6px; }
.ms-soon-pill { display:inline-block; padding:2px 8px; background:#fef3c7; color:#92400e; border-radius:10px; font-size:10px; margin-left:6px; }
.ms-usage-title { font-size:13px; font-weight:500; color:#374151; margin-bottom:12px; }
.ms-usage-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ms-usage-num { font-size:24px; font-weight:700; color:#1e40af; }
.dark .ms-usage-num { color:#93c5fd; }
.ms-usage-lbl { font-size:11px; color:#4b5563; }
.dark .ms-usage-lbl { color:#9ca3af; }

.ms-sub-list { display:flex; flex-direction:column; gap:10px; margin-bottom:24px; }

/* Abonelik filtre dropdown'u — liste üstünde sağa yaslı, minimal */
.ms-sub-filter-bar { display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-bottom:12px; }
.ms-sub-filter-lbl { font-size:12px; color:#6b7280; font-weight:500; }
.dark .ms-sub-filter-lbl { color:#9ca3af; }
.ms-sub-filter-select { font-size:13px; padding:6px 28px 6px 10px; border:1px solid #d1d5db; border-radius:8px; background:#fff; color:#374151; min-width:160px; cursor:pointer; appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20' stroke='%236b7280' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M6 8l4 4 4-4'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 8px center; background-size:14px; }
.ms-sub-filter-select:focus { outline:none; border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.15); }
.dark .ms-sub-filter-select { background-color:rgb(31,41,55); border-color:rgb(75,85,99); color:#e5e7eb; }
.ms-sub-filter-empty { padding:24px; text-align:center; color:#6b7280; background:#f9fafb; border:1px dashed #e5e7eb; border-radius:10px; margin-bottom:24px; font-size:13px; }
.dark .ms-sub-filter-empty { background:rgb(31,41,55); border-color:rgb(55,65,81); color:#9ca3af; }

/* Customer (Fatura Bilgileri) form — Filament input stiline uyumlu */
.ms-customer-form { width:100%; }
.ms-customer-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-bottom:24px; }
@media (max-width:640px) { .ms-customer-grid { grid-template-columns:1fr; } }
.ms-customer-field-full { grid-column:1 / -1; }
.ms-customer-field { display:flex; flex-direction:column; gap:6px; }
.ms-customer-label { font-size:13px; font-weight:500; color:#374151; }
.dark .ms-customer-label { color:#e5e7eb; }
.ms-customer-required { color:#dc2626; margin-left:2px; }
.ms-customer-input { width:100%; font-size:14px; padding:8px 12px; border:1px solid #d1d5db; border-radius:8px; background:#fff; color:#111827; transition:border-color .15s, box-shadow .15s; }
.ms-customer-input:focus { outline:none; border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.12); }
.ms-customer-input::placeholder { color:#9ca3af; }
.ms-customer-input-upper { text-transform:uppercase; }
.dark .ms-customer-input { background:rgb(31,41,55); border-color:rgb(75,85,99); color:#f3f4f6; }
.dark .ms-customer-input:focus { border-color:#60a5fa; box-shadow:0 0 0 3px rgba(96,165,250,.15); }
.ms-customer-hint { font-size:11px; color:#6b7280; margin:0; }
.dark .ms-customer-hint { color:#9ca3af; }
.ms-customer-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:16px; border-top:1px solid #e5e7eb; flex-wrap:wrap; }
.dark .ms-customer-actions { border-top-color:rgb(55,65,81); }
.ms-customer-info { display:flex; align-items:flex-start; gap:6px; font-size:12px; color:#6b7280; margin:0; flex:1; min-width:200px; }
.dark .ms-customer-info { color:#9ca3af; }

/* 4-tile stat grid (Reports stilinde) */
.ms-stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:24px; }
@media (max-width:900px) { .ms-stats-row { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px) { .ms-stats-row { grid-template-columns:1fr; } }
.ms-stat-card { display:flex; align-items:center; gap:14px; background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:18px 20px; }
.dark .ms-stat-card { background:rgb(31,41,55); border-color:rgb(55,65,81); }
.ms-stat-icon { width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ms-stat-svg { width:22px; height:22px; }
.ms-stat-icon-orders { background:#dbeafe; color:#3b82f6; }
.ms-stat-icon-branches { background:#d1fae5; color:#10b981; }
.ms-stat-icon-customers { background:#fef3c7; color:#f59e0b; }
.ms-stat-icon-duration { background:#ede9fe; color:#7c3aed; }
.ms-stat-value { font-size:22px; font-weight:800; color:#111827; line-height:1.2; }
.dark .ms-stat-value { color:#f3f4f6; }
.ms-stat-label { font-size:13px; color:#6b7280; font-weight:500; }
.dark .ms-stat-label { color:#9ca3af; }

/* Kompakt abonelik satırı */
.ms-sub-row {
    display:grid;
    grid-template-columns: minmax(160px, 1.4fr) auto minmax(120px, 1fr) auto;
    gap:16px;
    align-items:center;
    padding:14px 18px;
    border:1px solid #e5e7eb;
    border-radius:12px;
    background:#fff;
}
.ms-sub-row-status { display:flex; justify-content:center; }
.ms-sub-row-next { display:flex; flex-direction:column; align-items:center; text-align:center; }
.ms-sub-row-actions { justify-self:end; }
.ms-confirm-btn-spinner { width:16px; height:16px; animation:branch-spin 0.9s linear infinite; flex-shrink:0; }
.dark .ms-sub-row { border-color:#374151; background:#1f2937; }
@media (max-width:768px) {
    .ms-sub-row {
        grid-template-columns: 1fr auto;
        gap:10px;
    }
    .ms-sub-row-next, .ms-sub-row-renew, .ms-sub-row-status { grid-column: span 1; }
}
.ms-sub-row-title { font-size:15px; font-weight:600; color:#111827; }
.dark .ms-sub-row-title { color:#f9fafb; }
.ms-sub-row-price { font-size:13px; color:#6b7280; margin-top:2px; }
.ms-sub-row-interval { color:#9ca3af; }
.ms-sub-row-lbl { font-size:11px; color:#9ca3af; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:3px; }
.ms-sub-row-val { font-size:13px; font-weight:500; color:#374151; }
.dark .ms-sub-row-val { color:#d1d5db; }
.ms-sub-row-val-muted { color:#9ca3af; font-style:italic; }
.dark .ms-sub-row-val-muted { color:#6b7280; }
.ms-discount-badge {
    display:inline-flex;
    align-items:center;
    gap:4px;
    margin-top:4px;
    padding:2px 8px;
    background:#dcfce7;
    color:#15803d;
    border-radius:6px;
    font-size:11px;
    font-weight:700;
    line-height:1.4;
}
.dark .ms-discount-badge { background:rgba(22,101,52,0.25); color:#86efac; }
.ms-discount-badge-icon { width:12px; height:12px; }
.ms-sub-row-renew { display:flex; flex-direction:column; }

/* Row actions dropdown */
.ms-sub-row-actions { position:relative; display:inline-block; }
.ms-row-actions-btn {
    padding:6px;
    border:none;
    background:transparent;
    cursor:pointer;
    color:#6b7280;
    border-radius:6px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.ms-row-actions-btn:hover { background:#f3f4f6; color:#111827; }
.dark .ms-row-actions-btn:hover { background:#374151; color:#f3f4f6; }
.ms-row-actions-icon { width:20px; height:20px; }
.ms-row-actions-menu {
    position:absolute;
    right:0;
    top:100%;
    margin-top:4px;
    z-index:60;
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:10px;
    box-shadow:0 10px 30px rgba(0,0,0,0.12);
    min-width:200px;
    padding:6px 0;
}
.dark .ms-row-actions-menu { background:#1f2937; border-color:#374151; }
.ms-row-actions-item {
    display:flex;
    align-items:center;
    gap:10px;
    width:100%;
    padding:9px 14px;
    border:none;
    background:none;
    cursor:pointer;
    font-size:13px;
    color:#374151;
    text-align:left;
    text-decoration:none;
}
.dark .ms-row-actions-item { color:#d1d5db; }
.ms-row-actions-item:hover { background:#f9fafb; }
.dark .ms-row-actions-item:hover { background:#374151; }
.ms-row-actions-item-icon { width:16px; height:16px; color:#6b7280; }
.ms-row-actions-item-danger { color:#ef4444; }
.ms-row-actions-item-danger .ms-row-actions-item-icon { color:#ef4444; }
[x-cloak] { display:none !important; }

/* Addon list (sub row altında — bütünleşik görünüm) */
.ms-addon-list {
    margin-top: -10px;
    padding: 8px 18px 12px;
    background: #f9fafb;
    border-radius: 0 0 12px 12px;
    border: 1px solid #e5e7eb;
    border-top: 1px dashed #e5e7eb; /* ince ayırıcı */
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
/* Sub row addon listesi takip ediyorsa alt köşeleri düz */
.ms-sub-row:has(+ .ms-addon-list) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: 0;
}
.dark .ms-addon-list { background: rgba(15,23,42,0.4); border-color: #374151; }
.ms-addon-row {
    display: grid;
    grid-template-columns: 24px minmax(120px, 1.4fr) auto minmax(120px, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    padding: 6px 0;
    font-size: 13px;
    border-bottom: 1px dashed #e5e7eb;
}
.ms-addon-actions { justify-self: end; }
.dark .ms-addon-row { border-bottom-color: #374151; }
.ms-addon-row:last-child { border-bottom: 0; }
.ms-addon-icon {
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
    color: #6b7280;
}
.ms-addon-icon-svg { width: 16px; height: 16px; }
.ms-addon-name {
    font-weight: 500;
    color: #374151;
    min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dark .ms-addon-name { color: #d1d5db; }
.ms-addon-status-cell { display: flex; justify-content: center; }
.ms-addon-date-cell {
    font-size: 12px; color: #6b7280; text-align: center;
}
.dark .ms-addon-date-cell { color: #9ca3af; }
.ms-addon-date-lbl { color: #9ca3af; font-weight: 500; }
.dark .ms-addon-date-lbl { color: #6b7280; }
.ms-addon-status-active { background: #d1fae5; color: #065f46; }
.dark .ms-addon-status-active { background: rgba(22,163,74,0.25); color: #86efac; }
.ms-addon-status-pill {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.ms-addon-status-trial { background: #fef3c7; color: #92400e; }
.ms-addon-status-ending { background: #fee2e2; color: #991b1b; }
.dark .ms-addon-status-trial { background: rgba(146,64,14,0.3); color: #fcd34d; }
.dark .ms-addon-status-ending { background: rgba(127,29,29,0.3); color: #fca5a5; }
.ms-addon-price {
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
    text-align: right;
}
.dark .ms-addon-price { color: #f3f4f6; }

/* Subscription row banner (pending change / cancel scheduled) */
.ms-sub-banner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 16px;
    border-radius:10px;
    margin-top:-2px;
    margin-bottom:0;
    font-size:13px;
    flex-wrap:wrap;
}
.ms-sub-banner-info {
    background:#fef3c7;
    color:#78350f;
    border:1px solid #fcd34d;
}
.dark .ms-sub-banner-info { background:rgba(120,53,15,0.15); color:#fbbf24; border-color:rgba(251,191,36,0.3); }
.ms-sub-banner-danger {
    background:#fee2e2;
    color:#991b1b;
    border:1px solid #fca5a5;
}
.dark .ms-sub-banner-danger { background:rgba(127,29,29,0.2); color:#fca5a5; border-color:rgba(252,165,165,0.3); }
.ms-sub-banner-content { display:flex; align-items:center; gap:8px; }
.ms-sub-banner-icon { width:18px; height:18px; flex-shrink:0; }
.ms-sub-banner-action {
    padding:6px 14px;
    border-radius:6px;
    border:1px solid currentColor;
    background:transparent;
    color:inherit;
    font-size:12px;
    font-weight:600;
    cursor:pointer;
    white-space:nowrap;
}
.ms-sub-banner-action:hover { background:rgba(0,0,0,0.05); }
.dark .ms-sub-banner-action:hover { background:rgba(255,255,255,0.05); }
.ms-sub-banner-action:disabled { opacity:0.6; cursor:not-allowed; }
.ms-sub-banner-action-success { background:#16a34a; color:#fff; border-color:#16a34a; }
.ms-sub-banner-action-success:hover { background:#15803d; border-color:#15803d; }

/* Confirm modal (reactivate vb.) */
.ms-confirm-overlay {
    position:fixed; inset:0; z-index:9999;
    background:rgba(0,0,0,0.5);
    display:flex; align-items:center; justify-content:center;
    padding:16px;
}
.ms-confirm-modal {
    background:#fff;
    border-radius:16px;
    padding:32px;
    max-width:420px; width:100%;
    text-align:center;
    box-shadow:0 20px 60px rgba(0,0,0,0.2);
    position:relative;
}
.dark .ms-confirm-modal { background:#1f2937; }
.ms-confirm-icon { margin-bottom:16px; display:flex; justify-content:center; }
.ms-confirm-icon-svg { width:52px; height:52px; color:#16a34a; }
.ms-confirm-title { font-size:18px; font-weight:700; color:#111827; margin:0 0 8px; }
.dark .ms-confirm-title { color:#f3f4f6; }
.ms-confirm-desc { font-size:14px; color:#6b7280; margin:0 0 24px; line-height:1.5; }
.dark .ms-confirm-desc { color:#9ca3af; }
.ms-confirm-actions { display:flex; gap:10px; justify-content:center; }
.ms-confirm-btn {
    padding:10px 24px;
    border-radius:10px;
    font-size:14px; font-weight:600;
    cursor:pointer; border:0;
    transition:background 0.15s;
}
.ms-confirm-btn:disabled { opacity:0.6; cursor:not-allowed; }
.ms-confirm-btn-spinner {
    width:16px; height:16px;
    margin-right:6px;
    vertical-align:middle;
    animation:branch-spin 0.9s linear infinite;
    display:inline-block;
}
.ms-confirm-btn-cancel { background:#f3f4f6; color:#374151; }
.ms-confirm-btn-cancel:hover { background:#e5e7eb; }
.dark .ms-confirm-btn-cancel { background:#374151; color:#d1d5db; }
.ms-confirm-btn-confirm { background:#16a34a; color:#fff; }
.ms-confirm-btn-confirm:hover { background:#15803d; }
.ms-confirm-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; }

.ms-offer-title { font-size:13px; font-weight:600; color:#92400e; margin-bottom:8px; }
.ms-offer-line { display:flex; justify-content:space-between; font-size:12px; color:#78350f; padding:4px 0; }
.ms-offer-total { display:flex; justify-content:space-between; font-weight:700; font-size:15px; padding-top:10px; margin-top:10px; border-top:2px solid #fcd34d; color:#78350f; }
.ms-offer-actions { display:flex; gap:8px; margin-top:14px; justify-content:flex-end; }
.ms-offer-hint { font-size:12px; color:#78350f; margin-top:10px; line-height:1.5; }

/* Branch payment step */
.branch-plan-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:8px; }
@media (max-width:480px) { .branch-plan-grid { grid-template-columns:1fr; } }
.branch-plan-card { border:2px solid #e5e7eb; border-radius:10px; padding:14px; cursor:pointer; transition:border-color 0.15s,background 0.15s; background:#fff; position:relative; }
.dark .branch-plan-card { background:#1f2937; border-color:#374151; }
.branch-plan-card:hover { border-color:#10b981; }
.branch-plan-card.selected { border-color:#10b981; background:#f0fdf4; }
.dark .branch-plan-card.selected { background:rgba(6,78,59,0.2); }
.branch-plan-name { font-size:13px; font-weight:600; color:#374151; }
.dark .branch-plan-name { color:#d1d5db; }
.branch-plan-amount { font-size:22px; font-weight:800; color:#111827; margin:6px 0 2px; }
.dark .branch-plan-amount { color:#f9fafb; }
.branch-plan-interval { font-size:11px; color:#6b7280; }
.branch-plan-savings { display:inline-block; margin-top:8px; padding:2px 8px; background:#fef3c7; color:#92400e; border-radius:4px; font-size:10px; font-weight:600; }
.new-card-divider { text-align:center; margin:14px 0 10px; color:#9ca3af; font-size:12px; }

/* Branch payment-step page */
.bp-wrap { width:100%; }
.bp-header { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.bp-back-btn { padding:6px 10px; }
.bp-back-btn svg { width:14px; height:14px; }
.bp-title { font-size:18px; font-weight:600; margin:0; color:#111827; }
.dark .bp-title { color:#f9fafb; }
.bp-sub { font-size:13px; color:#6b7280; margin:4px 0 0; }
.bp-alert { margin-bottom:16px; }
.bp-section-title { font-size:14px; font-weight:600; color:#111827; margin-bottom:10px; }
.dark .bp-section-title { color:#f9fafb; }
.bp-section-title.mt { margin-top:24px; }
.bp-card-meta { font-size:14px; font-weight:500; color:#111827; }
.dark .bp-card-meta { color:#f9fafb; }
.bp-card-exp { font-size:12px; color:#6b7280; }
.bp-card-expired { opacity:0.5; cursor:not-allowed !important; }
.bp-new-card-label { font-size:13px; font-weight:500; }
.bp-new-card-wrap { margin:12px 0; }
.bp-card-element { padding:12px; border:1px solid #d1d5db; border-radius:8px; background:#fff; min-height:44px; }
.dark .bp-card-element { background:#1f2937; border-color:#374151; }
.bp-card-errors { color:#dc2626; font-size:13px; margin-top:6px; min-height:18px; }
.bp-totals { display:flex; justify-content:space-between; align-items:center; margin-top:20px; }
.bp-totals-lbl { font-size:14px; color:#374151; }
.dark .bp-totals-lbl { color:#d1d5db; }
.bp-totals-val { font-size:20px; font-weight:700; color:#111827; }
.dark .bp-totals-val { color:#f9fafb; }
.bp-pay-btn { width:100%; justify-content:center; padding:14px; font-size:15px; }

/* Branch payment-step: ek sınıflar */
.bp-card-info { flex:1; }
.bp-new-card-toggle { cursor:pointer; }
.branch-plan-card[wire\:click\.prevent] { cursor:pointer; }