/* Beewards POS - Custom Styles */

:root {
    --beewards-gold: #FFCC00;
    --beewards-black: #111111;
    --beewards-surface: #1A1A1A;
    --beewards-surface2: #222222;
}

body {
    background-color: var(--beewards-black);
    color: white;
    font-family: 'Inter', sans-serif;
}

/* Honeycomb Pattern Background */
.bg-honeycomb {
    background-color: #111111;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%23ffcc00' fill-opacity='0.03' fill-rule='evenodd'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.91v12.68l11 6.35 11-6.35V17.91L14 11.56l-11 6.35z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

/* Custom Scrollbar */
.scrollbar-thin::-webkit-scrollbar {
    width: 6px;
}
.scrollbar-thin::-webkit-scrollbar-track {
    background: transparent;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
    background: rgba(255, 204, 0, 0.1);
    border-radius: 10px;
}
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 204, 0, 0.3);
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Line Clamp */
.line-clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Payment Method Selection */
.payment-method-btn.active {
    border-color: var(--beewards-gold) !important;
    background-color: rgba(255, 204, 0, 0.1) !important;
}

.payment-method-btn.active i {
    color: var(--beewards-gold) !important;
}

/* Animations */
@keyframes bounce-subtle {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}

.animate-bounce-subtle {
    animation: bounce-subtle 2s infinite;
}

/* Drawer Transitions */
#mobile-cart-drawer {
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Floating Action Button (FAB) Pulse */
@keyframes fab-pulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 204, 0, 0.4); }
    70% { box-shadow: 0 0 0 20px rgba(255, 204, 0, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 204, 0, 0); }
}

.fab-pulse {
    animation: fab-pulse 2s infinite;
}

/* Glassmorphism Refinements */
.glass {
    background: rgba(26, 26, 26, 0.8);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* Modal Entry */
.modal-enter {
    animation: modal-enter 0.3s ease-out;
}

@keyframes modal-enter {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* ── Print Styles (Thermal Tickets) ──────────────────────────────────────── */
@media print {
    body > *:not(#printable-ticket) {
        display: none !important;
    }
    #printable-ticket {
        display: block !important;
    }
    @page {
        margin: 0;
        size: 58mm auto;
    }
    .ticket-88mm @page {
        size: 88mm auto;
    }
}

/* ── Payment Method Active State ─────────────────────────────────────────── */
.payment-method-btn.active {
    border-color: #FFCC00 !important;
    background-color: rgba(255,204,0,0.1) !important;
}
.payment-method-btn.active i,
.payment-method-btn.active span {
    color: #FFCC00 !important;
}

/* ── Glass card hover glow ───────────────────────────────────────────────── */
.beewards-glass {
    background: rgba(28, 27, 27, 0.85);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}