/**
 * Gampil POS — Blacky Theme Stylesheet.
 * Premium, modern, monochrome POS design with subtle mint green accents.
 * All rules strictly scoped under #ada-pos-app[data-pos-theme="blacky"].
 */

/* ==========================================================================
   1. BLACKY DESIGN TOKENS (Light Mode Palette)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] {
	/* Canvas & Surfaces */
	--pos-bg: #F5F6F6;
	--pos-bg-gradient: #F5F6F6;
	--pos-surface: #FFFFFF;
	--pos-surface-muted: #F0F2F2;
	--pos-surface-header: #FFFFFF;
	--pos-surface-elevated: #FFFFFF;
	--pos-surface-section: #F5F6F6;
	--pos-control-bg: #FFFFFF;
	--pos-control-bg-hover: #F0F2F2;
	--pos-input-bg: #FFFFFF;

	/* Typography colors */
	--pos-text-primary: #111312;
	--pos-text-secondary: #6B706D;
	--pos-text-muted: #969C98;
	--pos-text-control: #111312;
	--pos-text-inverse: #FFFFFF;

	/* Borders and elevation */
	--pos-border: #E2E5E3;
	--pos-border-subtle: #F0F2F2;
	--pos-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05);
	--pos-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.06);
	--pos-shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.08);

	/* Actions and semantic states */
	--pos-primary: #111312;
	--pos-primary-hover: #232625;
	--pos-primary-active: #000000;
	--pos-text-on-primary: #FFFFFF;

	--blacky-mint: #A8E8C3;
	--blacky-mint-strong: #39B879;

	--pos-success: #36B779;
	--pos-success-emphasis: #2DA368;
	--pos-danger: #E35D5D;
	--pos-warning: #DFA13C;
	--pos-warning-active: #B87F28;
	--pos-info: #39B879;
	--pos-demographic-pink: #D946EF;
	--pos-demographic-purple: #8B5CF6;

	/* Controls & shape */
	--pos-control-height: 52px;
	--pos-control-radius: 12px;
	--pos-control-border: var(--pos-border);
	--pos-control-focus: #39B879;
	--pos-focus-ring: #A8E8C3;

	--pos-radius-xs: 4px;
	--pos-radius-sm: 8px;
	--pos-radius-md: 12px;
	--pos-radius-lg: 16px;
	--pos-radius-xl: 20px;
	--pos-radius-modal: 20px;
	--pos-radius-image: 10px;
	--pos-radius-label: 6px;

	/* Spacing */
	--pos-space-1: 2px;
	--pos-space-2: 4px;
	--pos-space-3: 6px;
	--pos-space-4: 8px;
	--pos-space-5: 12px;
	--pos-space-6: 16px;

	/* Typography */
	--pos-font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--pos-font-size-xs: 10px;
	--pos-font-size-sm: 11px;
	--pos-font-size-md: 12px;
	--pos-font-size-lg: 13px;
	--pos-font-size-xl: 14px;
	--pos-font-size-title: 16px;

	/* Motion */
	--pos-transition-fast: 0.15s;
	--pos-transition-normal: 0.2s;
	--pos-transition-slow: 0.3s;

	/* Presentation helpers */
	--pos-admin-shortcut-bg: #111312;
	--pos-history-message-text: #6B706D;
}

/* ==========================================================================
   2. LEGACY COMPATIBILITY TOKEN BRIDGE
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] {
	--bg-app: var(--pos-bg);
	--bg-body-radial: var(--pos-bg-gradient);
	--bg-card: var(--pos-surface);
	--bg-step: var(--pos-surface-muted);
	--bg-header: var(--pos-surface-header);
	--bg-btn: var(--pos-control-bg);
	--bg-btn-hover: var(--pos-control-bg-hover);
	--bg-input: var(--pos-input-bg);
	--bg-modal: var(--pos-surface-elevated);
	--bg-modal-section: var(--pos-surface-section);
	--text-primary: var(--pos-text-primary);
	--text-secondary: var(--pos-text-secondary);
	--text-muted: var(--pos-text-muted);
	--text-btn: var(--pos-text-control);
	--border-color: var(--pos-border);
	--border-light: var(--pos-border-subtle);
	--box-shadow-card: var(--pos-shadow-md);
	--box-shadow-modal: var(--pos-shadow-lg);
	--accent-primary: var(--pos-primary);
	--accent-primary-hover: var(--pos-primary-hover);
	--accent-text: var(--pos-text-on-primary);
	--accent-variant: var(--pos-warning);
	--accent-variant-active: var(--pos-warning-active);
	--accent-blue: var(--pos-info);
	--accent-pink: var(--pos-demographic-pink);
	--accent-purple: var(--pos-demographic-purple);
	--accent-danger: var(--pos-danger);
	--btn-height: var(--pos-control-height);
	--btn-radius: var(--pos-control-radius);
}

/* ==========================================================================
   3. HEADER & STATUS INDICATORS (Light Mode)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] .pos-header {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

#ada-pos-app[data-pos-theme="blacky"] .site-title-badge {
	color: #111312;
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"] .outlet-title {
	color: #111312;
	font-weight: 800;
}

#ada-pos-app[data-pos-theme="blacky"] .cashier-name {
	color: #6B706D;
}

#ada-pos-app[data-pos-theme="blacky"] .timezone-badge {
	color: #111312;
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"] .badge-synced {
	background-color: rgba(54, 183, 121, 0.12);
	color: #2DA368;
	border: 1px solid rgba(54, 183, 121, 0.3);
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"] .badge-pending {
	background-color: rgba(223, 161, 60, 0.12);
	color: #B87F28;
	border: 1px solid rgba(223, 161, 60, 0.3);
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"] .status-indicator {
	background: #F0F2F2;
	color: #6B706D;
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"] .status-indicator.online {
	color: #36B779;
	background: rgba(54, 183, 121, 0.1);
}

#ada-pos-app[data-pos-theme="blacky"] .btn-header-end-shift {
	background: #111312;
	color: #FFFFFF;
	border: 1px solid #111312;
	border-radius: 999px;
	font-weight: 700;
	transition: all 0.2s ease;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-header-end-shift:hover {
	background: #E35D5D;
	border-color: #E35D5D;
	color: #FFFFFF;
}

#ada-pos-app[data-pos-theme="blacky"] .adapos-header-action,
#ada-pos-app[data-pos-theme="blacky"] .adapos-admin-shortcut {
	background: #111312;
	color: #FFFFFF;
	border: 1px solid #111312;
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"] .adapos-header-action:hover,
#ada-pos-app[data-pos-theme="blacky"] .adapos-admin-shortcut:hover {
	background: #232625;
	border-color: #232625;
}

/* ==========================================================================
   4. PRODUCT WORKSPACE & TILES (Light Mode)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] .step-card {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
	border-radius: 16px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

#ada-pos-app[data-pos-theme="blacky"] .section-title {
	color: #111312;
	font-weight: 800;
	letter-spacing: -0.2px;
}

#ada-pos-app[data-pos-theme="blacky"] .product-card {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
	border-radius: 14px;
	box-shadow: none;
	transition: all 0.2s ease;
}

#ada-pos-app[data-pos-theme="blacky"] .product-card:hover {
	border-color: #111312;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

#ada-pos-app[data-pos-theme="blacky"] .product-title {
	color: #111312;
	font-weight: 700;
}

#ada-pos-app[data-pos-theme="blacky"] .product-price {
	color: #39B879;
	font-weight: 800;
}

#ada-pos-app[data-pos-theme="blacky"] .product-card.selected {
	background: #111312;
	border: 2px solid #39B879;
	color: #FFFFFF;
	box-shadow: 0 6px 18px rgba(17, 19, 18, 0.25);
}

#ada-pos-app[data-pos-theme="blacky"] .product-card.selected .product-title {
	color: #FFFFFF;
}

#ada-pos-app[data-pos-theme="blacky"] .product-card.selected .product-price {
	color: #A8E8C3;
}

#ada-pos-app[data-pos-theme="blacky"] .product-qty-badge {
	background: #A8E8C3;
	color: #111312;
	font-weight: 800;
	border-radius: 999px;
}

/* Quantity controls inside product cards */
#ada-pos-app[data-pos-theme="blacky"] .btn-qty-minus,
#ada-pos-app[data-pos-theme="blacky"] .btn-qty-plus {
	border-radius: 8px;
	font-weight: 800;
	transition: all 0.15s ease;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-qty-minus {
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	color: #111312;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-qty-minus:hover {
	background: #FFE8E8;
	border-color: #E35D5D;
	color: #E35D5D;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-qty-plus {
	background: #111312;
	border: 1px solid #111312;
	color: #FFFFFF;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-qty-plus:hover {
	background: #232625;
}

#ada-pos-app[data-pos-theme="blacky"] .product-card.selected .btn-qty-minus {
	background: #232625;
	border-color: #3A3E3C;
	color: #FFFFFF;
}

#ada-pos-app[data-pos-theme="blacky"] .product-card.selected .btn-qty-plus {
	background: #39B879;
	border-color: #39B879;
	color: #111312;
}

/* ==========================================================================
   5. DEMOGRAPHIC CONTROLS (Light Mode)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] .demographics-btn {
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	color: #6B706D;
	border-radius: 999px;
	font-weight: 600;
	transition: all 0.2s ease;
}

#ada-pos-app[data-pos-theme="blacky"] .demographics-btn:hover {
	border-color: #111312;
	color: #111312;
}

#ada-pos-app[data-pos-theme="blacky"] .demographics-btn.selected {
	background: #111312;
	border-color: #111312;
	color: #FFFFFF;
	box-shadow: 0 4px 12px rgba(17, 19, 18, 0.2);
}

#ada-pos-app[data-pos-theme="blacky"] .demographics-btn.selected::after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	background: #39B879;
	border-radius: 50%;
	margin-left: 6px;
	vertical-align: middle;
}

/* ==========================================================================
   6. PAYMENT PANEL & NUMPAD (Light Mode)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] .total-display-card {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
	border-radius: 16px;
}

#ada-pos-app[data-pos-theme="blacky"] .total-label {
	color: #6B706D;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	font-size: 11px;
}

#ada-pos-app[data-pos-theme="blacky"] .total-amount {
	color: #111312;
	font-weight: 900;
	letter-spacing: -0.5px;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-pay-method {
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	color: #6B706D;
	border-radius: 12px;
	font-weight: 700;
	transition: all 0.2s ease;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-pay-method:hover {
	border-color: #111312;
	color: #111312;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-pay-method.selected {
	background: #111312;
	border-color: #111312;
	color: #FFFFFF;
	box-shadow: 0 4px 12px rgba(17, 19, 18, 0.2);
}

#ada-pos-app[data-pos-theme="blacky"] .numpad-key {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
	color: #111312;
	border-radius: 12px;
	font-weight: 800;
	transition: all 0.15s ease;
}

#ada-pos-app[data-pos-theme="blacky"] .numpad-key:hover {
	background: #F0F2F2;
	border-color: #111312;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-pas,
#ada-pos-app[data-pos-theme="blacky"] .btn-quick-cash {
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	color: #111312;
	border-radius: 10px;
	font-weight: 700;
}

#ada-pos-app[data-pos-theme="blacky"] .btn-pas:hover,
#ada-pos-app[data-pos-theme="blacky"] .btn-quick-cash:hover {
	background: #111312;
	color: #FFFFFF;
	border-color: #111312;
}

/* Primary Transaction CTA */
#ada-pos-app[data-pos-theme="blacky"] #btn-execute-save-trx,
#ada-pos-app[data-pos-theme="blacky"] .btn-pay-submit,
#ada-pos-app[data-pos-theme="blacky"] .btn-modal-submit {
	background: #111312;
	color: #FFFFFF;
	border: 1px solid #111312;
	border-radius: 12px;
	font-weight: 800;
	box-shadow: 0 4px 14px rgba(17, 19, 18, 0.25);
	transition: all 0.2s ease;
}

#ada-pos-app[data-pos-theme="blacky"] #btn-execute-save-trx:hover,
#ada-pos-app[data-pos-theme="blacky"] .btn-pay-submit:hover,
#ada-pos-app[data-pos-theme="blacky"] .btn-modal-submit:hover {
	background: #232625;
	border-color: #232625;
}

/* ==========================================================================
   7. MODALS & TOASTS (Light Mode)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] .pos-modal-card {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
	border-radius: 20px;
	box-shadow: 0 16px 36px rgba(0, 0, 0, 0.1);
}

#ada-pos-app[data-pos-theme="blacky"] .modal-header h2,
#ada-pos-app[data-pos-theme="blacky"] .modal-header h3 {
	color: #111312;
	font-weight: 800;
}

#ada-pos-app[data-pos-theme="blacky"] .confirm-summary-box {
	background: #F5F6F6;
	border: 1px solid #E2E5E3;
	border-radius: 12px;
}

#ada-pos-app[data-pos-theme="blacky"] .confirm-val-bold {
	color: #111312;
}

#ada-pos-app[data-pos-theme="blacky"] .confirm-val-bold.text-emerald,
#ada-pos-app[data-pos-theme="blacky"] .confirm-val-bold.text-emerald-glow {
	color: #39B879;
}

#ada-pos-app[data-pos-theme="blacky"] .confirm-warning-notice {
	background: #FFFBEB;
	border: 1px solid #FDE68A;
	color: #92400E;
	border-radius: 10px;
}

#ada-pos-app[data-pos-theme="blacky"] .adapos-toast {
	background: #111312;
	color: #FFFFFF;
	border: 1px solid #39B879;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   8. QRIS PAYMENT ASSISTANT (Light Mode & Mandatory Canvas Rules)
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] .qris-modal-card {
	background: #FFFFFF;
	border: 1px solid #E2E5E3;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-merchant-name {
	color: #111312;
	font-weight: 800;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-total-label {
	color: #6B706D;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-total-amount {
	color: #111312;
	font-weight: 900;
}

/* MANDATORY RULE: Pure white canvas for QR code frame. No filter, tint, blend or invert */
#ada-pos-app[data-pos-theme="blacky"] .adapos-qris-code-frame {
	background: #FFFFFF !important;
	border: 1px solid #E2E5E3 !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
	border-radius: 12px;
	padding: 12px;
}

#ada-pos-app[data-pos-theme="blacky"] .adapos-qris-code-frame img {
	filter: none !important;
	mix-blend-mode: normal !important;
	opacity: 1 !important;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-scan-prompt {
	color: #111312;
	font-weight: 700;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-nominal-box {
	background: #F5F6F6;
	border: 1px solid #E2E5E3;
	border-radius: 10px;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-nominal-label {
	color: #6B706D;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-nominal-value {
	color: #111312;
	font-weight: 800;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-instruction-text {
	color: #6B706D;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-warning-box {
	background: #FFFBEB;
	border: 1px solid #FDE68A;
	color: #92400E;
	border-radius: 10px;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-step2-box {
	background: #F5F6F6;
	border: 1px solid #E2E5E3;
	border-radius: 12px;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-step2-total-amount {
	color: #39B879;
	font-weight: 900;
}

#ada-pos-app[data-pos-theme="blacky"] .qris-cashier-notice {
	background: #F0F2F2;
	border: 1px solid #E2E5E3;
	color: #111312;
	border-radius: 10px;
}

/* ==========================================================================
   9. BLACKY DARK MODE (data-pos-color-mode="dark")
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] {
	/* Dark Canvas & Layered Surfaces */
	--pos-bg: #0B0D0C;
	--pos-bg-gradient: #0B0D0C;
	--pos-surface: #121513;
	--pos-surface-muted: #191D1A;
	--pos-surface-header: #121513;
	--pos-surface-elevated: #191D1A;
	--pos-surface-section: #202421;
	--pos-control-bg: #202421;
	--pos-control-bg-hover: #2B302D;
	--pos-input-bg: #191D1A;

	--pos-text-primary: #F5F7F5;
	--pos-text-secondary: #A5ABA7;
	--pos-text-muted: #737975;
	--pos-text-control: #F5F7F5;
	--pos-text-inverse: #111312;

	--pos-border: #2B302D;
	--pos-border-subtle: #191D1A;
	--pos-shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.3);
	--pos-shadow-md: 0 6px 18px rgba(0, 0, 0, 0.4);
	--pos-shadow-lg: 0 16px 36px rgba(0, 0, 0, 0.5);

	--pos-primary: #54D68E;
	--pos-primary-hover: #87E6B1;
	--pos-primary-active: #39B879;
	--pos-text-on-primary: #111312;

	--blacky-mint: #87E6B1;
	--blacky-mint-strong: #54D68E;

	--pos-success: #54D68E;
	--pos-danger: #E86C6C;
	--pos-warning: #E5AD4E;
	--pos-info: #87E6B1;

	--pos-admin-shortcut-bg: #202421;
	--pos-history-message-text: #A5ABA7;
}

/* Dark Mode Header Overrides */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .pos-header {
	background: #121513;
	border-color: #2B302D;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .site-title-badge {
	color: #F5F7F5;
	background: #202421;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .outlet-title {
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .cashier-name {
	color: #A5ABA7;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .timezone-badge {
	color: #F5F7F5;
	background: #202421;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .badge-synced {
	background: rgba(84, 214, 142, 0.15);
	color: #54D68E;
	border-color: rgba(84, 214, 142, 0.3);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .status-indicator {
	background: #202421;
	color: #A5ABA7;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .status-indicator.online {
	color: #54D68E;
	background: rgba(84, 214, 142, 0.12);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .adapos-header-action,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .adapos-admin-shortcut {
	background: #202421;
	color: #F5F7F5;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .adapos-header-action:hover,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .adapos-admin-shortcut:hover {
	background: #2B302D;
	border-color: #54D68E;
}

/* Dark Mode Step & Product Cards */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .step-card {
	background: #121513;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .section-title {
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-card {
	background: #191D1A;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-card:hover {
	border-color: #54D68E;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-title {
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-price {
	color: #54D68E;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-card.selected {
	background: #202421;
	border: 2px solid #54D68E;
	color: #F5F7F5;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-card.selected .product-title {
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-card.selected .product-price {
	color: #87E6B1;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .product-qty-badge {
	background: #54D68E;
	color: #111312;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-qty-minus {
	background: #202421;
	border-color: #2B302D;
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-qty-plus {
	background: #54D68E;
	border-color: #54D68E;
	color: #111312;
}

/* Dark Mode Demographics */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .demographics-btn {
	background: #202421;
	border-color: #2B302D;
	color: #A5ABA7;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .demographics-btn:hover {
	border-color: #54D68E;
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .demographics-btn.selected {
	background: #54D68E;
	border-color: #54D68E;
	color: #111312;
	font-weight: 800;
	box-shadow: 0 4px 14px rgba(84, 214, 142, 0.25);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .demographics-btn.selected::after {
	background: #111312;
}

/* Dark Mode Payment Panel */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .total-display-card {
	background: #121513;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .total-label {
	color: #A5ABA7;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .total-amount {
	color: #54D68E;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pay-method {
	background: #202421;
	border-color: #2B302D;
	color: #A5ABA7;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pay-method:hover {
	border-color: #54D68E;
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pay-method.selected {
	background: #54D68E;
	border-color: #54D68E;
	color: #111312;
	font-weight: 800;
	box-shadow: 0 4px 14px rgba(84, 214, 142, 0.25);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .numpad-key {
	background: #191D1A;
	border-color: #2B302D;
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .numpad-key:hover {
	background: #202421;
	border-color: #54D68E;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pas,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-quick-cash {
	background: #202421;
	border-color: #2B302D;
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pas:hover,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-quick-cash:hover {
	background: #54D68E;
	color: #111312;
	border-color: #54D68E;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] #btn-execute-save-trx,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pay-submit,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-modal-submit {
	background: #54D68E;
	color: #111312;
	border-color: #54D68E;
	font-weight: 800;
	box-shadow: 0 4px 16px rgba(84, 214, 142, 0.3);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] #btn-execute-save-trx:hover,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-pay-submit:hover,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .btn-modal-submit:hover {
	background: #87E6B1;
	border-color: #87E6B1;
}

/* Dark Mode Modals & Overlays */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .pos-modal-card {
	background: #121513;
	border-color: #2B302D;
	box-shadow: 0 20px 48px rgba(0, 0, 0, 0.6);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .modal-header h2,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .modal-header h3 {
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .confirm-summary-box {
	background: #191D1A;
	border-color: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .confirm-val-bold {
	color: #F5F7F5;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .confirm-val-bold.text-emerald,
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .confirm-val-bold.text-emerald-glow {
	color: #54D68E;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .confirm-warning-notice {
	background: rgba(229, 173, 78, 0.12);
	border-color: rgba(229, 173, 78, 0.3);
	color: #E5AD4E;
}

/* Dark Mode QRIS Assistant Overrides */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-modal-card {
	background: #121513 !important;
	border-color: #2B302D !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-merchant-name {
	color: #54D68E !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-total-label {
	color: #A5ABA7 !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-total-amount {
	color: #F5F7F5 !important;
}

/* QR Code Frame MUST STAY PURE WHITE in Dark Mode */
#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .adapos-qris-code-frame {
	background: #FFFFFF !important;
	border: 1px solid #FFFFFF !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-scan-prompt {
	color: #F5F7F5 !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-nominal-box {
	background: #191D1A !important;
	border-color: #2B302D !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-nominal-label {
	color: #A5ABA7 !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-nominal-value {
	color: #54D68E !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-instruction-text {
	color: #A5ABA7 !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-warning-box {
	background: rgba(229, 173, 78, 0.12) !important;
	border-color: rgba(229, 173, 78, 0.3) !important;
	color: #E5AD4E !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-step2-box {
	background: #191D1A !important;
	border-color: #2B302D !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-step2-total-amount {
	color: #54D68E !important;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] .qris-cashier-notice {
	background: #202421 !important;
	border-color: #2B302D !important;
	color: #A5ABA7 !important;
}

/* ==========================================================================
   10. FOCUS & SCROLLBAR ACCESSIBILITY
   ========================================================================== */
#ada-pos-app[data-pos-theme="blacky"] :focus-visible {
	outline: 2px solid #39B879;
	outline-offset: 2px;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] :focus-visible {
	outline: 2px solid #54D68E;
	outline-offset: 2px;
}

/* Custom Scrollbar */
#ada-pos-app[data-pos-theme="blacky"] ::-webkit-scrollbar {
	width: 6px;
	height: 6px;
}

#ada-pos-app[data-pos-theme="blacky"] ::-webkit-scrollbar-track {
	background: transparent;
}

#ada-pos-app[data-pos-theme="blacky"] ::-webkit-scrollbar-thumb {
	background: #E2E5E3;
	border-radius: 999px;
}

#ada-pos-app[data-pos-theme="blacky"][data-pos-color-mode="dark"] ::-webkit-scrollbar-thumb {
	background: #2B302D;
}

#ada-pos-app[data-pos-theme="blacky"] ::-webkit-scrollbar-thumb:hover {
	background: #6B706D;
}