@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
:root{--font-inter:'Inter',sans-serif;--bg:#000000;--panel:#111111;--muted:#7f7f7f;--primary:#ff6a00;--primary-100:#ffe7d6;--border:#1f1f1f}
html,body{height:100%;background:#ffffff}
.sidebar-link,.sidebar-section,.sidebar-sublink,.sidebar-footer,.topbar,.card-metric .label,.card-metric .value,.chart-title,.table th,.table td,.btn,.form-control,.modal-title,.modal-body,.modal-footer,body{font-family:var(--font-inter)!important}
.sidebar{width:260px;min-width:260px;flex:0 0 260px;flex-shrink:0;min-height:100vh;background:var(--bg);color:#fff;display:flex;flex-direction:column;position:sticky;top:0}
.brand{display:flex;align-items:center;gap:.6rem;border-bottom:1px solid var(--border)}
.brand-logo{font-size:1.4rem}
.brand-avatar{width:28px;height:28px;border-radius:8px;object-fit:cover;border:1px solid var(--border)}
.brand-name{font-weight:800}
.sidebar-link{display:flex;align-items:center;gap:.8rem;color:#c9c9c9;text-decoration:none;padding:.75rem 1rem;border-left:3px solid transparent}
.sidebar-link:hover{background:#0a0a0a;color:#fff}
.sidebar-link.active{color:#fff;background:#0a0a0a;border-left-color:var(--primary)}
.sidebar-link.disabled{opacity:.55;cursor:not-allowed}
.sidebar-section{color:var(--muted);font-weight:800;letter-spacing:.02em;font-size:.78rem;text-transform:uppercase;padding:.5rem 1rem;margin-top:.5rem}
.sidebar-section.active{color:var(--primary)}
.sidebar-sublink{display:block;color:#c9c9c9;text-decoration:none;padding:.5rem 1.2rem;border-left:3px solid transparent}
.sidebar-sublink:hover{background:#0a0a0a;color:#fff}
.sidebar-sublink.active{color:#fff;background:#0a0a0a;border-left-color:var(--primary)}
.sidebar-sublink i{margin-right:.5rem;font-size:1rem;vertical-align:middle}
.sidebar-dropdown-toggle{cursor:pointer}
.sidebar-dropdown-toggle .caret{opacity:.8}
.collapse .sidebar-sublink{padding-left:1.6rem}
.sidebar-footer{margin-top:auto;border-top:1px solid var(--border);color:#bdbdbd}
.topbar{height:80px;background:#fff;border-bottom:1px solid #eeeeee}
.main{min-height:100vh;background:#fafafa}
.card-metric{background:#fff;border:1px solid #eeeeee;border-radius:14px;padding:1rem}
.card-metric .label{color:#2d2d2d;font-weight:600}
.card-metric .value{font-size:1.25rem;font-weight:700;color:#111}
.chart-card{background:#fff;border:1px solid #eeeeee;border-radius:14px;padding:1rem}
.chart-title{font-weight:700;color:#111}


/* Buttons themed to orange */
.btn-primary{--bs-btn-color:#fff;--bs-btn-bg:var(--primary);--bs-btn-border-color:var(--primary);--bs-btn-hover-bg:#e55f00;--bs-btn-hover-border-color:#e55f00;--bs-btn-focus-shadow-rgb:255,106,0}
.btn-outline-primary{--bs-btn-color:var(--primary);--bs-btn-border-color:var(--primary);--bs-btn-hover-bg:var(--primary);--bs-btn-hover-border-color:var(--primary);--bs-btn-hover-color:#fff}

.drag-handle{cursor:grab;user-select:none}
.table{border-color:#eee}
.table th,.table td{vertical-align:middle;border-bottom:1px solid #eee !important}
.table .form-check{margin-bottom:0}
.td-actions .actions{display:flex;align-items:center;justify-content:center;gap:.5rem}
.td-actions form{margin:0;display:inline}
.td-actions .btn{min-width:72px}
.price-badge{background:var(--primary-100);color:#111;border:1px solid #eee;border-radius:999px;padding:.15rem .55rem;font-size:.8rem}
.form-check-input:checked{background-color:var(--primary);border-color:var(--primary)}
.form-switch .form-check-input:focus{box-shadow:0 0 0 .25rem rgba(255,106,0,.25)}

@media(max-width:992px){
  .main{margin-left:0}
  .sidebar{position:fixed;z-index:1030;left:0;top:0;height:100vh;transform:translateX(-100%);transition:transform .3s ease}
  .sidebar-backdrop{display:none}
  .sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-open .sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1029}
}

.cupons-table{font-size:.92rem}
.cupons-table th,.cupons-table td{padding:.45rem .6rem;line-height:1.2}
.cupons-table th{white-space:nowrap}
.cupons-table td:nth-child(2),
.cupons-table td:nth-child(3),
.cupons-table td:nth-child(4),
.cupons-table td:nth-child(5),
.cupons-table td:nth-child(7),
.cupons-table td:nth-child(8),
.cupons-table td:nth-child(9),
.cupons-table td:nth-child(10),
.cupons-table td:nth-child(11){white-space:nowrap}
.cupons-table .drag-handle{font-size:1rem}

/* Pending orders highlight */
@keyframes pendingRowPulse {
  0% { background-color: #ff8f33; }
  50% { background-color: #ff6a00; }
  100% { background-color: #ff8f33; }
}
.pending-blink td { animation: pendingRowPulse 1.2s ease-in-out infinite; color:#fff }
.pending-blink td .btn { background:#fff; color:var(--primary)!important; border-color:#fff }

/* Sidebar Collapsed State */
.sidebar-collapsed .sidebar {
    width: 70px;
    min-width: 70px;
    flex-basis: 70px;
}
.sidebar-collapsed .sidebar .brand-name,
.sidebar-collapsed .sidebar .sidebar-section span,
.sidebar-collapsed .sidebar .sidebar-link span,
.sidebar-collapsed .sidebar .sidebar-sublink span,
.sidebar-collapsed .sidebar .caret,
.sidebar-collapsed .sidebar .sidebar-footer small,
.sidebar-collapsed .sidebar #maskControlArea span {
    display: none !important;
}
.sidebar-collapsed .sidebar .brand {
    justify-content: center !important;
    padding: 0.75rem 0.5rem !important;
}
.sidebar-collapsed .sidebar .brand-avatar {
    margin: 0;
}
.sidebar-collapsed .sidebar #sidebarToggle {
    position: absolute;
    bottom: 20px;
    right: 50%;
    transform: translateX(50%);
    z-index: 100;
    background: #222;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Move toggle button to top if preferred, but let's stick to simple layout */
.sidebar-collapsed .sidebar .brand #sidebarToggle {
    position: static;
    transform: none;
    background: transparent;
    width: auto;
    height: auto;
}

.sidebar-collapsed .sidebar-link,
.sidebar-collapsed .sidebar-sublink {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}
.sidebar-collapsed .sidebar-link i,
.sidebar-collapsed .sidebar-sublink i {
    margin-right: 0;
    font-size: 1.2rem;
}
.sidebar-collapsed .collapse .sidebar-sublink {
    padding-left: 0;
}
.sidebar-collapsed .sidebar-section {
    text-align: center;
    padding: 0.5rem 0;
}
.sidebar-collapsed .sidebar-section::after {
    content: '...';
    display: inline-block;
}

/* Tooltip on hover for collapsed items (optional enhancement) */
.sidebar-collapsed .sidebar-link:hover::after,
.sidebar-collapsed .sidebar-sublink:hover::after {
    /* Implementation of tooltip would go here, skipping for simplicity unless requested */
}