/* Voltic.cloud — global stylesheet placeholder.
   Styling is provided by the Tailwind CDN config in index.html. */

/* =====================================================================
   Bright mode — VolticPOS light palette.
   The SPA is compiled with hardcoded Tailwind utilities, so we override
   the utility classes under [data-theme='light'] (same token names as
   the Odoo side: voltic cyan, plasma purple, terminal green, void ink).
   ===================================================================== */
[data-theme='light'] body,
[data-theme='light'] html {
    background-color: #f4f7fb !important;
    color: #0b1220 !important;
}

[data-theme='light'] .bg-void,
[data-theme='light'] .bg-\[#020617\] {
    background-color: #f4f7fb !important;
}

[data-theme='light'] .bg-void-deep,
[data-theme='light'] .bg-\[#050505\] {
    background-color: #e9eff7 !important;
}

[data-theme='light'] .bg-black {
    background-color: #0b1220 !important;
}

[data-theme='light'] .text-white,
[data-theme='light'] .text-void {
    color: #0b1220 !important;
}

[data-theme='light'] .text-slate-200 {
    color: #1e293b !important;
}

[data-theme='light'] .text-slate-300 {
    color: #334155 !important;
}

[data-theme='light'] .text-slate-400 {
    color: #52657a !important;
}

[data-theme='light'] .text-slate-500 {
    color: #64748b !important;
}

[data-theme='light'] .text-slate-600 {
    color: #52657a !important;
}

[data-theme='light'] .text-slate-700 {
    color: #475569 !important;
}

[data-theme='light'] .border-white {
    border-color: #d8e1ec !important;
}

[data-theme='light'] .bg-white {
    background-color: #ffffff !important;
}

[data-theme='light'] .hover\:bg-white:hover {
    background-color: #ffffff !important;
}

[data-theme='light'] .hover\:text-white:hover {
    color: #0b1220 !important;
}

/* brand accents — darkened for contrast on light surfaces */
[data-theme='light'] .text-voltic,
[data-theme='light'] .bg-voltic {
    color: #0891b2 !important;
}

[data-theme='light'] .bg-voltic {
    background-color: #0891b2 !important;
}

[data-theme='light'] .text-plasma,
[data-theme='light'] .bg-plasma {
    color: #6d28d9 !important;
}

[data-theme='light'] .bg-plasma {
    background-color: #6d28d9 !important;
}

[data-theme='light'] .text-terminal,
[data-theme='light'] .bg-terminal {
    color: #047857 !important;
}

[data-theme='light'] .bg-terminal {
    background-color: #047857 !important;
}

[data-theme='light'] .text-razor,
[data-theme='light'] .bg-razor {
    color: #be123c !important;
}

[data-theme='light'] .bg-razor {
    background-color: #be123c !important;
}

/* grid pattern — dark lines on light bg */
[data-theme='light'] .bg-grid-pattern {
    background-image: linear-gradient(to right, rgba(11, 17, 33, 0.045) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(11, 17, 33, 0.045) 1px, transparent 1px) !important;
}

[data-theme='light'] ::selection {
    background: rgba(0, 168, 198, 0.25);
    color: #020617;
}

[data-theme='light'] ::-webkit-scrollbar-track {
    background: #e9eff7;
}

[data-theme='light'] ::-webkit-scrollbar-thumb {
    background: #b9c6d6;
}

/* =====================================================================
   Theme toggle (floating, bottom-right — same pattern everywhere)
   ===================================================================== */
.vt-toggle {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 10000;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    border: 1px solid #334155;
    background: #0d1526;
    color: #00f0ff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(2, 6, 23, 0.35);
    transition: transform 0.15s ease;
}

.vt-toggle:hover {
    transform: translateY(-2px);
}

.vt-toggle svg {
    width: 22px;
    height: 22px;
}

[data-theme='light'] .vt-toggle {
    background: #ffffff;
    border-color: #b9c6d6;
    color: #0891b2;
}