/* ============================================================
   TonyCell HN POS — tema oscuro con la paleta de la marca
   Cian #19D3FF · Azul #2F6BFF · Naranja #FF7A1A · Negro #000/#0A0A0A
   (solo aplica cuando el usuario usa el tema "oscuro")
   ============================================================ */
html[data-theme="dark"] {
    /* grises neutros hacia el negro de la marca */
    --color-gray-950: #000000;
    --color-gray-900: #0A0A0A;
    --color-gray-800: #121519;
    --color-gray-700: #1B2027;
    --color-gray-600: #262C35;
    --color-gray-500: #36404B;
    --color-gray-400: #8A96A3;
    --color-gray-300: #C5D0D9;
    --color-gray-200: #DFE8EE;
    --color-gray-100: #EEF3F6;

    --color-surface: #000000;
    --color-aside-background: #0A0A0A;
    --color-aside-menu-background: #0A0A0A;
    --color-aside-menu-background-hover: #121519;
    --color-aside-submenu-background: #0A0A0A;
    --color-aside-submenu-background-hover: #121519;
    --color-box-edge: #2A2A2A;
    --color-box-background: #0F1216;
    --color-box-elevation-background: #161A20;
    --color-box-elevation-edge: #2A2A2A;
    --color-box-elevation-hover: #1F252D;
    --color-input-background: #121519;
    --color-input-edge: #2A2A2A;
    --color-pos-button-edge: #2A2A2A;
    --color-popup-surface: #0F1216;
    --color-tab-active: #1B2027;
    --color-tab-inactive: #121519;
    --color-table-th: #121519;
    --color-table-th-edge: #2A2A2A;
    --color-scroll-thumb: #2F6BFF;

    /* color principal: cian / azul */
    --color-primary: #19D3FF;
    --color-secondary: #2F6BFF;
    --color-tertiary: #2F4FD8;
    --color-info-primary: #1E3FA8;
    --color-info-secondary: #2F6BFF;
    --color-info-tertiary: #19D3FF;

    /* naranja solo para acentos */
    --color-warning-primary: #FFB27A;
    --color-warning-secondary: #FF7A1A;
    --color-warning-tertiary: #E0620A;

    --tc-grad: linear-gradient(90deg, #19D3FF, #2F6BFF);
}

/* menú lateral: opción activa en degradado */
html[data-theme="dark"] #dashboard-aside > div .ns-aside-menu.toggled {
    background: var(--tc-grad) !important;
    border-color: transparent !important;
    color: #fff !important;
}
html[data-theme="dark"] #dashboard-aside > div .ns-aside-submenu {
    border-color: #19D3FF;
}
html[data-theme="dark"] #dashboard-aside > div .ns-aside-submenu.active {
    color: #19D3FF !important;
}

/* POS: botón de cobrar en naranja, en espera en azul */
html[data-theme="dark"] #cart-bottom-buttons #pay-button {
    background: #FF7A1A !important;
    border-color: #FF7A1A !important;
    color: #111 !important;
    font-weight: 600;
}
html[data-theme="dark"] #cart-bottom-buttons #pay-button:hover {
    background: #E0620A !important;
}
html[data-theme="dark"] #cart-bottom-buttons #hold-button {
    background: #2F6BFF !important;
    border-color: #2F6BFF !important;
}

/* ===== POS con estilo TonyCell (como la muestra) ===== */
html[data-theme="dark"] #pos-container { background:#000 !important; }
html[data-theme="dark"] #pos-cart, html[data-theme="dark"] #pos-cart .cart-table { background:#0A0A0A !important; border-color:#2A2A2A !important; }
html[data-theme="dark"] #pos-cart #cart-toolbox .ns-button button,
html[data-theme="dark"] #pos-cart #cart-toolbox button { background:#111418 !important; border:1px solid #2A2A2A !important; border-radius:10px !important; color:#DFE8EE !important; }
html[data-theme="dark"] #pos-cart #cart-toolbox button:hover { border-color:#19D3FF !important; color:#19D3FF !important; }
html[data-theme="dark"] #cart-table-header { background:#0A0A0A !important; color:#8A96A3 !important; border-color:#2A2A2A !important; }
html[data-theme="dark"] #cart-products-table .product-item { background:#0A0A0A !important; border-color:#2A2A2A !important; }
html[data-theme="dark"] #cart-products-table .product-item .price,
html[data-theme="dark"] #cart-products-table .product-price { color:#FFFFFF !important; font-weight:600; }
html[data-theme="dark"] #cart-products-table .quantity-changer { border-color:#2A2A2A !important; }
html[data-theme="dark"] #cart-products-summary { background:#0A0A0A !important; border-color:#2A2A2A !important; color:#DFE8EE !important; }
html[data-theme="dark"] #cart-products-summary .summary-line { border-color:#2A2A2A !important; }
html[data-theme="dark"] #cart-bottom-buttons > * { border-radius:12px !important; margin:4px; }
html[data-theme="dark"] #cart-bottom-buttons #discount-button,
html[data-theme="dark"] #cart-bottom-buttons #void-button { background:#111418 !important; border:1px solid #2A2A2A !important; color:#DFE8EE !important; }
html[data-theme="dark"] #pos-grid, html[data-theme="dark"] #grid-container { background:#000 !important; }
html[data-theme="dark"] #grid-header input, html[data-theme="dark"] #grid-header > div { background:#111418 !important; border-color:#2A2A2A !important; border-radius:12px; color:#DFE8EE !important; }
html[data-theme="dark"] #grid-breadcrumb { background:#000 !important; border-color:#2A2A2A !important; color:#19D3FF !important; }
html[data-theme="dark"] #grid-items { gap:12px; padding:12px; background:#000 !important; }
html[data-theme="dark"] #grid-items .cell-item,
html[data-theme="dark"] #pinned-products .cell-item { background:#111418 !important; border:1px solid #2A2A2A !important; border-radius:14px !important; overflow:hidden; }
html[data-theme="dark"] #grid-items .cell-item:hover { border-color:#19D3FF !important; box-shadow:0 0 12px #19D3FF33; }
html[data-theme="dark"] #grid-items .cell-item .cell-item-label { background:#111418 !important; color:#DFE8EE !important; }
html[data-theme="dark"] #grid-items .cell-item .cell-item-label h3,
html[data-theme="dark"] #grid-items .cell-item .cell-item-label span:last-child { font-weight:500; }
html[data-theme="dark"] #grid-items .cell-item img { background:radial-gradient(circle at 50% 60%,#12303d,#0b0f14 70%); }
html[data-theme="dark"] .pos-price, html[data-theme="dark"] #grid-items .cell-item .cell-item-label .text-sm { color:#FF7A1A !important; font-weight:600; }
html[data-theme="dark"] #ns-order-type .ns-box-body > div { border-radius:12px; border-color:#2A2A2A !important; }
html[data-theme="dark"] #ns-order-type .ns-box-body > div:hover { border-color:#19D3FF !important; color:#19D3FF !important; }