/**
 * ENNU Checkout Interface Styles
 *
 * Uses shared design tokens from ennu-infrastructure/assets/css/design-tokens.css
 * All --ennu-* variables come from the infrastructure design system.
 *
 * This file extends the shared luxury components with checkout-specific styles.
 * DO NOT define :root variables here - use infrastructure tokens only.
 *
 * @package ENNU_Checkout_Payment
 * @since 1.3.0
 * @requires ennu-design-tokens, ennu-luxury-components, ennu-staff-interface
 */

/* ==========================================================================
   CHECKOUT CONTAINER
   ========================================================================== */

.ennu-checkout-interface-enhanced {
    font-family: var(--ennu-font-sans);
    font-size: var(--ennu-text-base);
    line-height: var(--ennu-leading-normal);
    color: var(--ennu-gray-800);
    background: linear-gradient(180deg, var(--ennu-gray-50) 0%, var(--ennu-white) 50%, var(--ennu-white) 100%);
    min-height: 100vh;
    padding: var(--ennu-space-6);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
}

/* Subtle organic texture overlay */
.ennu-checkout-interface-enhanced::before {
    content: '';
    position: fixed;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
    opacity: 0.015;
    pointer-events: none;
    z-index: 0;
}

.ennu-checkout-interface-enhanced > *:not(.checkout-products-modal):not(.modal) {
    position: relative;
    z-index: 1;
}

/* Products modal must escape parent stacking context */
.ennu-checkout-interface-enhanced > .checkout-products-modal {
    position: fixed !important;
    z-index: 2147483647 !important;
}

/* ==========================================================================
   THREE-COLUMN GRID LAYOUT
   ========================================================================== */

.checkout-main-grid {
    display: grid;
    grid-template-columns: 320px 1fr 380px;
    gap: var(--ennu-space-6, 24px);
    min-height: calc(100vh - 200px);
    animation: fadeSlideUp 0.4s ease-out;
}

/* Left Panel: Patient List */
.patients-panel {
    background: #ffffff;
    border-radius: var(--ennu-radius-xl, 16px);
    box-shadow: var(--ennu-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1));
    border: 1px solid #e5e7eb;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 220px);
}

/* Center Content: Checkout Details */
.checkout-content {
    background: #ffffff;
    border-radius: var(--ennu-radius-xl, 16px);
    box-shadow: var(--ennu-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1));
    border: 1px solid #e5e7eb;
    overflow: hidden;
    position: relative;
    min-height: 500px;
}

/* Right Panel: Payment Summary */
.payment-panel {
    background: #ffffff;
    border-radius: var(--ennu-radius-xl, 16px);
    box-shadow: var(--ennu-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1));
    border: 1px solid #e5e7eb;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 220px);
}

/* Panel Titles */
.panel-title {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-4, 16px) var(--ennu-space-5, 20px);
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%);
    color: #ffffff;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: var(--ennu-text-lg, 18px);
    font-weight: var(--ennu-font-medium, 500);
    margin: 0;
    border-bottom: 3px solid #C9A962;
}

.panel-title .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: #C9A962;
}

.patient-count-badge {
    background: #C9A962;
    color: #ffffff;
    padding: 2px 10px;
    border-radius: var(--ennu-radius-full, 9999px);
    font-size: var(--ennu-text-xs, 12px);
    font-weight: var(--ennu-font-semibold, 600);
    margin-left: auto;
    min-width: 28px;
    text-align: center;
}

/* Patient List Container */
.patient-list {
    flex: 1;
    overflow-y: auto;
    padding: var(--ennu-space-4, 16px);
    display: flex;
    flex-direction: column;
    gap: var(--ennu-space-3, 12px);
}

/* Summary Section */
.summary-section {
    padding: var(--ennu-space-4, 16px) var(--ennu-space-5, 20px);
    flex: 1;
    overflow-y: auto;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ennu-space-2, 8px) 0;
    font-size: var(--ennu-text-sm, 14px);
    color: var(--ennu-gray-600, #4B5563);
}

.summary-label {
    font-weight: var(--ennu-font-medium, 500);
}

.summary-value {
    font-weight: var(--ennu-font-semibold, 600);
    color: #1f2937;
}

.summary-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, #d1d5db, transparent);
    margin: var(--ennu-space-3, 12px) 0;
}

.summary-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ennu-space-4, 16px) var(--ennu-space-5, 20px);
    background: linear-gradient(135deg, #f9fafb 0%, rgba(201, 169, 98, 0.1) 100%);
    border-top: 2px solid var(--ennu-primary-light, #E5D4A1);
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: var(--ennu-text-xl, 20px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #1A2744;
}

.summary-total span:last-child {
    font-size: var(--ennu-text-2xl, 24px);
    color: #C9A962;
}

/* Loading Overlay */
.loading-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.9);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.loading-overlay.active {
    display: flex;
}

.loading-message {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--ennu-space-4, 16px);
    color: var(--ennu-gray-600, #4B5563);
    font-size: var(--ennu-text-sm, 14px);
}

.spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: #C9A962;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

/* ==========================================================================
   CHECKOUT MAIN CONTENT AREA
   ========================================================================== */

#checkout-main-content {
    padding: var(--ennu-space-6, 24px);
    min-height: 400px;
}

/* Patient Detail Header */
.patient-detail-header {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-4, 16px);
    padding: var(--ennu-space-5, 20px);
    background: linear-gradient(135deg, #f9fafb 0%, rgba(201, 169, 98, 0.05) 100%);
    border-radius: var(--ennu-radius-lg, 12px);
    margin-bottom: var(--ennu-space-6, 24px);
    border: 1px solid #e5e7eb;
}

.patient-detail-avatar {
    width: 64px;
    height: 64px;
    border-radius: var(--ennu-radius-full, 9999px);
    background: linear-gradient(135deg, #C9A962 0%, var(--ennu-primary-dark, #A68B4B) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: var(--ennu-text-2xl, 24px);
    font-weight: var(--ennu-font-semibold, 600);
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

.patient-detail-info {
    flex: 1;
}

.patient-detail-name {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: var(--ennu-text-2xl, 24px);
    font-weight: var(--ennu-font-medium, 500);
    color: #1A2744;
    margin-bottom: var(--ennu-space-1, 4px);
}

.patient-detail-meta {
    font-size: var(--ennu-text-sm, 14px);
    color: var(--ennu-gray-500, #6B7280);
}

/* ==========================================================================
   RESPONSIVE GRID LAYOUT
   ========================================================================== */

@media (max-width: 1400px) {
    .checkout-main-grid {
        grid-template-columns: 280px 1fr 340px;
        gap: var(--ennu-space-4, 16px);
    }
}

@media (max-width: 1200px) {
    .checkout-main-grid {
        grid-template-columns: 260px 1fr 320px;
    }
}

@media (max-width: 1024px) {
    .checkout-main-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto 1fr;
    }
    
    .patients-panel {
        grid-column: 1;
        grid-row: 1 / 3;
        max-height: none;
    }
    
    .checkout-content {
        grid-column: 2;
        grid-row: 1;
    }
    
    .payment-panel {
        grid-column: 2;
        grid-row: 2;
        max-height: none;
    }
}

@media (max-width: 768px) {
    .checkout-main-grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        gap: var(--ennu-space-4, 16px);
    }
    
    .patients-panel,
    .checkout-content,
    .payment-panel {
        grid-column: 1;
        grid-row: auto;
        max-height: none;
    }
    
    .patients-panel {
        max-height: 300px;
    }
}

/* ==========================================================================
   GLOBAL TYPOGRAPHY (using infrastructure tokens)
   ========================================================================== */

.ennu-checkout-interface-enhanced h1,
.ennu-checkout-interface-enhanced h2,
.ennu-checkout-interface-enhanced h3,
.ennu-checkout-interface-enhanced h4 {
    font-family: var(--ennu-font-display);
    font-weight: var(--ennu-font-medium);
    letter-spacing: var(--ennu-tracking-tight);
    line-height: var(--ennu-leading-tight);
    color: var(--ennu-navy);
}

/* ==========================================================================
   ANIMATIONS (shared infrastructure animations)
   ========================================================================== */

@keyframes fadeSlideUp {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeSlideIn {
    from {
        opacity: 0;
        transform: translateX(-12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.96);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes shimmer {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes ripple {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

@keyframes success-pulse {
    0%, 100% { 
        box-shadow: 0 0 0 0 rgba(5, 150, 105, 0.4);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(5, 150, 105, 0);
    }
}

/* ==========================================================================
   CLOCK & STATS BAR (extends staff-interface.css)
   ========================================================================== */

.ennu-checkout-interface-enhanced .ennu-clock {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-4);
    padding: var(--ennu-space-2-5) var(--ennu-space-5);
    background: linear-gradient(135deg, var(--ennu-gray-50) 0%, var(--ennu-gray-100) 100%);
    border-radius: var(--ennu-radius-full);
    border: 1px solid var(--ennu-gray-200);
}

.ennu-checkout-interface-enhanced .ennu-time {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-xl);
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-navy);
    letter-spacing: var(--ennu-tracking-tight);
}

.ennu-checkout-interface-enhanced .ennu-clock-divider {
    width: 1px;
    height: 20px;
    background: var(--ennu-gray-300);
}

.ennu-checkout-interface-enhanced .ennu-date {
    font-size: var(--ennu-text-sm);
    color: var(--ennu-gray-500);
    font-weight: var(--ennu-font-medium);
}

/* Stats Bar */
.checkout-stats-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: var(--ennu-space-4);
    padding: var(--ennu-space-4) var(--ennu-space-6);
    background: linear-gradient(180deg, var(--ennu-gray-50) 0%, var(--ennu-white) 100%);
    border-bottom: 1px solid var(--ennu-gray-200);
    margin-bottom: var(--ennu-space-6);
    animation: fadeSlideUp var(--ennu-duration-300) var(--ennu-ease-out) 0.1s both;
}

/* ==========================================================================
   HEADER (inherits from staff-interface.css)
   ========================================================================== */

.checkout-header {
    background: var(--ennu-white);
    border-radius: var(--ennu-radius-xl);
    padding: var(--ennu-space-6) var(--ennu-space-8);
    margin-bottom: var(--ennu-space-6);
    box-shadow: var(--ennu-shadow-lg);
    position: relative;
    overflow: hidden;
}

.checkout-header::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle at top right, rgba(201, 169, 98, 0.1), transparent 70%);
    pointer-events: none;
}

.checkout-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--ennu-primary-gradient);
    border-radius: 0 0 var(--ennu-radius-xl) var(--ennu-radius-xl);
}

.header-title {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-3xl);
    font-weight: var(--ennu-font-medium);
    margin-bottom: var(--ennu-space-6);
    color: var(--ennu-navy);
    display: flex;
    align-items: center;
    gap: var(--ennu-space-4);
    letter-spacing: var(--ennu-tracking-tight);
}

.header-title .dashicons {
    color: var(--ennu-primary);
}

/* ==========================================================================
   AUTOSAVE STATUS
   ========================================================================== */

.ennu-autosave-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--ennu-space-2-5) var(--ennu-space-4);
    background: linear-gradient(135deg, var(--ennu-gray-50) 0%, rgba(201, 169, 98, 0.08) 100%);
    border: 1px solid var(--ennu-gray-200);
    border-radius: var(--ennu-radius-md);
    margin-bottom: var(--ennu-space-4);
    font-size: var(--ennu-text-xs);
    transition: all var(--ennu-duration-200) ease;
}

.ennu-autosave-status.saving {
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.08) 100%);
    border-color: var(--ennu-primary-light);
}

.ennu-autosave-status.saved {
    background: linear-gradient(135deg, rgba(76, 175, 80, 0.08) 0%, rgba(76, 175, 80, 0.04) 100%);
    border-color: rgba(76, 175, 80, 0.2);
}

.autosave-indicator {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2);
    color: var(--ennu-gray-500);
}

.autosave-icon {
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.autosave-icon::before {
    content: '✓';
    color: var(--ennu-success);
}

.ennu-autosave-status.saving .autosave-icon::before {
    content: '';
    width: 12px;
    height: 12px;
    border: 2px solid var(--ennu-primary);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes autosave-spin {
    to { transform: rotate(360deg); }
}

.autosave-text {
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-gray-800);
}

.ennu-autosave-status.saving .autosave-text {
    color: var(--ennu-primary);
}

.ennu-autosave-status.saved .autosave-text {
    color: var(--ennu-success);
}

.autosave-time {
    font-size: var(--ennu-text-2xs);
    color: var(--ennu-gray-400);
}

/* ==========================================================================
   PATIENT CARDS
   ========================================================================== */

.patient-card {
    background: var(--ennu-white);
    border-radius: var(--ennu-radius-xl);
    padding: var(--ennu-space-5);
    box-shadow: var(--ennu-shadow-md);
    border: 1px solid var(--ennu-gray-200);
    transition: all var(--ennu-duration-200) var(--ennu-ease-out);
    position: relative;
    overflow: hidden;
}

.patient-card:hover {
    box-shadow: var(--ennu-shadow-lg, 0 4px 12px rgba(0, 0, 0, 0.1));
    transform: translateY(-2px);
    border-color: var(--ennu-primary-light, #C9A962);
}

.patient-card.selected {
    border-color: var(--ennu-primary, #C9A962);
    box-shadow: var(--ennu-shadow-gold, 0 0 0 3px rgba(201, 169, 98, 0.2));
}

.patient-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    /* 2026-01-13: Fixed gradient with proper gold fallback */
    background: var(--ennu-primary-gradient, linear-gradient(135deg, #d4af37 0%, #f4d03f 50%, #c5a028 100%));
    opacity: 0;
    transition: opacity var(--ennu-duration-200, 200ms) ease;
}

.patient-card:hover::before,
.patient-card.selected::before {
    opacity: 1;
}

/* Patient Avatar */
.patient-avatar {
    width: 48px;
    height: 48px;
    border-radius: var(--ennu-radius-full);
    background: linear-gradient(135deg, var(--ennu-primary) 0%, var(--ennu-primary-dark) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ennu-white);
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-lg);
    font-weight: var(--ennu-font-semibold);
    flex-shrink: 0;
    box-shadow: var(--ennu-shadow-gold-sm);
}

/* Patient Info */
.ennu-checkout-interface-enhanced .patient-info {
    flex: 1;
    min-width: 0;
}

.ennu-checkout-interface-enhanced .patient-name {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-lg);
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-navy);
    margin-bottom: var(--ennu-space-1);
    line-height: var(--ennu-leading-tight);
}

.ennu-checkout-interface-enhanced .patient-name.patient-profile-link {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1);
    text-decoration: none;
    color: inherit;
}

.ennu-checkout-interface-enhanced .patient-name.patient-profile-link:hover {
    color: var(--ennu-primary);
}

.ennu-checkout-interface-enhanced .patient-name.patient-profile-link .dashicons {
    font-size: 11px;
    opacity: 0.5;
    transition: opacity var(--ennu-duration-150) ease;
}

.ennu-checkout-interface-enhanced .patient-name.patient-profile-link:hover .dashicons {
    opacity: 1;
}

.ennu-checkout-interface-enhanced .patient-meta {
    font-size: var(--ennu-text-xs);
    color: var(--ennu-gray-500);
    line-height: 1.6;
}

.ennu-checkout-interface-enhanced .patient-meta strong {
    color: var(--ennu-success);
    font-size: var(--ennu-text-sm);
}

/* Patient Status Badge */
.ennu-checkout-interface-enhanced .patient-status {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1);
    padding: var(--ennu-space-1-5) var(--ennu-space-3);
    font-size: var(--ennu-text-xs);
    font-weight: var(--ennu-font-semibold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: var(--ennu-radius-full);
    background: var(--ennu-gray-100);
    color: var(--ennu-gray-600);
    flex-shrink: 0;
}

.ennu-checkout-interface-enhanced .patient-status.ready,
.ennu-checkout-interface-enhanced .patient-status.ready-for-checkout {
    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
    color: #065f46;
    border: 1px solid rgba(5, 150, 105, 0.3);
}

.ennu-checkout-interface-enhanced .patient-status.processing,
.ennu-checkout-interface-enhanced .patient-status.in-treatment {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    color: #92400e;
    border: 1px solid rgba(217, 119, 6, 0.3);
}

.ennu-checkout-interface-enhanced .patient-status.completed {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    color: #1e40af;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.ennu-checkout-interface-enhanced .patient-status.booked {
    background: linear-gradient(135deg, #e0e7ff 0%, #c7d2fe 100%);
    color: #4338ca;
    border: 1px solid rgba(99, 102, 241, 0.3);
}

.ennu-checkout-interface-enhanced .patient-status.pending,
.ennu-checkout-interface-enhanced .patient-status.pending-payment {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    color: #92400e;
    border: 1px solid rgba(217, 119, 6, 0.3);
}

/* Location Badge in Patient Meta */
.ennu-checkout-interface-enhanced .patient-meta .location-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1);
    padding: 1px 6px;
    border-radius: var(--ennu-radius-sm);
    font-size: 10px;
    font-weight: 500;
    color: var(--ennu-white);
}

.ennu-checkout-interface-enhanced .patient-meta .location-badge.location-in {
    background: #856404;
}

.ennu-checkout-interface-enhanced .patient-meta .location-badge.location-ky {
    background: #28a745;
}

/* ==========================================================================
   BUTTONS (extends luxury-components.css)
   ========================================================================== */

.ennu-checkout-interface-enhanced .ennu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ennu-space-2);
    padding: var(--ennu-space-3) var(--ennu-space-6);
    font-family: var(--ennu-font-sans);
    font-size: var(--ennu-text-sm);
    font-weight: var(--ennu-font-semibold);
    line-height: var(--ennu-leading-normal);
    text-decoration: none;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: var(--ennu-radius-lg);
    transition: all var(--ennu-transition-base);
    min-height: var(--ennu-touch-min);
    -webkit-tap-highlight-color: transparent;
}

.ennu-checkout-interface-enhanced .ennu-btn:focus-visible {
    outline: none;
    box-shadow: var(--ennu-focus-ring);
}

.ennu-checkout-interface-enhanced .ennu-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* Primary Button */
.ennu-checkout-interface-enhanced .ennu-btn-primary {
    color: var(--ennu-white);
    background: var(--ennu-primary-gradient);
    border-color: var(--ennu-primary);
    box-shadow: var(--ennu-shadow-md), var(--ennu-shadow-gold-sm);
}

.ennu-checkout-interface-enhanced .ennu-btn-primary:hover {
    background: var(--ennu-primary-gradient-hover);
    border-color: var(--ennu-primary-light);
    box-shadow: var(--ennu-shadow-lg), var(--ennu-shadow-gold);
    transform: translateY(-1px);
}

.ennu-checkout-interface-enhanced .ennu-btn-primary:active {
    transform: translateY(0);
    box-shadow: var(--ennu-shadow-sm);
}

/* Secondary Button */
.ennu-checkout-interface-enhanced .ennu-btn-secondary {
    color: var(--ennu-primary);
    background: var(--ennu-white);
    border-color: var(--ennu-gray-300);
}

.ennu-checkout-interface-enhanced .ennu-btn-secondary:hover {
    border-color: var(--ennu-primary);
    background: var(--ennu-gold-50);
}

/* Small Button */
.ennu-checkout-interface-enhanced .ennu-btn-small {
    padding: var(--ennu-space-2) var(--ennu-space-4);
    font-size: var(--ennu-text-xs);
    min-height: var(--ennu-btn-height-sm);
}

/* ==========================================================================
   ORDER DETAILS PANEL
   ========================================================================== */

.order-details-panel {
    background: var(--ennu-white);
    border-radius: var(--ennu-radius-xl);
    padding: var(--ennu-space-6);
    box-shadow: var(--ennu-shadow-lg);
    border: 1px solid var(--ennu-gray-200);
}

.order-section {
    margin-bottom: var(--ennu-space-6);
    padding-bottom: var(--ennu-space-6);
    border-bottom: 1px solid var(--ennu-gray-200);
}

.order-section:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.section-title {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-lg);
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-navy);
    margin-bottom: var(--ennu-space-4);
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2);
}

.section-title .dashicons {
    color: var(--ennu-primary);
    font-size: 18px;
}

/* ==========================================================================
   LINE ITEMS
   ========================================================================== */

.line-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--ennu-space-3) var(--ennu-space-4);
    background: var(--ennu-gray-50);
    border-radius: var(--ennu-radius-md);
    margin-bottom: var(--ennu-space-2);
    transition: all var(--ennu-duration-150) ease;
}

.line-item:hover {
    background: var(--ennu-gold-50);
}

.line-item-name {
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-gray-800);
}

.line-item-details {
    font-size: var(--ennu-text-xs);
    color: var(--ennu-gray-500);
}

.line-item-price {
    font-weight: var(--ennu-font-semibold);
    color: var(--ennu-navy);
}

.line-item-actions {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2);
}

/* ==========================================================================
   TOTALS SECTION
   ========================================================================== */

.order-totals {
    background: linear-gradient(135deg, var(--ennu-gray-50) 0%, var(--ennu-gold-50) 100%);
    border-radius: var(--ennu-radius-lg);
    padding: var(--ennu-space-4);
}

.total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ennu-space-2) 0;
}

.total-row.grand-total {
    padding-top: var(--ennu-space-3);
    margin-top: var(--ennu-space-3);
    border-top: 2px solid var(--ennu-gray-200);
}

.total-label {
    font-size: var(--ennu-text-sm);
    color: var(--ennu-gray-600);
}

.total-row.grand-total .total-label {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-lg);
    font-weight: var(--ennu-font-semibold);
    color: var(--ennu-navy);
}

.total-value {
    font-weight: var(--ennu-font-semibold);
    color: var(--ennu-gray-800);
}

.total-row.grand-total .total-value {
    font-size: var(--ennu-text-2xl);
    font-weight: var(--ennu-font-bold);
    color: var(--ennu-primary);
}

/* ==========================================================================
   PAYMENT METHODS
   ========================================================================== */

.payment-methods {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--ennu-space-3);
}

.payment-method {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--ennu-space-2);
    padding: var(--ennu-space-4);
    background: var(--ennu-white);
    border: 2px solid var(--ennu-gray-200);
    border-radius: var(--ennu-radius-lg);
    cursor: pointer;
    transition: all var(--ennu-duration-200) ease;
    min-height: var(--ennu-touch-large);
}

.payment-method:hover {
    border-color: var(--ennu-primary-light);
    background: var(--ennu-gold-50);
}

.payment-method.selected {
    border-color: var(--ennu-primary);
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.05) 100%);
    box-shadow: var(--ennu-shadow-gold-sm);
}

.payment-method-icon {
    font-size: 24px;
    color: var(--ennu-gray-500);
}

.payment-method.selected .payment-method-icon {
    color: var(--ennu-primary);
}

.payment-method-label {
    font-size: var(--ennu-text-sm);
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-gray-700);
    text-align: center;
}

/* ==========================================================================
   FORM INPUTS
   ========================================================================== */

.ennu-checkout-interface-enhanced input[type="text"],
.ennu-checkout-interface-enhanced input[type="email"],
.ennu-checkout-interface-enhanced input[type="number"],
.ennu-checkout-interface-enhanced input[type="tel"],
.ennu-checkout-interface-enhanced select,
.ennu-checkout-interface-enhanced textarea {
    width: 100%;
    padding: var(--ennu-space-3) var(--ennu-space-4);
    font-family: var(--ennu-font-sans);
    font-size: 16px; /* Prevents iOS zoom on focus */
    line-height: var(--ennu-leading-normal);
    color: var(--ennu-gray-800);
    background: var(--ennu-white);
    border: 1px solid var(--ennu-gray-300);
    border-radius: var(--ennu-radius-md);
    transition: all var(--ennu-duration-150) ease;
    min-height: var(--ennu-input-height-md);
    -webkit-appearance: none;
    appearance: none;
}

.ennu-checkout-interface-enhanced input:focus,
.ennu-checkout-interface-enhanced select:focus,
.ennu-checkout-interface-enhanced textarea:focus {
    outline: none;
    border-color: var(--ennu-primary);
    box-shadow: var(--ennu-focus-ring);
}

.ennu-checkout-interface-enhanced input:disabled,
.ennu-checkout-interface-enhanced select:disabled {
    background: var(--ennu-gray-100);
    color: var(--ennu-gray-400);
    cursor: not-allowed;
}

/* ==========================================================================
   BADGES & TAGS
   ========================================================================== */

.badge {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1);
    padding: var(--ennu-space-1) var(--ennu-space-2);
    font-size: var(--ennu-text-2xs);
    font-weight: var(--ennu-font-semibold);
    text-transform: uppercase;
    letter-spacing: var(--ennu-tracking-wide);
    border-radius: var(--ennu-radius-full);
}

.badge-success {
    background: var(--ennu-success-light);
    color: var(--ennu-success);
}

.badge-warning {
    background: var(--ennu-warning-light);
    color: var(--ennu-warning);
}

.badge-error {
    background: var(--ennu-error-light);
    color: var(--ennu-error);
}

.badge-info {
    background: var(--ennu-info-light);
    color: var(--ennu-info);
}

.badge-member {
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.08) 100%);
    color: var(--ennu-primary-dark);
    border: 1px solid var(--ennu-primary-light);
}

/* ==========================================================================
   MODALS
   ========================================================================== */

.ennu-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--ennu-z-modal);
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--ennu-duration-300) ease, visibility var(--ennu-duration-300) ease;
    padding: var(--ennu-safe-top) var(--ennu-safe-right) var(--ennu-safe-bottom) var(--ennu-safe-left);
}

.ennu-modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

.ennu-modal {
    background: var(--ennu-white);
    border-radius: var(--ennu-radius-xl);
    box-shadow: var(--ennu-shadow-2xl);
    max-width: 90vw;
    max-height: 90vh;
    overflow: hidden;
    transform: scale(0.95);
    transition: transform var(--ennu-duration-300) ease;
}

.ennu-modal-overlay.active .ennu-modal {
    transform: scale(1);
}

.ennu-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--ennu-space-5) var(--ennu-space-6);
    border-bottom: 1px solid var(--ennu-gray-200);
    background: linear-gradient(135deg, var(--ennu-navy) 0%, var(--ennu-navy-light) 100%);
    color: var(--ennu-white);
}

.ennu-modal-title {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-xl);
    font-weight: var(--ennu-font-medium);
    margin: 0;
}

.ennu-modal-close {
    width: var(--ennu-touch-min);
    height: var(--ennu-touch-min);
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: var(--ennu-radius-md);
    color: var(--ennu-white);
    cursor: pointer;
    transition: background var(--ennu-duration-150) ease;
}

.ennu-modal-close:hover {
    background: rgba(255, 255, 255, 0.2);
}

.ennu-modal-body {
    padding: var(--ennu-space-6);
    overflow-y: auto;
}

.ennu-modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--ennu-space-3);
    padding: var(--ennu-space-4) var(--ennu-space-6);
    border-top: 1px solid var(--ennu-gray-200);
    background: var(--ennu-gray-50);
}

/* Location Selector Modal - Required for inventory tracking */
#location-selector-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

#location-selector-modal .location-selector-modal-content {
    background: var(--ennu-white);
    border-radius: 16px;
    max-width: 400px;
    width: 100%;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

#location-selector-modal .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--ennu-gray-200);
    background: linear-gradient(135deg, #C9A962 0%, #b8944f 100%);
}

#location-selector-modal .modal-header h3 {
    font-size: 18px;
    font-weight: 600;
    color: #1A2744;
    margin: 0;
}

#location-selector-modal .modal-close {
    background: rgba(26, 39, 68, 0.1);
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1A2744;
    transition: all 0.2s;
}

#location-selector-modal .modal-close:hover {
    background: rgba(26, 39, 68, 0.2);
}

#location-selector-modal .modal-body {
    padding: 24px;
}

#location-selector-modal .location-requirement-notice {
    background: #FEF3C7;
    border: 1px solid #F59E0B;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #92400E;
}

#location-selector-modal .location-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#location-selector-modal .location-option-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border: 2px solid var(--ennu-gray-200);
    border-radius: 12px;
    background: var(--ennu-white);
    cursor: pointer;
    transition: all 0.2s;
}

#location-selector-modal .location-option-btn:hover {
    border-color: #C9A962;
    background: #FFFBF0;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.15);
}

#location-selector-modal .location-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--ennu-gray-800);
}

#location-selector-modal .location-state {
    font-size: 14px;
    color: var(--ennu-gray-500);
    background: var(--ennu-gray-100);
    padding: 4px 10px;
    border-radius: 6px;
}

/* ==========================================================================
   LOADING STATES
   ========================================================================== */

.ennu-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--ennu-space-8);
    color: var(--ennu-gray-500);
}

.ennu-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid var(--ennu-gray-200);
    border-top-color: var(--ennu-primary);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.ennu-loading-text {
    margin-top: var(--ennu-space-4);
    font-size: var(--ennu-text-sm);
}

/* Skeleton loading */
.skeleton {
    background: linear-gradient(90deg, var(--ennu-gray-200) 25%, var(--ennu-gray-100) 50%, var(--ennu-gray-200) 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: var(--ennu-radius-sm);
}

/* ==========================================================================
   EMPTY STATES
   ========================================================================== */

.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--ennu-space-12);
    text-align: center;
    color: var(--ennu-gray-400);
}

.empty-state-icon {
    font-size: 48px;
    margin-bottom: var(--ennu-space-4);
    opacity: 0.5;
}

.empty-state-title {
    font-family: var(--ennu-font-display);
    font-size: var(--ennu-text-xl);
    font-weight: var(--ennu-font-medium);
    color: var(--ennu-gray-600);
    margin-bottom: var(--ennu-space-2);
}

.empty-state-text {
    font-size: var(--ennu-text-sm);
    max-width: 300px;
}

/* ==========================================================================
   NOTIFICATIONS / TOASTS
   ========================================================================== */

.ennu-toast {
    position: fixed;
    bottom: calc(var(--ennu-space-6) + var(--ennu-safe-bottom));
    right: calc(var(--ennu-space-6) + var(--ennu-safe-right));
    z-index: var(--ennu-z-toast);
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3);
    padding: var(--ennu-space-4) var(--ennu-space-5);
    background: var(--ennu-white);
    border-radius: var(--ennu-radius-lg);
    box-shadow: var(--ennu-shadow-xl);
    border-left: 4px solid var(--ennu-success);
    transform: translateX(120%);
    transition: transform var(--ennu-duration-300) var(--ennu-ease-bounce);
}

.ennu-toast.show {
    transform: translateX(0);
}

.ennu-toast.success {
    border-left-color: var(--ennu-success);
}

.ennu-toast.error {
    border-left-color: var(--ennu-error);
}

.ennu-toast.warning {
    border-left-color: var(--ennu-warning);
}

/* ==========================================================================
   PATIENT CARD LOCK INDICATORS - Avatar-based Staff Presence
   Base styles - overridden by more specific selectors at end of file
   ========================================================================== */

.patient-card-lock {
    position: absolute;
    top: 6px;
    right: 6px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px 4px 4px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 600;
    z-index: 10;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.patient-card-lock.lock-other {
    background: rgba(254, 243, 199, 0.95);
    border: 1px solid var(--luxury-gold, #C9A962);
    color: #92400e;
}

.patient-card-lock.lock-self {
    background: rgba(209, 250, 229, 0.95);
    border: 1px solid #10b981;
    color: #065f46;
}

.patient-card-lock .lock-avatar-wrapper {
    position: relative;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.patient-card-lock .lock-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.patient-card-lock .lock-avatar-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--luxury-navy, #1A2744) 0%, #2a3a5a 100%);
    color: var(--luxury-gold, #C9A962);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.patient-card-lock .lock-status-dot {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #fff;
}

.patient-card-lock .lock-status-dot.dot-self {
    background: #22c55e;
    animation: ennu-lock-pulse-green 2s infinite;
}

.patient-card-lock .lock-status-dot.dot-active {
    background: #f59e0b;
    animation: ennu-lock-pulse-gold 2s infinite;
}

.patient-card-lock .lock-name {
    max-width: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    letter-spacing: 0.2px;
}

/* Hide legacy dashicons in new avatar-based system */
.patient-card-lock .dashicons {
    display: none;
}

.patient-card.has-edit-lock {
    opacity: 0.85;
}

.patient-card.has-edit-lock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid var(--ennu-warning);
    border-radius: inherit;
    pointer-events: none;
    z-index: 5;
}

/* ==========================================================================
   ORDER PANEL LOCK INDICATOR
   Shows who's currently editing in the order panel header
   ========================================================================== */

.ennu-order-lock-indicator {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    border-radius: 12px;
    margin-bottom: 16px;
    font-size: 13px;
    font-weight: 500;
    animation: fadeSlideDown 0.3s ease-out;
}

@keyframes fadeSlideDown {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ennu-order-lock-indicator.lock-self {
    background: linear-gradient(135deg, rgba(209, 250, 229, 0.9) 0%, rgba(167, 243, 208, 0.8) 100%);
    border: 1px solid #10b981;
    color: #065f46;
}

.ennu-order-lock-indicator.lock-other {
    background: linear-gradient(135deg, rgba(254, 243, 199, 0.95) 0%, rgba(253, 230, 138, 0.9) 100%);
    border: 1px solid var(--luxury-gold, #C9A962);
    color: #92400e;
}

.ennu-order-lock-indicator .lock-avatar-wrapper {
    position: relative;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
}

.ennu-order-lock-indicator .lock-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.ennu-order-lock-indicator .lock-avatar-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--luxury-navy, #1A2744) 0%, #2a3a5a 100%);
    color: var(--luxury-gold, #C9A962);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 2px solid #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.ennu-order-lock-indicator .lock-status-dot {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #fff;
}

.ennu-order-lock-indicator .lock-status-dot.dot-self {
    background: #22c55e;
    animation: ennu-lock-pulse-green 2s infinite;
}

.ennu-order-lock-indicator .lock-status-dot.dot-active {
    background: #f59e0b;
    animation: ennu-lock-pulse-gold 2s infinite;
}

.ennu-order-lock-indicator .lock-text {
    flex: 1;
    font-weight: 600;
}

.ennu-order-lock-indicator .lock-takeover-btn {
    padding: 6px 14px;
    background: linear-gradient(135deg, var(--luxury-navy, #1A2744) 0%, #2a3a5a 100%);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ennu-order-lock-indicator .lock-takeover-btn:hover {
    background: linear-gradient(135deg, #2a3a5a 0%, var(--luxury-navy, #1A2744) 100%);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(26, 39, 68, 0.3);
}

/* ==========================================================================
   RESPONSIVE - Mobile & iPad
   ========================================================================== */

/* iPad and tablets */
@media (max-width: 1024px) {
    .ennu-checkout-interface-enhanced {
        padding: var(--ennu-space-4);
    }

    .checkout-header {
        padding: var(--ennu-space-4) var(--ennu-space-5);
    }

    .header-title {
        font-size: var(--ennu-text-2xl);
    }
}

/* Phones */
@media (max-width: 768px) {
    .ennu-checkout-interface-enhanced {
        padding: var(--ennu-space-3);
    }

    .checkout-stats-bar {
        padding: var(--ennu-space-3) var(--ennu-space-4);
        gap: var(--ennu-space-2);
    }

    .payment-methods {
        grid-template-columns: repeat(2, 1fr);
    }

    .ennu-checkout-interface-enhanced .ennu-clock {
        padding: var(--ennu-space-2) var(--ennu-space-3);
        gap: var(--ennu-space-2);
    }

    .ennu-checkout-interface-enhanced .ennu-time {
        font-size: var(--ennu-text-lg);
    }

    .patient-card-lock .lock-name {
        display: none;
    }

    .patient-card-lock {
        padding: var(--ennu-space-1) var(--ennu-space-1-5);
    }
}

/* iPhone SE */
@media (max-width: 375px) {
    .order-details-panel {
        padding: var(--ennu-space-4);
    }

    .payment-methods {
        grid-template-columns: 1fr 1fr;
        gap: var(--ennu-space-2);
    }

    .payment-method {
        padding: var(--ennu-space-3);
    }
}

/* Touch device optimizations */
@media (hover: none) and (pointer: coarse) {
    .patient-card:hover {
        transform: none;
    }

    .patient-card:active {
        transform: scale(0.98);
    }

    .line-item:hover {
        background: var(--ennu-gray-50);
    }

    .line-item:active {
        background: var(--ennu-gold-50);
    }
}

/* ==========================================================================
   HEADER FILTERS
   ========================================================================== */

.checkout-header-filters {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
    margin-left: auto;
    flex-wrap: wrap;
}

.checkout-header-select {
    padding: var(--ennu-space-2, 8px) var(--ennu-space-3, 12px);
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-medium, 500);
    color: #374151;
    background: var(--ennu-white, #fff);
    border: 1px solid #d1d5db;
    border-radius: var(--ennu-radius-lg, 8px);
    min-width: 140px;
    cursor: pointer;
    transition: all 150ms ease;
}

.checkout-header-select:hover {
    border-color: #C9A962;
}

.checkout-header-select:focus {
    outline: none;
    border-color: #C9A962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.checkout-header-search {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-3, 12px);
    background: var(--ennu-white, #fff);
    border: 1px solid #d1d5db;
    border-radius: var(--ennu-radius-lg, 8px);
    min-width: 200px;
}

.checkout-header-search .dashicons {
    color: #9ca3af;
    font-size: 16px;
}

.checkout-header-search input {
    border: none;
    background: transparent;
    outline: none;
    font-size: var(--ennu-text-sm, 14px);
    color: #1f2937;
    width: 100%;
}

.checkout-toggle-filter {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-3, 12px);
    background: #f3f4f6;
    border-radius: var(--ennu-radius-lg, 8px);
    cursor: pointer;
    font-size: var(--ennu-text-sm, 14px);
    transition: all 150ms ease;
}

.checkout-toggle-filter:hover {
    background: #e5e7eb;
}

.toggle-label {
    color: #4b5563;
    font-weight: var(--ennu-font-medium, 500);
    white-space: nowrap;
}

.toggle-icon {
    color: #9ca3af;
}

.checkout-date-range-bar {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-3, 12px) var(--ennu-space-6, 24px);
    background: var(--ennu-gold-50, #fffbeb);
    border-bottom: 1px solid var(--ennu-gold-200, #fde68a);
}

.checkout-date-input {
    padding: var(--ennu-space-2, 8px) var(--ennu-space-3, 12px);
    font-size: var(--ennu-text-sm, 14px);
    border: 1px solid #d1d5db;
    border-radius: var(--ennu-radius-md, 6px);
    background: var(--ennu-white, #fff);
}

.checkout-date-input:focus {
    outline: none;
    border-color: #C9A962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.date-separator {
    color: #6b7280;
    font-size: var(--ennu-text-sm, 14px);
}

/* ==========================================================================
   CHECKOUT DATE RANGE TABS (header tabs: Today, This Week, etc.)
   ========================================================================== */

/* Main tabs container - used for date range filter */
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-3, 12px) var(--ennu-space-6, 24px);
    background: var(--ennu-white, #fff);
    border-bottom: 1px solid #e5e7eb;
}

/* Date range tabs - pill buttons */
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .checkout-tab,
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .ennu-tab {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-4, 16px);
    font-size: var(--ennu-text-sm, 14px);
    font-weight: 500;
    color: #4b5563;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-full, 9999px);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
    white-space: nowrap;
    flex-shrink: 0;
    height: auto;
    min-height: 40px;
}

.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .checkout-tab:hover,
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .ennu-tab:hover {
    background: #e5e7eb;
    color: #1f2937;
    border-color: #d1d5db;
}

.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .checkout-tab.active,
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .ennu-tab.active {
    background: var(--ennu-navy, #1a2744);
    color: var(--ennu-white, #fff);
    border-color: var(--ennu-navy, #1a2744);
}

/* Inline filters container within tabs row */
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs > .checkout-header-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
    margin-left: auto;
    flex-shrink: 0;
}

/* ==========================================================================
   CONTENT TABS (Treatments, Gratuity, Notes, Follow-up)
   ========================================================================== */

/* Content tabs in the center panel */
.ennu-checkout-interface-enhanced #checkout-main-content .checkout-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-4, 16px) 0;
    background: transparent;
    border-bottom: none;
    margin-bottom: var(--ennu-space-4, 16px);
}

.ennu-checkout-interface-enhanced #checkout-main-content .checkout-tab {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-4, 16px);
    font-size: var(--ennu-text-sm, 14px);
    font-weight: 500;
    color: #4b5563;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-lg, 8px);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
    white-space: nowrap;
}

.ennu-checkout-interface-enhanced #checkout-main-content .checkout-tab:hover {
    background: #e5e7eb;
    color: #1f2937;
    border-color: #d1d5db;
}

.ennu-checkout-interface-enhanced #checkout-main-content .checkout-tab.active {
    background: var(--ennu-navy, #1a2744);
    color: var(--ennu-white, #fff);
    border-color: var(--ennu-navy, #1a2744);
}

.checkout-tab-content {
    display: none;
}

.checkout-tab-content.active {
    display: block;
}

.tab-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    font-size: 11px;
    font-weight: 700;
    background: #e5e7eb;
    color: #4b5563;
    border-radius: 9999px;
}

.checkout-tab.active .tab-badge {
    background: rgba(255, 255, 255, 0.2);
    color: var(--ennu-white, #fff);
}

/* ==========================================================================
   STATS BAR
   ========================================================================== */

.ennu-checkout-interface-enhanced .checkout-stats-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: var(--ennu-space-4, 16px);
    padding: var(--ennu-space-4, 16px) var(--ennu-space-6, 24px);
    background: linear-gradient(180deg, #f9fafb 0%, var(--ennu-white, #fff) 100%);
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: var(--ennu-space-4, 16px);
}

.ennu-checkout-interface-enhanced .stat-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--ennu-space-1, 4px);
    padding: var(--ennu-space-3, 12px) var(--ennu-space-5, 20px);
    background: var(--ennu-white, #fff);
    border: 1px solid #e5e7eb;
    border-left: 4px solid #d1d5db;
    border-radius: var(--ennu-radius-lg, 8px);
    min-width: 130px;
    transition: all var(--ennu-duration-150, 150ms) ease;
    box-shadow: var(--ennu-shadow-sm, 0 1px 2px rgba(0,0,0,0.05));
}

.ennu-checkout-interface-enhanced .stat-badge:hover {
    box-shadow: var(--ennu-shadow-md, 0 4px 6px rgba(0,0,0,0.1));
    transform: translateY(-1px);
}

.ennu-checkout-interface-enhanced .stat-badge.active {
    border-left-color: #059669;
    background: linear-gradient(135deg, rgba(5, 150, 105, 0.08) 0%, rgba(5, 150, 105, 0.03) 100%);
}

.ennu-checkout-interface-enhanced .stat-badge.warning {
    border-left-color: var(--ennu-warning, #d97706);
    background: linear-gradient(135deg, rgba(217, 119, 6, 0.08) 0%, rgba(217, 119, 6, 0.03) 100%);
}

.ennu-checkout-interface-enhanced .stat-badge.info {
    border-left-color: var(--ennu-info, #3b82f6);
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.08) 0%, rgba(59, 130, 246, 0.03) 100%);
}

.ennu-checkout-interface-enhanced .stat-value {
    font-family: var(--ennu-font-display, 'Playfair Display', Georgia, serif);
    font-size: var(--ennu-text-2xl, 24px);
    font-weight: var(--ennu-font-bold, 700);
    color: var(--ennu-navy, #1a2744);
    line-height: 1;
}

.ennu-checkout-interface-enhanced .stat-badge.active .stat-value { 
    color: #059669; 
}

.ennu-checkout-interface-enhanced .stat-badge.warning .stat-value { 
    color: var(--ennu-warning, #d97706); 
}

.ennu-checkout-interface-enhanced .stat-badge.info .stat-value { 
    color: var(--ennu-info, #3b82f6); 
}

.ennu-checkout-interface-enhanced .stat-label {
    font-size: var(--ennu-text-xs, 12px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-align: center;
}

/* ==========================================================================
   AUTOSAVE STATUS
   ========================================================================== */

.ennu-autosave-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    background: linear-gradient(135deg, #f9fafb 0%, rgba(201, 169, 98, 0.08) 100%);
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    margin-bottom: 16px;
    font-size: 12px;
    transition: all 200ms ease;
}

.ennu-autosave-status.saving {
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.08) 100%);
    border-color: #e5d4a1;
}

.ennu-autosave-status.saved {
    background: linear-gradient(135deg, rgba(76, 175, 80, 0.08) 0%, rgba(76, 175, 80, 0.04) 100%);
    border-color: rgba(76, 175, 80, 0.2);
}

.autosave-indicator {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6b7280;
}

.autosave-icon {
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.autosave-icon::before {
    content: '✓';
    color: #059669;
}

.ennu-autosave-status.saving .autosave-icon::before {
    content: '';
    width: 12px;
    height: 12px;
    border: 2px solid #C9A962;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.autosave-text {
    font-weight: 500;
    color: #1f2937;
}

.ennu-autosave-status.saving .autosave-text { color: #C9A962; }
.ennu-autosave-status.saved .autosave-text { color: #059669; }

.autosave-time {
    font-size: 11px;
    color: #9ca3af;
}

.autosave-user {
    font-size: 11px;
    color: #6b7280;
}

.autosave-meta {
    display: flex;
    align-items: center;
    gap: 12px;
}

.autosave-divider {
    width: 1px;
    height: 16px;
    background: #d1d5db;
}

/* ==========================================================================
   PAYMENT METHODS
   ========================================================================== */

.payment-methods {
    margin-bottom: 20px;
}

.payment-methods h4 {
    font-size: 16px;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ennu-checkout-interface-enhanced .payment-method-card {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-3-5, 14px) var(--ennu-space-4, 16px);
    background: var(--ennu-white, #fff);
    border: 2px solid #e5e7eb;
    border-radius: var(--ennu-radius-lg, 10px);
    cursor: pointer;
    transition: all var(--ennu-duration-200, 200ms) ease;
    margin-bottom: var(--ennu-space-2-5, 10px);
}

.ennu-checkout-interface-enhanced .payment-method-card:hover {
    border-color: #C9A962;
    background: var(--ennu-gold-50, #fffbeb);
}

.ennu-checkout-interface-enhanced .payment-method-card.selected {
    border-color: #C9A962;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.05) 100%);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.ennu-checkout-interface-enhanced .payment-icon {
    font-size: 24px;
    color: #6b7280;
    flex-shrink: 0;
    transition: color var(--ennu-duration-150, 150ms) ease;
}

.ennu-checkout-interface-enhanced .payment-method-card:hover .payment-icon {
    color: #C9A962;
}

.ennu-checkout-interface-enhanced .payment-method-card.selected .payment-icon {
    color: #C9A962;
}

.ennu-checkout-interface-enhanced .payment-details {
    flex: 1;
    min-width: 0;
}

.ennu-checkout-interface-enhanced .payment-type {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #1f2937;
    margin-bottom: 2px;
}

.ennu-checkout-interface-enhanced .payment-meta {
    font-size: var(--ennu-text-xs, 12px);
    color: #6b7280;
}

.ennu-checkout-interface-enhanced .payment-badge {
    font-size: 10px;
    font-weight: var(--ennu-font-bold, 700);
    padding: 2px 8px;
    border-radius: var(--ennu-radius-sm, 4px);
    text-transform: uppercase;
}

/* Saved Payment Methods */
.ennu-checkout-interface-enhanced .saved-payment-methods {
    margin-bottom: var(--ennu-space-5, 20px);
}

.ennu-checkout-interface-enhanced .saved-card {
    position: relative;
}

.ennu-checkout-interface-enhanced .saved-card.default::after {
    content: 'Default';
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 10px;
    font-weight: var(--ennu-font-semibold, 600);
    padding: 2px 6px;
    background: #C9A962;
    color: var(--ennu-white, #fff);
    border-radius: var(--ennu-radius-sm, 4px);
}

.ennu-checkout-interface-enhanced .use-new-card-option {
    margin-top: var(--ennu-space-2-5, 10px);
    padding-top: var(--ennu-space-2-5, 10px);
    border-top: 1px solid #e5e7eb;
}

/* ==========================================================================
   PAYMENT SECTION - CREDITS FIRST UX
   ========================================================================== */

.ennu-payment-section {
    padding: 20px 0 0 0;
    margin-top: 20px;
    border-top: 2px solid #e5e7eb;
}

/* Section Headers */
.payment-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 700;
    color: #1e3a5f;
    margin: 0 0 12px 0;
    padding: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.payment-section-header .dashicons {
    font-size: 16px;
    color: #c9a962;
}

.remaining-balance-amount {
    margin-left: auto;
    font-size: 16px;
    font-weight: 800;
    color: #c9a962;
    text-transform: none;
    letter-spacing: 0;
}

/* Credits Section */
.payment-credits-section {
    margin: 0 12px 12px 12px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
}

.payment-credits-section:empty,
.payment-credits-section:has(#no-credits-message:only-child) {
    display: none;
}

/* ==========================================================================
   UNIFIED MEMBER CREDITS SECTION
   ========================================================================== */

.member-credits-section {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    margin: 0 12px 16px 12px;
    transition: all 0.3s ease;
}

.member-credits-section.has-credits {
    background: linear-gradient(135deg, #fefce8 0%, #fffbeb 100%);
    border-color: #c9a962;
    box-shadow: 0 2px 8px rgba(201, 169, 98, 0.15);
}

.member-credits-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}

.member-credits-section.has-credits .member-credits-header {
    border-bottom-color: rgba(201, 169, 98, 0.3);
}

.member-credits-icon {
    font-size: 18px;
}

.member-credits-title {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937 !important;
    flex: 1;
}

.member-credits-total-badge {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    color: white;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 12px;
}

.member-credits-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Credit Cards (ENNU Balance / Gift Cards) */
.credit-card-unified {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 12px 14px;
    transition: all 0.2s ease;
    color: #1f2937; /* Ensure dark text for visibility */
}

.credit-card-unified:hover {
    border-color: #c9a962;
}

.credit-card-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.credit-card-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.credit-card-icon {
    font-size: 20px;
    line-height: 1;
}

.credit-card-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.credit-card-name {
    font-size: 13px;
    font-weight: 600;
    color: #1f2937 !important;
}

.credit-card-status {
    font-size: 11px;
    color: #6b7280 !important;
}

.credit-card-amount {
    font-size: 18px;
    font-weight: 800;
    color: #059669 !important;
}

.credit-card-actions {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #e5e7eb;
}

.credit-apply-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #374151 !important;
    cursor: pointer;
}

.credit-apply-checkbox input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #c9a962;
}

.credit-amount-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.credit-amount-wrap {
    display: flex;
    align-items: center;
    background: #f9fafb;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 0 10px;
    flex: 1;
}

.credit-amount-wrap span {
    color: #6b7280;
    font-weight: 600;
}

.credit-amount-wrap input {
    border: none;
    background: transparent;
    padding: 8px;
    font-size: 14px;
    font-weight: 600;
    width: 80px;
    outline: none;
}

.btn-credit-full {
    padding: 8px 14px;
    background: #1e3a5f;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-credit-full:hover {
    background: #2d4a6f;
}

/* Apply Credit Button */
.btn-credit-apply {
    padding: 8px 16px;
    background: linear-gradient(135deg, #28a745, #218838);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 6px;
}

.btn-credit-apply:hover {
    background: linear-gradient(135deg, #218838, #1e7e34);
    transform: translateY(-1px);
}

.btn-credit-apply:disabled {
    opacity: 0.7;
    cursor: wait;
}

.btn-credit-apply .spinner {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

/* Credit Applied Success Message */
.credit-applied-msg {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    border: 1px solid #28a745;
    border-radius: 8px;
    color: #155724;
    font-size: 13px;
    font-weight: 600;
    margin-top: 10px;
}

.credit-applied-msg .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: #28a745;
}

/* ====================================
   SAVED CARD DISPLAY BLOCK
   ==================================== */
.saved-card-display {
    margin-top: 15px;
    display: none;
}

.saved-card-block {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.saved-card-block:hover {
    background: #f1f3f5;
    border-color: #d1d5db;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.saved-card-block.selected {
    border: 2px solid #c9a962;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.08) 0%, rgba(201, 169, 98, 0.04) 100%);
    box-shadow: 0 0 0 2px rgba(201, 169, 98, 0.15);
}

.saved-card-logo {
    flex-shrink: 0;
}

.saved-card-logo svg {
    display: block;
    border-radius: 3px;
    width: 32px;
    height: 22px;
}

.saved-card-details {
    flex: 1;
    min-width: 0;
}

.saved-card-brand {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6b7280;
    margin-bottom: 2px;
    font-weight: 500;
}

.saved-card-number {
    font-size: 13px;
    font-family: 'Courier New', monospace;
    letter-spacing: 1px;
    color: #1f2937;
    font-weight: 600;
}

.saved-card-selected {
    display: none;
    flex-shrink: 0;
}

.saved-card-block.selected .saved-card-selected {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #c9a962;
    border-radius: 50%;
}

.saved-card-selected .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: #fff;
}

.saved-card-block .new-card-badge {
    position: absolute;
    top: -8px;
    right: 12px;
    background: linear-gradient(135deg, #28a745, #218838);
    color: white;
    font-size: 10px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: pulse-badge 2s ease-in-out infinite;
}

@keyframes pulse-badge {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Animation for new card */
.saved-card-block.new-card-highlight {
    animation: card-slide-in 0.4s ease-out;
}

@keyframes card-slide-in {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Saved card expiry */
.saved-card-expiry {
    font-size: 10px;
    color: #9ca3af;
    margin-top: 1px;
}

/* Saved card display area */
.saved-card-display {
    margin-bottom: 16px;
}

/* Other saved cards (if multiple) */
.other-saved-cards {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.other-saved-cards .saved-card-block {
    padding: 12px 16px;
    background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.other-saved-cards .saved-card-block:hover {
    background: linear-gradient(135deg, #1e3a5f 0%, #2d4a6f 100%);
}

.other-saved-cards .saved-card-number {
    font-size: 14px;
}

/* Add another card link */
.add-another-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    padding: 10px 16px;
    color: #c9a962;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    background: rgba(201, 169, 98, 0.1);
    border: 1px dashed rgba(201, 169, 98, 0.4);
    border-radius: 8px;
    transition: all 0.2s ease;
}

.add-another-card-link:hover {
    background: rgba(201, 169, 98, 0.2);
    border-color: #c9a962;
    color: #c9a962;
    text-decoration: none;
}

.add-another-card-link .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* No Credits Message */
.no-credits-message {
    text-align: center;
    padding: 16px;
    color: #9ca3af;
}

.no-credits-text {
    font-size: 13px;
    font-style: italic;
}

/* No Balance State - dimmed cards when balance is $0 */
.credit-card-unified.no-balance {
    opacity: 0.7;
    background: #f9fafb;
}

.credit-card-unified.no-balance .credit-card-amount {
    color: #9ca3af;
}

.credit-card-unified.no-balance .credit-card-actions {
    opacity: 0.6;
}

.credit-card-unified.no-balance .credit-apply-checkbox {
    pointer-events: none;
    opacity: 0.5;
}

.credit-card-unified.no-balance input:disabled,
.credit-card-unified.no-balance button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

/* Gift Card Redeem Section */
.giftcard-redeem-section {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
}

.redeem-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 0;
}

.redeem-header-toggle {
    cursor: pointer;
    padding: 8px 10px;
    margin: -8px -10px;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.redeem-header-toggle:hover {
    background: rgba(201, 169, 98, 0.1);
}

.redeem-icon {
    font-size: 14px;
}

.redeem-text {
    font-size: 12px;
    color: #6b7280 !important;
    font-weight: 500;
    flex: 1;
}

.redeem-toggle-icon {
    font-size: 10px;
    color: #9ca3af;
    transition: transform 0.2s ease;
}

/* Redeem input wrapper (collapsible) */
.redeem-input-wrapper {
    margin-top: 10px;
}

.redeem-input-row {
    display: flex;
    gap: 8px;
}

.redeem-input {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.redeem-input:focus {
    outline: none;
    border-color: #c9a962;
}

.btn-redeem {
    padding: 10px 18px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-redeem:hover {
    background: linear-gradient(135deg, #047857 0%, #065f46 100%);
}

.btn-redeem:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

.redeem-message {
    margin-top: 8px;
    font-size: 12px;
    min-height: 18px;
}

/* Applied Credits Section */
.applied-credits-section {
    margin-top: 12px;
    padding: 12px;
    background: linear-gradient(135deg, #dcfce7 0%, #d1fae5 100%);
    border: 1px solid #86efac;
    border-radius: 10px;
}

.applied-credits-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
}

.applied-credits-header .dashicons {
    color: #059669;
    font-size: 16px;
}

.applied-credits-header span:nth-child(2) {
    flex: 1;
    font-size: 12px;
    font-weight: 700;
    color: #166534;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.applied-credits-amount {
    font-size: 16px;
    font-weight: 800;
    color: #059669;
}

.applied-credits-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.applied-credit-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    background: white;
    border-radius: 8px;
    font-size: 13px;
}

.applied-credit-icon {
    font-size: 14px;
}

.applied-credit-name {
    flex: 1;
    font-weight: 500;
    color: #166534;
}

.applied-credit-amount {
    font-weight: 700;
    color: #059669;
}

.btn-remove-credit {
    background: none;
    border: none;
    color: #dc2626;
    font-size: 18px;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}

.btn-remove-credit:hover {
    color: #b91c1c;
}

/* Legacy - Keep for backwards compatibility */
.available-balances-summary {
    display: none; /* Hidden - replaced by member-credits-section */
}

.balances-summary-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}

.has-balances .balances-summary-header {
    color: #92400e;
    border-bottom-color: rgba(201, 169, 98, 0.3);
}

.balances-summary-header .dashicons {
    font-size: 16px;
    color: #9ca3af;
}

.has-balances .balances-summary-header .dashicons {
    color: #c9a962;
}

.balances-summary-items {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.balance-summary-item {
    background: #ffffff;
    border: 1px solid rgba(201, 169, 98, 0.3);
    border-radius: 8px;
    padding: 12px 16px;
    flex: 1;
    min-width: 140px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.balance-summary-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.balance-summary-icon {
    font-size: 18px;
    line-height: 1;
    flex-shrink: 0;
}

.balance-summary-label {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

.balance-summary-amount {
    font-size: 16px;
    font-weight: 700;
    color: #059669;
}

.balance-summary-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.no-balances-message {
    text-align: center;
    padding: 8px 16px;
}

.no-balances-text {
    font-size: 13px;
    color: #9ca3af;
    font-style: italic;
}

/* Hide no balances message when there are items */
.balances-summary-items:has(.balance-summary-item:not([style*="display: none"])) .no-balances-message {
    display: none;
}

/* Credit Balance Cards */
.credit-balance-card {
    background: linear-gradient(135deg, #1a2a4a 0%, #2c4a7c 100%);
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 12px;
}

.credit-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.credit-card-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.credit-card-icon {
    font-size: 24px;
}

.credit-card-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.credit-card-name {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
}

.credit-card-status {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
}

.credit-card-balance {
    font-size: 24px;
    font-weight: 800;
    color: #c9a962;
}

.credit-card-controls {
    padding: 16px 20px;
    background: rgba(255, 255, 255, 0.05);
}

.credit-apply-toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    margin-bottom: 0;
}

.credit-toggle-checkbox {
    width: 20px;
    height: 20px;
    accent-color: #c9a962;
    cursor: pointer;
}

.credit-toggle-label {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
}

.credit-amount-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
}

.credit-amount-input-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 0 12px;
}

.credit-currency {
    font-size: 18px;
    font-weight: 700;
    color: #c9a962;
}

.credit-amount-input {
    flex: 1;
    background: transparent;
    border: none;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    text-align: right;
    padding: 12px 8px;
    outline: none;
    min-width: 0;
}

.credit-amount-input::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.credit-use-full-btn,
.credit-apply-btn {
    padding: 12px 16px;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.credit-use-full-btn {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border: 2px solid rgba(255, 255, 255, 0.3);
}

.credit-use-full-btn:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.5);
}

.credit-apply-btn {
    background: #c9a962;
    color: #1a2a4a;
}

.credit-apply-btn:hover {
    background: #d4b872;
}

.credit-remaining-info {
    margin-top: 12px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
}

.credit-remaining-info strong {
    color: #fff;
    font-weight: 700;
}

.credit-redeem-link {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.credit-redeem-toggle-link {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #c9a962;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.2s ease;
}

.credit-redeem-toggle-link:hover {
    color: #d4b872;
}

.credit-redeem-form {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.credit-code-input {
    flex: 1;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    color: #fff;
    font-size: 14px;
    outline: none;
    transition: border-color 0.2s ease;
}

.credit-code-input:focus {
    border-color: #c9a962;
}

.credit-code-input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.credit-redeem-btn {
    padding: 10px 20px;
    background: #c9a962;
    color: #1a2a4a;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease;
    white-space: nowrap;
}

.credit-redeem-btn:hover {
    background: #d4b872;
}

.credit-code-message {
    margin-top: 8px;
    font-size: 13px;
}

/* No Credits Placeholder */
.no-credits-placeholder {
    display: none; /* Hidden by default - only shown when no patient or no credits */
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    background: #f8f9fa;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    margin-bottom: 12px;
}

.no-credits-placeholder.show {
    display: flex;
}

.no-credits-icon {
    font-size: 16px;
    opacity: 0.4;
}

.no-credits-text {
    font-size: 13px;
    color: #9ca3af;
}

/* Applied Credits Summary */
.applied-credits-summary {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 1px solid #6ee7b7;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 16px;
}

.applied-credits-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.applied-credits-header .dashicons {
    font-size: 16px;
    color: #059669;
}

.applied-credits-header span:nth-child(2) {
    font-size: 13px;
    font-weight: 700;
    color: #065f46;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.total-credits-amount {
    margin-left: auto;
    font-size: 16px;
    font-weight: 800;
    color: #059669;
}

.applied-credits-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.applied-credit-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 6px;
}

.applied-credit-name {
    font-size: 13px;
    font-weight: 600;
    color: #065f46;
}

.applied-credit-amount {
    font-size: 14px;
    font-weight: 700;
    color: #059669;
}

.applied-credit-remove {
    background: none;
    border: none;
    padding: 4px 8px;
    font-size: 12px;
    color: #dc2626;
    cursor: pointer;
    border-radius: 4px;
    transition: background 0.2s ease;
}

.applied-credit-remove:hover {
    background: rgba(220, 38, 38, 0.1);
}

/* ==========================================================================
   GIFTUP SECTION (DEPRECATED - Now in member-credits-section)
   ========================================================================== */

.giftup-section {
    display: none !important; /* Replaced by unified member-credits-section */
}

.giftup-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.giftup-icon {
    font-size: 20px;
}

.giftup-title {
    font-size: 15px;
    font-weight: 700;
    color: #92400e;
}

.giftup-balance-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
    margin-bottom: 12px;
}

.giftup-balance-label {
    font-size: 13px;
    font-weight: 500;
    color: #78350f;
}

.giftup-balance-amount {
    font-size: 18px;
    font-weight: 700;
    color: #92400e;
}

.giftup-apply-controls {
    padding: 12px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 8px;
    margin-bottom: 12px;
}

.giftup-apply-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.giftup-toggle-checkbox {
    width: 18px;
    height: 18px;
    accent-color: #f59e0b;
}

.giftup-toggle-label {
    font-size: 14px;
    font-weight: 600;
    color: #78350f;
}

.giftup-amount-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed #f59e0b;
}

.giftup-amount-input-wrap {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid #d97706;
    border-radius: 6px;
    padding: 0 10px;
    flex: 1;
}

.giftup-currency {
    font-size: 14px;
    font-weight: 600;
    color: #92400e;
    margin-right: 4px;
}

.giftup-amount-input {
    border: none;
    outline: none;
    padding: 8px 0;
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    width: 100%;
    background: transparent;
}

.giftup-use-full-btn {
    padding: 8px 14px;
    background: #f59e0b;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.giftup-use-full-btn:hover {
    background: #d97706;
}

/* Redeem Section */
.giftup-redeem-section {
    border-top: 1px solid rgba(245, 158, 11, 0.3);
    padding-top: 12px;
}

.giftup-redeem-header {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 6px 0;
}

.giftup-redeem-icon {
    font-size: 16px;
}

.giftup-redeem-text {
    font-size: 13px;
    font-weight: 500;
    color: #78350f;
    flex: 1;
}

.giftup-toggle-redeem-btn {
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: #92400e;
    transition: transform 0.2s ease;
}

.giftup-toggle-redeem-btn.active {
    transform: rotate(180deg);
}

.giftup-toggle-redeem-btn .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.giftup-redeem-form {
    margin-top: 10px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
}

.giftup-redeem-input-row {
    display: flex;
    gap: 8px;
}

.giftup-redeem-input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid #d97706;
    border-radius: 6px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.giftup-redeem-input:focus {
    outline: none;
    border-color: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2);
}

.giftup-redeem-btn {
    padding: 10px 20px;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.giftup-redeem-btn:hover {
    background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
    transform: translateY(-1px);
}

.giftup-redeem-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.giftup-redeem-message {
    margin-top: 10px;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
}

.giftup-redeem-message.success {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #22c55e;
}

.giftup-redeem-message.error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #ef4444;
}

.giftup-redeem-message:empty {
    display: none;
}

/* Payment Methods Section */
.payment-methods-section {
    margin-bottom: 20px;
}

/* Payment Methods Grid - two-row layout for narrow panels */
.payment-methods-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    margin-bottom: 12px;
}

/* Payment Method Tiles */
.payment-method-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 8px 4px;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
    min-height: 48px;
    position: relative;
}

.payment-method-tile:hover {
    border-color: #c9a962;
    background: #fffbeb;
}

.payment-method-tile.selected {
    border-color: #c9a962;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.08) 100%);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.2);
}

.payment-method-tile.payment-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.payment-tile-icon {
    font-size: 18px;
    width: 18px;
    height: 18px;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
    color: #6b7280;
    transition: color 0.2s ease;
}

.payment-tile-icon.dashicons {
    font-family: dashicons;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
}

.payment-method-tile:hover .payment-tile-icon,
.payment-method-tile.selected .payment-tile-icon {
    color: #c9a962;
}

.payment-tile-name {
    font-size: 11px;
    font-weight: 600;
    color: #374151;
    text-align: center;
    line-height: 1.2;
}

.payment-tile-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 9px;
    font-weight: 700;
    padding: 2px 5px;
    background: #c9a962;
    color: #fff;
    border-radius: 4px;
}

.payment-tile-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.payment-tile-balance {
    font-size: 10px;
    font-weight: 700;
    color: #059669;
}

/* Reward Tiles */
.reward-tile {
    border-color: #e5e7eb;
}

.reward-tile:hover {
    border-color: currentColor;
}

.reward-tile.selected {
    box-shadow: 0 0 0 3px currentColor;
    opacity: 0.3;
}

/* Saved Cards Dropdown */
.saved-cards-dropdown {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.saved-cards-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.saved-card-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: #f9fafb;
    border: 2px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.saved-card-option:hover {
    border-color: #c9a962;
    background: #fffbeb;
}

.saved-card-option.selected {
    border-color: #c9a962;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.05) 100%);
}

.saved-card-brand {
    font-size: 20px;
}

.saved-card-details {
    flex: 1;
}

.saved-card-number {
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
}

.saved-card-expiry {
    font-size: 12px;
    color: #6b7280;
}

/* Payment Input Containers */
.payment-input-container {
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 12px;
    margin-top: 8px;
}

/* Stripe Card Container */
#stripe-card-container {
    background: linear-gradient(135deg, #f8f9ff 0%, #f0f1ff 100%);
    border-color: #c7d2fe;
}

/* Stripe Card Input */
.stripe-card-element {
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    min-height: 24px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.stripe-card-element:focus-within,
.stripe-card-element.StripeElement--focus {
    border-color: #635bff;
    box-shadow: 0 0 0 3px rgba(99, 91, 255, 0.15);
}

.stripe-card-element.StripeElement--invalid {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.stripe-card-element.StripeElement--complete {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.1);
}

.stripe-card-errors {
    color: #dc2626;
    font-size: 13px;
    margin-top: 8px;
    display: none;
}

.stripe-card-errors:not(:empty) {
    display: block;
}

/* Card valid indicator */
.stripe-card-valid {
    color: #059669;
    font-size: 13px;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.stripe-card-valid .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: #059669;
}

/* Save card actions container */
.stripe-save-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
}

/* Save card button */
.btn-save-card {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-save-card:hover:not(:disabled) {
    background: linear-gradient(135deg, #047857 0%, #065f46 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.3);
}

.btn-save-card:disabled {
    background: #d1d5db;
    color: #9ca3af;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.btn-save-card .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.btn-save-card .spinner {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.save-card-option {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #6b7280;
    cursor: pointer;
    margin-top: 12px;
}

.save-card-option input {
    width: 16px;
    height: 16px;
}

.stripe-secure-note {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    font-size: 12px;
    color: #6b7280;
}

.stripe-secure-note .dashicons {
    font-size: 16px;
}

.stripe-not-configured {
    text-align: center;
    padding: 20px;
}

.stripe-not-configured .dashicons {
    font-size: 32px;
    color: #fbbf24;
    margin-bottom: 10px;
}

.stripe-not-configured h4 {
    margin: 0 0 8px;
    color: #1f2937;
    font-size: 16px;
}

.stripe-not-configured p {
    margin: 0 0 15px;
    color: #6b7280;
    font-size: 14px;
}

.btn-configure-stripe {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #635bff;
    color: #fff;
    padding: 10px 20px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: background 0.2s ease;
}

.btn-configure-stripe:hover {
    background: #4f46e5;
    color: #fff;
}

/* Cash Input Container */
.cash-input-container {
    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
    border-color: #10b981;
}

.cash-amount-due {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px;
    background: #fff;
    border-radius: 8px;
    margin-bottom: 16px;
}

.cash-label {
    font-size: 14px;
    font-weight: 600;
    color: #065f46;
}

.cash-amount {
    font-size: 24px;
    font-weight: 800;
    color: #065f46;
}

.cash-tendered-row {
    margin-bottom: 16px;
}

.cash-tendered-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #065f46;
    margin-bottom: 8px;
}

.cash-tendered-input-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 2px solid #10b981;
    border-radius: 8px;
    padding: 0 14px;
}

.cash-currency {
    font-size: 20px;
    font-weight: 700;
    color: #065f46;
}

.cash-tendered-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 20px;
    font-weight: 700;
    text-align: right;
    padding: 12px 0;
    outline: none;
    color: #065f46;
}

.quick-cash-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.quick-cash-btn {
    flex: 1;
    min-width: 60px;
    padding: 10px 12px;
    border: 2px solid #10b981;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #fff;
    color: #065f46;
}

.quick-cash-btn:hover {
    background: #10b981;
    color: #fff;
}

.quick-cash-btn[data-amount="exact"],
.quick-cash-btn.exact-btn {
    background: #10b981;
    color: #fff;
    min-width: 70px;
}

.quick-cash-btn.clear-btn {
    background: #ef4444;
    color: #fff;
    min-width: 60px;
}

.quick-cash-btn.clear-btn:hover {
    background: #dc2626;
}

.quick-cash-label {
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 8px;
    font-weight: 500;
}

/* Cash Drawer Closed Warning */
.cash-drawer-closed-warning {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 8px;
    margin-bottom: 16px;
    color: #92400e;
    font-size: 14px;
}

.cash-drawer-closed-warning .dashicons {
    color: #f59e0b;
    font-size: 20px;
}

.cash-drawer-closed-warning a {
    color: #c9a962;
    font-weight: 600;
    text-decoration: underline;
}

.cash-drawer-closed-warning a:hover {
    color: #a38b51;
}

/* Cash Drawer Badge on Payment Tile */
.cash-drawer-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    font-size: 9px;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 4px;
    text-transform: uppercase;
    background: #fef3c7;
    color: #92400e;
}

.cash-drawer-badge.status-open {
    background: #d1fae5;
    color: #065f46;
}

.cash-drawer-badge.status-closed {
    background: #fee2e2;
    color: #991b1b;
}

/* Inline Cash Drawer Status (inside cash payment section) */
.cash-drawer-inline-status {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border: 1px solid #86efac;
    border-radius: 10px;
    padding: 12px 16px;
    margin-bottom: 16px;
}

.drawer-inline-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.drawer-inline-icon {
    font-size: 18px;
}

.drawer-inline-title {
    font-weight: 600;
    color: #166534;
    font-size: 14px;
    flex: 1;
}

.drawer-inline-badge {
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
}

.drawer-inline-badge.status-open {
    background: #22c55e;
    color: white;
}

.drawer-inline-badge.status-closed {
    background: #fbbf24;
    color: #78350f;
}

.drawer-inline-badge.status-unknown {
    background: #e5e7eb;
    color: #6b7280;
}

.drawer-inline-info {
    display: flex;
    gap: 20px;
    margin-bottom: 10px;
}

.drawer-inline-row {
    display: flex;
    gap: 6px;
    font-size: 13px;
}

.drawer-inline-label {
    color: #6b7280;
}

.drawer-inline-value {
    font-weight: 600;
    color: #166534;
}

.drawer-inline-actions {
    display: flex;
    gap: 8px;
}

.btn-drawer-inline {
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-drawer-inline.btn-drawer-open {
    background: #22c55e;
    color: white;
}

.btn-drawer-inline.btn-drawer-open:hover {
    background: #16a34a;
}

.btn-drawer-inline.btn-drawer-close {
    background: #f59e0b;
    color: #78350f;
}

.btn-drawer-inline.btn-drawer-close:hover {
    background: #d97706;
}

/* Payment tile disabled state */
.payment-method-tile.payment-disabled {
    opacity: 0.6;
    cursor: not-allowed;
    position: relative;
}

.payment-method-tile.payment-disabled:hover {
    border-color: #e5e7eb !important;
    background: #f9fafb !important;
}

.cash-change-display {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background: #fff;
    border: 2px solid #10b981;
    border-radius: 8px;
}

.cash-change-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 700;
    color: #065f46;
}

.cash-change-label .dashicons {
    font-size: 20px;
}

.cash-change-amount {
    font-size: 28px;
    font-weight: 800;
    color: #10b981;
}

.cash-insufficient-warning {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 8px;
    margin-top: 12px;
    color: #92400e;
    font-size: 13px;
}

.cash-insufficient-warning .dashicons {
    font-size: 18px;
    color: #f59e0b;
}

/* Reward Payment Container */
.reward-input-container {
    background: #f0f9ff;
    border-color: #3b82f6;
}

.reward-input-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

.reward-input-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #3b82f6;
}

.reward-input-name {
    font-size: 16px;
    font-weight: 700;
    color: #1e40af;
}

.reward-input-balance {
    margin-left: auto;
    font-size: 13px;
    color: #059669;
    font-weight: 600;
}

.reward-amount-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.reward-amount-input-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 2px solid #3b82f6;
    border-radius: 8px;
    padding: 0 14px;
}

.reward-currency {
    font-size: 20px;
    font-weight: 700;
    color: #1e40af;
}

.reward-amount-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 20px;
    font-weight: 700;
    text-align: right;
    padding: 12px 0;
    outline: none;
    color: #1e40af;
}

.reward-use-balance-btn {
    padding: 12px 16px;
    background: #10b981;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease;
    white-space: nowrap;
}

.reward-use-balance-btn:hover {
    background: #059669;
}

.reward-apply-btn {
    padding: 12px 20px;
    background: #3b82f6;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease;
}

.reward-apply-btn:hover {
    background: #2563eb;
}

/* OpenDental Payment Container */
.od-input-container {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 2px solid #0369a1;
    border-radius: 12px;
    padding: 18px;
    margin-top: 12px;
    box-shadow: 0 4px 12px rgba(3, 105, 161, 0.1);
}

.od-input-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(3, 105, 161, 0.15);
}

.od-input-header .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #0369a1;
}

.od-input-name {
    font-size: 16px;
    font-weight: 800;
    color: #0c4a6e;
    letter-spacing: -0.3px;
}

.od-amount-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.od-amount-input-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 2px solid #0284c7;
    border-radius: 10px;
    padding: 0 14px;
    min-width: 180px;
    transition: all 0.2s ease;
}

.od-amount-input-wrap:focus-within {
    border-color: #0369a1;
    box-shadow: 0 0 0 3px rgba(3, 105, 161, 0.15);
}

.od-currency {
    font-size: 24px;
    font-weight: 800;
    color: #0369a1;
}

.od-amount-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 24px;
    font-weight: 700;
    text-align: left;
    padding: 14px 0;
    outline: none;
    color: #0369a1;
    width: 100%;
    min-width: 0;
}

.od-use-full-btn {
    padding: 14px 18px;
    background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(14, 165, 233, 0.3);
}

.od-use-full-btn:hover {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(14, 165, 233, 0.4);
}

.od-use-full-btn:active {
    transform: translateY(0);
}

.od-apply-btn {
    padding: 14px 24px;
    background: linear-gradient(135deg, #0369a1 0%, #075985 100%);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(3, 105, 161, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.od-apply-btn:hover {
    background: linear-gradient(135deg, #075985 0%, #0c4a6e 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(3, 105, 161, 0.4);
}

.od-apply-btn:active {
    transform: translateY(0);
}

/* OD Payment - Wider Input */
.od-amount-input-wrap-wide {
    min-width: 220px;
    flex: 2;
    padding: 0 16px;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 2px solid #0284c7;
    transition: all 0.2s ease;
}

.od-amount-input-wrap-wide:focus-within {
    border-color: #0369a1;
    box-shadow: 0 0 0 3px rgba(3, 105, 161, 0.2);
}

.od-amount-input-wide {
    min-width: 160px;
    font-size: 28px;
    padding: 16px 8px;
    text-align: left;
    letter-spacing: -0.5px;
}

/* Remove spinner buttons from number input */
.od-amount-input::-webkit-outer-spin-button,
.od-amount-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.od-amount-input[type=number] {
    -moz-appearance: textfield;
}

/* OD Silent Order Checkbox - Enhanced Styling */
.od-silent-order-row {
    margin-top: 14px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 2px solid #f59e0b;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.od-silent-order-row:hover {
    border-color: #d97706;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.2);
}

.od-silent-checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: #92400e;
    user-select: none;
}

.od-silent-checkbox {
    width: 20px;
    height: 20px;
    accent-color: #d97706;
    cursor: pointer;
    flex-shrink: 0;
}

.od-silent-checkbox-text {
    display: flex;
    align-items: center;
    gap: 6px;
}

.od-silent-checkbox-text .dashicons {
    color: #b45309;
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* OD Order Date Row - Enhanced Styling */
.od-date-row {
    margin-top: 14px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 2px solid #0ea5e9;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    transition: all 0.2s ease;
}

.od-date-row:hover {
    border-color: #0284c7;
    box-shadow: 0 2px 8px rgba(14, 165, 233, 0.15);
}

.od-date-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 700;
    color: #0c4a6e;
    white-space: nowrap;
}

.od-date-label .dashicons {
    color: #0369a1;
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.od-order-date-input {
    flex: 1;
    min-width: 200px;
    max-width: 240px;
    padding: 10px 14px;
    border: 2px solid #0284c7;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #0c4a6e;
    background: #fff;
    transition: all 0.2s ease;
}

.od-order-date-input:hover {
    border-color: #0369a1;
}

.od-order-date-input:focus {
    outline: none;
    border-color: #0369a1;
    box-shadow: 0 0 0 3px rgba(3, 105, 161, 0.2);
}

.od-date-note {
    font-size: 12px;
    color: #64748b;
    font-style: italic;
    background: rgba(255, 255, 255, 0.7);
    padding: 4px 8px;
    border-radius: 4px;
}

/* OD Info Note at bottom */
.od-input-container .od-note {
    margin-top: 10px;
    padding: 8px 12px;
    background: rgba(3, 105, 161, 0.08);
    border-radius: 6px;
    border-left: 3px solid #0369a1;
}

.od-input-container .od-note .dashicons {
    color: #0369a1;
    vertical-align: middle;
}

/* ==========================================================================
   2026-01-13: OD LINK EXISTING PAYMENT FEATURE (v3.7.0)
   Tab-based interface for creating new or linking existing OD payments
   ========================================================================== */

/* OD Payment Tabs */
.od-payment-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 16px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #0369a1;
}

.od-tab-btn {
    flex: 1;
    padding: 10px 16px;
    background: #fff;
    border: none;
    color: #0369a1;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 0.2s ease;
}

.od-tab-btn:first-child {
    border-right: 1px solid #0369a1;
}

.od-tab-btn:hover {
    background: #f0f9ff;
}

.od-tab-btn.active {
    background: linear-gradient(135deg, #0369a1 0%, #075985 100%);
    color: #fff;
}

.od-tab-btn .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* OD Tab Content */
.od-tab-content {
    animation: fadeIn 0.2s ease;
}

/* Link Existing - Search Row */
.od-link-search-row {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.od-link-search-input-wrap {
    flex: 1;
    position: relative;
}

.od-link-search-input-wrap .dashicons {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #64748b;
    font-size: 18px;
}

.od-link-search-input {
    width: 100%;
    padding: 10px 12px 10px 36px;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.2s ease;
}

.od-link-search-input:focus {
    outline: none;
    border-color: #0369a1;
    box-shadow: 0 0 0 3px rgba(3, 105, 161, 0.1);
}

.od-link-search-btn {
    padding: 10px 16px;
    background: linear-gradient(135deg, #0369a1 0%, #075985 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.od-link-search-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(3, 105, 161, 0.3);
}

.od-link-search-btn .dashicons {
    font-size: 16px;
}

/* Link Existing - Date Row */
.od-link-date-row {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
}

.od-link-date-field {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
}

.od-link-date-field label {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
}

.od-link-date-input {
    flex: 1;
    padding: 8px 10px;
    border: 2px solid #e2e8f0;
    border-radius: 6px;
    font-size: 13px;
}

.od-link-date-input:focus {
    outline: none;
    border-color: #0369a1;
}

/* Link Existing - Results Container */
.od-link-results {
    max-height: 280px;
    overflow-y: auto;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    margin-bottom: 12px;
}

.od-link-results-placeholder {
    padding: 30px 20px;
    text-align: center;
    color: #64748b;
}

.od-link-results-placeholder .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
    margin-bottom: 8px;
    color: #94a3b8;
}

.od-link-results-placeholder.error .dashicons {
    color: #dc2626;
}

.od-link-results-placeholder p {
    margin: 0;
    font-size: 13px;
}

.od-link-results-loading {
    padding: 30px 20px;
    text-align: center;
    color: #0369a1;
}

.od-link-results-loading .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    margin-bottom: 8px;
}

.od-link-results-loading .dashicons.spin {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Results List */
.od-link-results-list {
    padding: 6px;
}

.od-link-result-item {
    padding: 12px;
    border: 2px solid transparent;
    border-radius: 8px;
    margin-bottom: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #f8fafc;
}

.od-link-result-item:last-child {
    margin-bottom: 0;
}

.od-link-result-item:hover {
    background: #e0f2fe;
    border-color: #0369a1;
}

.od-link-result-item.selected {
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);
    border-color: #0369a1;
    box-shadow: 0 2px 8px rgba(3, 105, 161, 0.2);
}

.od-link-result-item.already-linked {
    opacity: 0.6;
    cursor: not-allowed;
}

.od-link-result-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.od-link-result-amount {
    font-size: 18px;
    font-weight: 700;
    color: #059669;
    white-space: nowrap;
}

.od-link-result-info {
    flex: 1;
    min-width: 0;
}

.od-link-result-patient {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 4px;
}

.od-link-result-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 11px;
    color: #64748b;
}

.od-link-result-meta span {
    display: flex;
    align-items: center;
    gap: 2px;
}

.od-link-result-type {
    background: #0369a1;
    color: #fff !important;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 500;
}

.od-link-result-note {
    margin-top: 8px;
    padding: 8px;
    background: rgba(0, 0, 0, 0.03);
    border-radius: 4px;
    font-size: 12px;
    color: #475569;
    font-style: italic;
}

.od-link-result-linked-badge {
    margin-top: 6px;
    padding: 4px 8px;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    color: #d97706;
}

.od-link-result-id {
    margin-top: 4px;
    font-size: 10px;
    color: #94a3b8;
    font-family: monospace;
}

.od-link-results-count {
    padding: 8px 12px;
    background: #f1f5f9;
    font-size: 11px;
    color: #64748b;
    text-align: center;
    border-top: 1px solid #e2e8f0;
}

/* Selected Payment Display */
.od-link-selected {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 2px solid #059669;
    border-radius: 8px;
    padding: 12px;
}

.od-link-selected-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(5, 150, 105, 0.2);
    color: #059669;
    font-weight: 700;
}

.od-link-selected-header .dashicons {
    font-size: 20px;
}

.od-link-clear-btn {
    margin-left: auto;
    background: none;
    border: none;
    color: #dc2626;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: background 0.2s ease;
}

.od-link-clear-btn:hover {
    background: rgba(220, 38, 38, 0.1);
}

.od-link-selected-details {
    display: grid;
    gap: 6px;
}

.od-link-selected-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
}

.od-link-selected-row.full {
    flex-direction: column;
    gap: 4px;
}

.od-link-selected-row .label {
    font-weight: 600;
    color: #475569;
    min-width: 70px;
}

.od-link-selected-row .value {
    color: #1e293b;
}

.od-link-selected-row .value.amount {
    font-size: 18px;
    font-weight: 700;
    color: #059669;
}

.od-link-selected-row .value.note {
    font-style: italic;
    color: #64748b;
}

.od-link-selected-row.paynum {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed rgba(5, 150, 105, 0.3);
}

.od-link-selected-row.paynum .value {
    font-family: monospace;
    color: #0369a1;
}

/* ==========================================================================
   2026-01-15: OD PAYMENTS AUTO-DISPLAY FEATURE (v3.8.0)
   Summary header and empty state styling for auto-loaded payments
   ========================================================================== */

/* Payments Summary Header (shows count and total) */
.od-payments-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid #0ea5e9;
    border-radius: 6px;
    padding: 10px 14px;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 600;
}

.od-payments-summary .total-count {
    color: #0369a1;
}

.od-payments-summary .total-amount {
    color: #0f766e;
    font-size: 14px;
}

/* No OD Patient Linked State */
.od-link-no-patient {
    text-align: center;
    padding: 30px 20px;
    color: #6b7280;
}

.od-link-no-patient .dashicons {
    display: block;
    font-size: 40px;
    width: 40px;
    height: 40px;
    color: #9ca3af;
    margin: 0 auto 12px auto;
}

.od-link-no-patient p {
    margin: 0 0 4px 0;
    font-size: 13px;
}

.od-link-no-patient .subtext {
    font-size: 12px;
    color: #9ca3af;
    margin-top: 6px;
}

/* No Payments Found State */
.od-link-no-payments {
    text-align: center;
    padding: 30px 20px;
    color: #6b7280;
}

.od-link-no-payments .dashicons {
    display: block;
    font-size: 40px;
    width: 40px;
    height: 40px;
    color: #9ca3af;
    margin: 0 auto 12px auto;
}

.od-link-no-payments p {
    margin: 0 0 4px 0;
    font-size: 13px;
}

.od-link-no-payments .subtext {
    font-size: 12px;
    color: #9ca3af;
    margin-top: 6px;
}

/* Applied Payments Summary */
.applied-payments-summary {
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 16px;
}

.applied-payments-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.applied-payments-header .dashicons {
    font-size: 16px;
    color: #22c55e;
}

.applied-payments-header span:nth-child(2) {
    font-size: 13px;
    font-weight: 700;
    color: #166534;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.total-payments-amount {
    margin-left: auto;
    font-size: 16px;
    font-weight: 800;
    color: #166534;
}

.applied-payments-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.applied-payment-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: #dcfce7;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    color: #166534;
}

.applied-payment-remove {
    background: none;
    border: none;
    padding: 0;
    margin-left: 4px;
    font-size: 14px;
    color: #dc2626;
    cursor: pointer;
    line-height: 1;
}

.applied-payment-remove:hover {
    color: #b91c1c;
}

/* Discounts Section */
.discounts-section {
    background: #fef3c7;
    border: 1px solid #fcd34d;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 16px;
}

.discounts-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.2s ease;
}

.discounts-header:hover {
    background: rgba(0, 0, 0, 0.03);
}

.discounts-header .dashicons:first-child {
    font-size: 18px;
    color: #d97706;
}

.discounts-header span:nth-child(2) {
    font-size: 14px;
    font-weight: 600;
    color: #92400e;
}

.discount-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    background: #fde68a;
    color: #92400e;
    border-radius: 4px;
    text-transform: uppercase;
}

.discounts-expand-icon {
    margin-left: auto;
    font-size: 16px;
    color: #d97706;
    transition: transform 0.2s ease;
}

.discounts-content {
    padding: 16px;
    background: #fff;
}

.evolus-discount-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.evolus-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #00838f;
}

.evolus-name {
    font-size: 14px;
    font-weight: 600;
    color: #00838f;
}

.evolus-amount-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 6px;
    background: #f9fafb;
    border: 2px solid #00838f;
    border-radius: 8px;
    padding: 0 12px;
}

.evolus-currency {
    font-size: 16px;
    font-weight: 700;
    color: #00838f;
}

.evolus-amount-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 16px;
    font-weight: 600;
    text-align: right;
    padding: 10px 0;
    outline: none;
    color: #00838f;
}

.evolus-apply-btn {
    padding: 10px 16px;
    background: #00838f;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease;
}

.evolus-apply-btn:hover {
    background: #00695c;
}

.evolus-note {
    margin: 10px 0 0;
    font-size: 11px;
    color: #6b7280;
}

/* Applied Discounts */
.applied-discounts-summary {
    background: #fef3c7;
    border: 1px solid #fcd34d;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 16px;
}

.applied-discounts-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.applied-discounts-header .dashicons {
    font-size: 16px;
    color: #d97706;
}

.applied-discounts-header span:nth-child(2) {
    font-size: 13px;
    font-weight: 700;
    color: #92400e;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.total-discounts-amount {
    margin-left: auto;
    font-size: 16px;
    font-weight: 800;
    color: #92400e;
}

.applied-discounts-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.applied-discount-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: #fde68a;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    color: #92400e;
}

/* Coupon Section */
/* ==========================================================================
   CASH DRAWER STATUS WIDGET
   ========================================================================== */

.cash-drawer-widget {
    margin: 0 12px 16px 12px;
    padding: 16px;
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 100%);
    border: 1px solid #86efac;
    border-radius: 12px;
    box-sizing: border-box;
}

.cash-drawer-widget.drawer-closed {
    background: linear-gradient(135deg, #fef3c7 0%, #fef9c3 100%);
    border-color: #fcd34d;
}

.drawer-status-header {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 4px 8px;
    margin: -4px -8px;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.drawer-status-header:hover {
    background: rgba(0, 0, 0, 0.05);
}

.drawer-icon {
    font-size: 20px;
}

.drawer-title {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
    flex: 1;
}

.drawer-status-badge {
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.drawer-status-badge.status-open {
    background: #059669;
    color: white;
}

.drawer-status-badge.status-closed {
    background: #f59e0b;
    color: white;
}

.drawer-status-badge.status-unknown {
    background: #9ca3af;
    color: white;
}

.drawer-toggle-icon {
    font-size: 10px;
    color: #9ca3af;
    transition: transform 0.2s ease;
}

.drawer-details {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.drawer-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 12px;
}

.drawer-info-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.drawer-info-label {
    font-size: 11px;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.drawer-info-value {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
}

.drawer-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.btn-drawer-action {
    flex: 1;
    min-width: 100px;
    padding: 10px 16px;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-drawer-action.btn-open {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    color: white;
}

.btn-drawer-action.btn-open:hover {
    background: linear-gradient(135deg, #047857 0%, #065f46 100%);
}

.btn-drawer-action.btn-close {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
    color: white;
}

.btn-drawer-action.btn-close:hover {
    background: linear-gradient(135deg, #b91c1c 0%, #991b1b 100%);
}

.btn-drawer-secondary {
    padding: 8px 14px;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-drawer-secondary:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

/* Denomination Modal */
.denomination-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000;
}

.denomination-modal {
    background: white;
    border-radius: 16px;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.denomination-modal-header {
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.denomination-modal-title {
    font-size: 18px;
    font-weight: 700;
    color: #1f2937;
}

.denomination-modal-close {
    background: none;
    border: none;
    font-size: 24px;
    color: #9ca3af;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.denomination-modal-close:hover {
    color: #6b7280;
}

.denomination-modal-body {
    padding: 24px;
}

.denomination-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.denomination-section {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.denomination-section-title {
    font-size: 12px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}

.denomination-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
}

.denomination-label {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}

.denomination-input {
    width: 70px;
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    text-align: center;
}

.denomination-input:focus {
    outline: none;
    border-color: #c9a962;
}

.denomination-total-section {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 2px solid #e5e7eb;
}

.denomination-total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.denomination-total-label {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}

.denomination-total-value {
    font-size: 24px;
    font-weight: 800;
    color: #059669;
}

.denomination-variance {
    font-size: 14px;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: 8px;
    text-align: center;
    margin-top: 8px;
}

.denomination-variance.over {
    background: #d4edda;
    color: #155724;
}

.denomination-variance.short {
    background: #f8d7da;
    color: #721c24;
}

.denomination-variance.exact {
    background: #d4edda;
    color: #155724;
}

.denomination-modal-footer {
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}

.btn-denomination-cancel {
    padding: 10px 20px;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
}

.btn-denomination-confirm {
    padding: 10px 24px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: white;
    cursor: pointer;
}

.btn-denomination-confirm:hover {
    background: linear-gradient(135deg, #047857 0%, #065f46 100%);
}

/* ==========================================================================
   COUPON SECTION
   ========================================================================== */

.coupon-section {
    margin: 0 12px 16px 12px;
    padding: 20px !important;
    background: #f9fafb !important;
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    box-sizing: border-box !important;
}

.coupon-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 0;
}

.coupon-toggle-header {
    cursor: pointer;
    padding: 4px 8px;
    margin: -4px -8px;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.coupon-toggle-header:hover {
    background: rgba(201, 169, 98, 0.1);
}

.coupon-section-icon {
    font-size: 18px;
}

.coupon-section-title {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937 !important;
    flex: 1;
}

.coupon-toggle-icon {
    font-size: 10px;
    color: #9ca3af;
    transition: transform 0.2s ease;
}

/* Coupon content wrapper (collapsible) */
.coupon-content-wrapper {
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid #e5e7eb;
}

.coupon-section > * {
    max-width: 100%;
    box-sizing: border-box;
}

.coupon-input-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.coupon-input {
    flex: 1;
    min-width: 100px;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.2s ease;
}

.coupon-input:focus {
    border-color: #c9a962;
}

/* Enhanced Coupon Dropdown Container */
.coupon-dropdown-container {
    margin-bottom: 12px;
    width: 100%;
    box-sizing: border-box;
}

.coupon-dropdown-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}

.coupon-dropdown-label .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: #c9a962;
}

.coupon-dropdown-enhanced {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    outline: none;
    background: linear-gradient(to bottom, #fff, #fafafa);
    cursor: pointer;
    transition: all 0.2s ease;
    color: #374151;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 18px;
    padding-right: 40px;
    box-sizing: border-box;
}

.coupon-dropdown-enhanced:focus {
    border-color: #c9a962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.coupon-dropdown-enhanced:hover {
    border-color: #c9a962;
    background: linear-gradient(to bottom, #fff, #fef9e7);
}

.coupon-dropdown-enhanced option {
    padding: 12px;
    font-size: 13px;
    line-height: 1.5;
}

/* Coupon Divider */
.coupon-divider {
    display: flex;
    align-items: center;
    margin: 14px 0;
    color: #9ca3af;
}

.coupon-divider::before,
.coupon-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.coupon-divider span {
    padding: 0 12px;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Manual Coupon Row */
.coupon-manual-row {
    display: flex;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
}

/* Larger Coupon Input */
.coupon-input-large {
    flex: 1;
    min-width: 0;
    padding: 14px 18px;
    border: 2px solid #d1d5db;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 500;
    outline: none;
    transition: all 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-sizing: border-box;
}

.coupon-input-large::placeholder {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    color: #9ca3af;
}

.coupon-input-large:focus {
    border-color: #c9a962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

/* Larger Apply Button */
.coupon-apply-btn-large {
    padding: 14px 28px;
    background: linear-gradient(135deg, #1e3a5f 0%, #2d4a6f 100%);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.coupon-apply-btn-large:hover {
    background: linear-gradient(135deg, #2d4a6f 0%, #3d5a7f 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.25);
}

.coupon-apply-btn-large:active {
    transform: translateY(0);
}

.coupon-apply-btn-large:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

/* Legacy styles */
.coupon-dropdown {
    flex: 1;
    max-width: 200px;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 13px;
    outline: none;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.2s ease;
    color: #374151;
}

.coupon-dropdown:focus {
    border-color: #c9a962;
}

.coupon-dropdown:hover {
    border-color: #9ca3af;
}

.coupon-or-divider {
    display: flex;
    align-items: center;
    font-size: 12px;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.coupon-apply-btn {
    padding: 10px 20px;
    background: #1e3a5f;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease;
}

.coupon-apply-btn:hover {
    background: #2c4a7c;
}

.coupon-message {
    margin-top: 8px;
    font-size: 13px;
}

.coupon-message.success {
    color: #059669;
}

.coupon-message.error {
    color: #dc2626;
}

/* Payment Input Label */
.payment-input-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 12px;
}

.payment-input-label .dashicons {
    font-size: 18px;
    color: #635bff;
}

/* ==========================================================================
   SUMMARY SECTION
   ========================================================================== */

.summary-section {
    padding: 20px;
    background: #f9fafb;
    border-radius: 12px;
    margin-bottom: 20px;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.ennu-checkout-interface-enhanced .summary-label {
    font-size: var(--ennu-text-sm, 14px);
    color: #4b5563;
}

.ennu-checkout-interface-enhanced .summary-value {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .summary-divider {
    height: 1px;
    background: #e5e7eb;
    margin: var(--ennu-space-3, 12px) 0;
}

.ennu-checkout-interface-enhanced .summary-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ennu-space-4, 16px) 0 0;
    border-top: 2px solid var(--ennu-navy, #1a2744);
    margin-top: var(--ennu-space-3, 12px);
}

.ennu-checkout-interface-enhanced .summary-total span:first-child {
    font-family: var(--ennu-font-display), Georgia, serif;
    font-size: var(--ennu-text-lg, 18px);
    font-weight: var(--ennu-font-semibold, 600);
    color: var(--ennu-navy, #1a2744);
}

.ennu-checkout-interface-enhanced .summary-total span:last-child {
    font-size: var(--ennu-text-3xl, 28px);
    font-weight: var(--ennu-font-extrabold, 800);
    color: var(--ennu-gold, #C9A962);
}

.ennu-checkout-interface-enhanced .summary-items-list {
    margin-bottom: var(--ennu-space-4, 16px);
}

.ennu-checkout-interface-enhanced .summary-items-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--ennu-space-2, 8px);
    padding-bottom: var(--ennu-space-2, 8px);
    border-bottom: 1px dashed #e5e7eb;
}

.ennu-checkout-interface-enhanced .summary-item-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ennu-space-1-5, 6px) 0;
    font-size: var(--ennu-text-xs, 13px);
}

/* Price Summary */
.ennu-checkout-interface-enhanced .price-summary {
    background: #f9fafb;
    border-radius: var(--ennu-radius-lg, 8px);
    padding: var(--ennu-space-4, 16px);
    border: 1px solid #f3f4f6;
}

.ennu-checkout-interface-enhanced .price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ennu-space-1-5, 6px) 0;
}

.ennu-checkout-interface-enhanced .price-label {
    font-size: var(--ennu-text-xs, 13px);
    color: #6b7280;
}

.ennu-checkout-interface-enhanced .price-value {
    font-size: var(--ennu-text-xs, 13px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .price-total {
    font-size: var(--ennu-text-xl, 20px);
    font-weight: var(--ennu-font-bold, 700);
    color: var(--ennu-gold, #C9A962);
}

/* ==========================================================================
   REWARDS & DISCOUNTS
   ========================================================================== */

.ennu-checkout-interface-enhanced .reward-chip,
.ennu-checkout-interface-enhanced .discount-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1-5, 6px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-3, 12px);
    background: var(--ennu-white, #fff);
    border: 2px solid #e5e7eb;
    border-radius: var(--ennu-radius-full, 20px);
    cursor: pointer;
    transition: all var(--ennu-duration-200, 200ms) ease;
    font-size: var(--ennu-text-xs, 13px);
    font-weight: var(--ennu-font-semibold, 600);
}

.ennu-checkout-interface-enhanced .reward-chip:hover,
.ennu-checkout-interface-enhanced .discount-chip:hover {
    border-color: var(--ennu-gold, #C9A962);
    background: var(--ennu-gold-50, #fffbeb);
    transform: translateY(-1px);
}

.ennu-checkout-interface-enhanced .reward-chip.selected,
.ennu-checkout-interface-enhanced .discount-chip.selected {
    border-color: var(--ennu-gold, #C9A962);
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.08) 100%);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.1);
}

.ennu-checkout-interface-enhanced .reward-payment-method {
    color: #6b7280;
}

.ennu-checkout-interface-enhanced .applied-discount-chip,
.ennu-checkout-interface-enhanced .applied-payment-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1-5, 6px);
    padding: var(--ennu-space-1-5, 6px) var(--ennu-space-2-5, 10px);
    background: var(--ennu-success-50, #d4edda);
    border: 1px solid var(--ennu-success, #28a745);
    border-radius: var(--ennu-radius-full, 16px);
    font-size: var(--ennu-text-xs, 12px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #155724;
}

.discount-codes-section {
    margin-bottom: 20px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: 8px;
}

.coupon-input-group {
    display: flex;
    gap: 10px;
    margin-bottom: 12px;
}

.discount-input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
}

.discount-input:focus {
    outline: none;
    border-color: #C9A962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.btn-apply-coupon {
    padding: 10px 20px;
    background: #0073aa;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: background 150ms ease;
}

.btn-apply-coupon:hover {
    background: #005a87;
}

.expand-icon {
    transition: transform 200ms ease;
}

.expanded .expand-icon {
    transform: rotate(180deg);
}

/* ==========================================================================
   GIFTUP GIFT CARDS
   ========================================================================== */

.giftup-payment-section {
    margin-bottom: 20px;
}

.giftup-quick-amount {
    padding: 10px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    transition: all 200ms ease;
}

.ennu-giftup-banner {
    background: linear-gradient(135deg, #1a2a4a 0%, #2c4a7c 100%);
    border-radius: 12px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.ennu-giftup-banner-content {
    flex: 1;
}

.ennu-giftup-banner-text {
    color: #fff;
    font-size: 14px;
}

.ennu-giftup-icon {
    font-size: 32px;
}

.ennu-giftup-animate {
    animation: pulse 2s ease-in-out infinite;
}

.ennu-giftup-amount {
    font-size: 24px;
    font-weight: 800;
    color: #d4af37;
}

.ennu-giftup-message {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
}

.ennu-giftup-cards-count {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
}

.ennu-giftup-refresh-btn {
    padding: 6px 12px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
    transition: all 150ms ease;
}

.ennu-giftup-refresh-btn:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* ==========================================================================
   MEMBERSHIP BANNERS
   ========================================================================== */

.ennu-member-balance-banner,
.ennu-member-join-banner {
    background: linear-gradient(135deg, #1a2744 0%, #2d3e5f 100%);
    border-radius: 12px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.ennu-member-balance-banner-content,
.ennu-member-join-content {
    flex: 1;
}

.ennu-member-balance-banner-text,
.ennu-member-join-text {
    color: #fff;
    font-size: 14px;
}

.ennu-mb-icon {
    font-size: 28px;
    color: #C9A962;
}

.ennu-mb-animate {
    /* Animation removed - user preferred static banner */
    opacity: 1;
}

.ennu-mb-label {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.ennu-mb-status {
    font-size: 11px;
    color: #C9A962;
    font-weight: 600;
}

.ennu-mb-amount {
    font-size: 24px;
    font-weight: 800;
    color: #C9A962;
}

.ennu-mb-join-btn {
    padding: 10px 20px;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    transition: all 200ms ease;
}

.ennu-mb-join-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.4);
}

.ennu-mb-join-label {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
}

.ennu-mb-join-desc {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
}

.ennu-checkout-balance-banner {
    /* Container wrapper - transparent, no visible styling */
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-bottom: 0;
}

.ennu-checkout-savings-message {
    font-size: 14px;
    color: #155724;
    font-weight: 500;
}

.ennu-checkout-savings-member,
.ennu-checkout-savings-upsell {
    font-size: 13px;
    color: #155724;
}

.ennu-checkout-membership-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: #C9A962;
    color: #fff;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

/* ==========================================================================
   TREATMENT/ORDER ITEMS
   ========================================================================== */

.ennu-checkout-interface-enhanced .treatment-summary {
    background: var(--ennu-white, #fff);
    border-radius: var(--ennu-radius-xl, 12px);
    padding: var(--ennu-space-5, 20px);
    margin-bottom: var(--ennu-space-5, 20px);
    border: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .treatment-item {
    display: flex;
    align-items: flex-start;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-3, 12px) 0;
    border-bottom: 1px solid #f3f4f6;
}

.ennu-checkout-interface-enhanced .treatment-item:last-child {
    border-bottom: none;
}

.ennu-checkout-interface-enhanced .treatment-details {
    flex: 1;
    min-width: 0;
}

.ennu-checkout-interface-enhanced .treatment-info {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--ennu-space-3, 12px);
}

.ennu-checkout-interface-enhanced .treatment-name {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .treatment-price {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-bold, 700);
    color: var(--ennu-navy, #1a2744);
    white-space: nowrap;
}

.ennu-checkout-interface-enhanced .item-name {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-medium, 500);
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .item-price {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    color: var(--ennu-navy, #1a2744);
    white-space: nowrap;
}

.ennu-checkout-interface-enhanced .item-qty {
    font-size: var(--ennu-text-xs, 12px);
    color: #6b7280;
}

/* Item Type Badges (Service/Product) */
.ennu-checkout-interface-enhanced .item-type-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    font-size: 10px;
    font-weight: var(--ennu-font-semibold, 600);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-radius: var(--ennu-radius-sm, 4px);
    background: #e5e7eb;
    color: #4b5563;
}

.ennu-checkout-interface-enhanced .item-type-badge.service {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    color: #1e40af;
    border: 1px solid rgba(59, 130, 246, 0.2);
}

.ennu-checkout-interface-enhanced .item-type-badge.product {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    color: #92400e;
    border: 1px solid rgba(217, 119, 6, 0.2);
}

/* Tax Exempt Badge */
.ennu-checkout-interface-enhanced .tax-exempt-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1);
    padding: 2px 8px;
    font-size: 10px;
    font-weight: var(--ennu-font-semibold, 600);
    text-transform: uppercase;
    border-radius: var(--ennu-radius-sm, 4px);
    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
    color: #065f46;
    border: 1px solid rgba(5, 150, 105, 0.2);
    cursor: pointer;
    transition: all var(--ennu-duration-150) ease;
}

.ennu-checkout-interface-enhanced .tax-exempt-badge:hover {
    background: linear-gradient(135deg, #a7f3d0 0%, #6ee7b7 100%);
}

/* Quantity Controls */
.quantity-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ennu-checkout-interface-enhanced .quantity-btn {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-md, 6px);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
    font-size: 16px;
    color: #4b5563;
}

.ennu-checkout-interface-enhanced .quantity-btn:hover {
    background: #e5e7eb;
    border-color: #d1d5db;
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .quantity-btn:active {
    transform: scale(0.95);
}

.ennu-checkout-interface-enhanced .quantity-value {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    min-width: 24px;
    text-align: center;
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .quantity-label {
    font-size: var(--ennu-text-xs, 12px);
    color: #6b7280;
}

.ennu-checkout-interface-enhanced .quantity-unit {
    font-size: 11px;
    color: #9ca3af;
}

.ennu-checkout-interface-enhanced .quantity-section {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
}

/* ==========================================================================
   PROVIDER SECTION
   ========================================================================== */

.ennu-checkout-interface-enhanced .provider-display {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-3, 12px);
    background: #f9fafb;
    border-radius: var(--ennu-radius-lg, 8px);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
    border: 1px solid transparent;
}

.ennu-checkout-interface-enhanced .provider-display:hover {
    background: #f3f4f6;
    border-color: #e5e7eb;
}

.ennu-checkout-interface-enhanced .provider-assigned {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-medium, 500);
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .provider-value {
    font-weight: var(--ennu-font-semibold, 600);
    color: var(--ennu-navy, #1a2744);
}

.ennu-checkout-interface-enhanced .provider-inline-edit,
.ennu-checkout-interface-enhanced .inline-provider-select {
    padding: var(--ennu-space-1-5, 6px) var(--ennu-space-2-5, 10px);
    font-size: var(--ennu-text-sm, 13px);
    font-family: var(--ennu-font-sans);
    border: 1px solid #d1d5db;
    border-radius: var(--ennu-radius-md, 6px);
    background: var(--ennu-white, #fff);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.ennu-checkout-interface-enhanced .provider-inline-edit:focus,
.ennu-checkout-interface-enhanced .inline-provider-select:focus {
    outline: none;
    border-color: var(--ennu-primary);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.ennu-checkout-interface-enhanced .provider-missing-warning {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1);
    padding: 2px 8px;
    font-size: 10px;
    font-weight: var(--ennu-font-semibold, 600);
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    color: #92400e;
    border-radius: var(--ennu-radius-sm, 4px);
    border: 1px solid rgba(217, 119, 6, 0.3);
}

.provider-missing-warning {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #fef3c7;
    border: 1px solid #fcd34d;
    border-radius: 8px;
    font-size: 13px;
    color: #92400e;
}

/* Location Section */
.location-value {
    font-weight: 600;
    color: #1a2744;
}

.location-inline-edit {
    padding: 6px 10px;
    font-size: 13px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
}

/* ==========================================================================
   GRATUITY SECTION
   ========================================================================== */

.gratuity-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
}

.gratuity-tab-container {
    margin-bottom: 16px;
}

.gratuity-field {
    margin-bottom: 12px;
}

.gratuity-percentages,
.gratuity-dollars {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.gratuity-percent-btn,
.gratuity-dollar-btn {
    padding: 10px 16px;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 150ms ease;
}

.gratuity-percent-btn:hover,
.gratuity-dollar-btn:hover {
    border-color: #C9A962;
    background: #fffbeb;
}

.gratuity-percent-btn.selected,
.gratuity-dollar-btn.selected {
    border-color: #C9A962;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    color: #fff;
}

.gratuity-custom {
    display: flex;
    align-items: center;
    gap: 8px;
}

.gratuity-actions {
    display: flex;
    gap: 8px;
    margin-top: 16px;
}

.existing-gratuity-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: #d4edda;
    border-radius: 8px;
    margin-bottom: 12px;
}

.btn-add-gratuity {
    padding: 8px 16px;
    background: #28a745;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
}

.btn-remove-gratuity {
    padding: 4px 8px;
    background: transparent;
    border: none;
    color: #dc3545;
    cursor: pointer;
}

/* ==========================================================================
   FOLLOWUP SCHEDULING
   ========================================================================== */

.followup-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
}

.followup-tab-container {
    margin-bottom: 16px;
}

.followup-field {
    margin-bottom: 12px;
}

.followup-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #4b5563;
    margin-bottom: 6px;
}

.followup-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

.followup-input:focus {
    outline: none;
    border-color: #C9A962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.followup-textarea {
    width: 100%;
    min-height: 80px;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    resize: vertical;
}

.followup-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.followup-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 150ms ease;
}

.followup-chip:hover {
    border-color: #C9A962;
    background: #fffbeb;
}

.followup-chip.selected {
    border-color: #C9A962;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.05) 100%);
}

.followup-actions {
    display: flex;
    gap: 8px;
    margin-top: 16px;
}

.followup-quick-select {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.followup-datetime-row {
    display: flex;
    gap: 12px;
    align-items: center;
}

.followup-confirmation {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #d4edda;
    border: 1px solid #28a745;
    border-radius: 8px;
    margin-top: 16px;
}

.btn-schedule-followup {
    padding: 10px 20px;
    background: #28a745;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
}

.btn-edit-followup,
.btn-clear-followup {
    padding: 6px 12px;
    background: transparent;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
}

/* ==========================================================================
   MODALS
   ========================================================================== */

.modal,
.new-order-modal {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 20px;
    backdrop-filter: blur(4px);
}

.modal.active,
.new-order-modal.active {
    display: flex;
}

/* Modal overlay - invisible layer to capture outside clicks */
.modal-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    cursor: pointer;
    /* No background - the parent .modal already has the dark overlay */
}

.modal-container,
.modal-content {
    position: relative;
    z-index: 2;
    background: var(--ennu-white, #fff);
    border-radius: var(--ennu-radius-2xl, 16px);
    box-shadow: var(--ennu-shadow-2xl, 0 25px 50px -12px rgba(0, 0, 0, 0.25));
    max-width: 500px;
    width: 100%;
    max-height: 90vh;
    overflow: hidden;
    animation: scaleIn var(--ennu-duration-200, 200ms) ease-out;
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--ennu-space-5, 20px) var(--ennu-space-6, 24px);
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(180deg, var(--ennu-white, #fff) 0%, #f9fafb 100%);
}

.modal-header h3 {
    font-family: var(--ennu-font-display), Georgia, serif;
    font-size: var(--ennu-text-xl, 20px);
    font-weight: var(--ennu-font-semibold, 600);
    color: var(--ennu-navy, #1a2744);
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2-5, 10px);
}

.modal-title {
    font-family: var(--ennu-font-display), Georgia, serif;
    font-size: var(--ennu-text-xl, 20px);
    font-weight: var(--ennu-font-semibold, 600);
    color: var(--ennu-navy, #1a2744);
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2-5, 10px);
}

.modal-close {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border: none;
    border-radius: var(--ennu-radius-full, 50%);
    font-size: 24px;
    color: #6b7280;
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.modal-close:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.modal-close:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--ennu-gold, #C9A962);
}

.modal-body {
    padding: var(--ennu-space-6, 24px);
    max-height: 60vh;
    overflow-y: auto;
}

/* Styled scrollbar for modal body */
.modal-body::-webkit-scrollbar {
    width: 8px;
}

.modal-body::-webkit-scrollbar-track {
    background: #f3f4f6;
    border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-4, 16px) var(--ennu-space-6, 24px);
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

/* Form Elements in Modals */
.form-section {
    margin-bottom: var(--ennu-space-5, 20px);
}

.form-label {
    display: block;
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #374151;
    margin-bottom: var(--ennu-space-2, 8px);
}

.form-input {
    width: 100%;
    padding: var(--ennu-space-3, 12px) var(--ennu-space-3-5, 14px);
    font-size: var(--ennu-text-sm, 14px);
    border: 1px solid #d1d5db;
    border-radius: var(--ennu-radius-md, 8px);
    background: var(--ennu-white, #fff);
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.form-input:focus {
    outline: none;
    border-color: var(--ennu-gold, #C9A962);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.form-input::placeholder {
    color: #9ca3af;
}

.form-select {
    width: 100%;
    padding: var(--ennu-space-3, 12px) var(--ennu-space-3-5, 14px);
    font-size: var(--ennu-text-sm, 14px);
    border: 1px solid #d1d5db;
    border-radius: var(--ennu-radius-md, 8px);
    background: #fff;
    cursor: pointer;
}

.form-select:focus {
    outline: none;
    border-color: #C9A962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.form-group {
    margin-bottom: 16px;
}

/* ════════════════════════════════════════════════════════════════════════════
   TEST ORDER TOGGLE IN NEW ORDER MODAL (v2.7.0)
   ════════════════════════════════════════════════════════════════════════════ */
.test-order-section {
    margin-top: 8px;
    padding-top: 16px;
    border-top: 1px dashed #e5e7eb;
}

.test-order-toggle-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 16px;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 1px solid #fbbf24;
    border-radius: 10px;
}

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 26px;
    flex-shrink: 0;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d1d5db;
    transition: 0.3s;
    border-radius: 26px;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.toggle-switch input:checked + .toggle-slider {
    background-color: #f59e0b;
}

.toggle-switch input:checked + .toggle-slider:before {
    transform: translateX(22px);
}

.toggle-switch input:focus + .toggle-slider {
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.25);
}

.toggle-label-group {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.toggle-label {
    font-size: 14px;
    font-weight: 600;
    color: #92400e;
}

.toggle-hint {
    font-size: 12px;
    color: #b45309;
}

/* Delivery Options */
.delivery-options {
    display: flex;
    gap: 10px;
}

.delivery-option {
    flex: 1;
    padding: 15px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    text-align: center;
    transition: all 150ms ease;
}

.delivery-option:hover {
    border-color: #C9A962;
}

.delivery-option.selected {
    border-color: #007cba;
    background: #e8f5ff;
}

.phone-field,
.email-field {
    margin-top: 16px;
}

/* Patient Search in Modal */
.patient-search-results {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    max-height: 250px;
    overflow-y: auto;
    z-index: 100;
    display: none;
}

.patient-search-results.active {
    display: block;
}

.patient-result-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 150ms ease;
}

.patient-result-item:hover {
    background: #f3f4f6;
}

.patient-result-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
}

.patient-result-info {
    flex: 1;
}

.patient-result-name {
    font-weight: 600;
    color: #1f2937;
}

.patient-result-meta {
    font-size: 12px;
    color: #6b7280;
}

/* Selected Patient Card */
.selected-patient-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.05) 100%);
    border: 2px solid #C9A962;
    border-radius: 10px;
}

.selected-patient-avatar {
    width: 64px;
    height: 64px;
    min-width: 64px;
    min-height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
    font-size: 20px;
    overflow: hidden;
    flex-shrink: 0;
}

/* Avatar image styling (from get_avatar()) */
.selected-patient-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* Fallback dashicon styling */
.selected-patient-avatar .dashicons {
    font-size: 28px;
    width: 28px;
    height: 28px;
}

.selected-patient-info {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
}

.selected-patient-meta {
    font-size: 12px;
    color: #6b7280;
}

.selected-patient-details {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Lock Modal */
.ennu-lock-modal,
.ennu-lock-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10001;
    backdrop-filter: blur(4px);
}

.ennu-lock-modal.active,
.ennu-lock-modal-overlay.active {
    display: flex;
}

.lock-modal-title {
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 12px;
}

.lock-modal-message {
    font-size: 14px;
    color: #6b7280;
    margin-bottom: 20px;
}

.lock-modal-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    margin-bottom: 16px;
}

.lock-modal-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
}

/* ==========================================================================
   ACTION BUTTONS
   ========================================================================== */

.checkout-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px;
    background: linear-gradient(180deg, #f9fafb 0%, #fff 100%);
    border-top: 1px solid #e5e7eb;
}

.checkout-action-primary {
    width: 100%;
}

.checkout-action-secondary {
    width: 100%;
}

.checkout-action-tertiary {
    display: flex;
    gap: 8px;
}

.btn-process {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 24px;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    color: #fff;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: all 200ms ease;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

.btn-process:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(201, 169, 98, 0.4);
}

.btn-process:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.4);
}

.btn-process:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(201, 169, 98, 0.3);
}

.btn-process:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.btn-send-link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-3, 12px) var(--ennu-space-5, 20px);
    background: var(--ennu-white, #fff);
    color: var(--ennu-navy, #1a2744);
    border: 2px solid #e5e7eb;
    border-radius: var(--ennu-radius-lg, 10px);
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.btn-send-link:hover:not(:disabled) {
    border-color: var(--ennu-gold, #C9A962);
    background: var(--ennu-gold-50, #fffbeb);
}

.btn-send-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.3);
}

.btn-send-link:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-tertiary {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--ennu-space-1-5, 6px);
    padding: var(--ennu-space-2-5, 10px) var(--ennu-space-4, 16px);
    background: transparent;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-md, 8px);
    font-size: var(--ennu-text-xs, 13px);
    font-weight: var(--ennu-font-medium, 500);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.btn-tertiary:hover {
    background: #f3f4f6;
    color: #1f2937;
}

.btn-tertiary:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #d1d5db;
}

.btn-tertiary:active {
    background: #e5e7eb;
}

.btn-cancel {
    padding: var(--ennu-space-2-5, 10px) var(--ennu-space-5, 20px);
    background: transparent;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-md, 8px);
    font-weight: var(--ennu-font-medium, 500);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.btn-cancel:hover {
    background: #f3f4f6;
    color: #1f2937;
}

.btn-cancel:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #d1d5db;
}

.btn-create {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-2-5, 10px) var(--ennu-space-6, 24px);
    background: var(--ennu-primary-gradient);
    color: var(--ennu-white, #fff);
    border: none;
    border-radius: var(--ennu-radius-md, 8px);
    font-weight: var(--ennu-font-semibold, 600);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.btn-create:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

.btn-create:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.4);
}

.btn-create:active:not(:disabled) {
    transform: translateY(0);
}

.btn-create:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.btn-clear {
    padding: 6px;
    background: transparent;
    border: none;
    color: #9ca3af;
    cursor: pointer;
}

.btn-clear:hover {
    color: #ef4444;
}

.btn-text {
    display: inline-block;
}

.btn-secondary {
    padding: var(--ennu-space-2-5, 10px) var(--ennu-space-5, 20px);
    background: var(--ennu-white, #fff);
    color: var(--ennu-navy, #1a2744);
    border: 2px solid #e5e7eb;
    border-radius: var(--ennu-radius-md, 8px);
    font-weight: var(--ennu-font-semibold, 600);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.btn-secondary:hover {
    border-color: var(--ennu-gold, #C9A962);
    background: var(--ennu-gold-50, #fffbeb);
}

.btn-secondary:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.3);
}

.btn-secondary:active {
    background: rgba(201, 169, 98, 0.15);
}

.btn-add-item {
    display: inline-flex;
    align-items: center;
    gap: var(--ennu-space-1-5, 6px);
    padding: var(--ennu-space-2, 8px) var(--ennu-space-4, 16px);
    background: var(--ennu-success, #28a745);
    color: var(--ennu-white, #fff);
    border: none;
    border-radius: var(--ennu-radius, 6px);
    font-size: var(--ennu-text-xs, 13px);
    font-weight: var(--ennu-font-semibold, 600);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.btn-add-item:hover {
    background: var(--ennu-success-dark, #218838);
    transform: translateY(-1px);
}

.btn-add-item:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(40, 167, 69, 0.3);
}

.btn-remove-treatment {
    padding: 4px 8px;
    background: transparent;
    border: none;
    color: #dc3545;
    cursor: pointer;
}

.btn-link-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: transparent;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    transition: all 150ms ease;
}

.btn-link-action:hover {
    background: #f3f4f6;
}

.btn-link-action.btn-cancel {
    color: #dc3545;
    border-color: #dc3545;
}

.btn-link-action.btn-cancel:hover {
    background: #fef2f2;
}

.btn-use-balance {
    padding: 10px 20px;
    background: linear-gradient(135deg, #d4af37 0%, #b8963a 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
}

/* ==========================================================================
   PAYMENT LINK STATUS
   ========================================================================== */

.payment-link-status {
    background: linear-gradient(135deg, #e8f5ff 0%, #dbeafe 100%);
    border: 1px solid #93c5fd;
    border-radius: 10px;
    padding: 16px;
    margin-top: 16px;
}

.link-status-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: #1e40af;
    margin-bottom: 12px;
}

.link-status-info {
    margin-bottom: 12px;
}

.status-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
}

.status-label {
    font-size: 13px;
    color: #6b7280;
}

.status-value {
    font-size: 13px;
    font-weight: 600;
    color: #1f2937;
}

.status-icon {
    margin-right: 6px;
}

.link-actions {
    display: flex;
    gap: 8px;
}

/* ==========================================================================
   CONTENT HEADERS
   ========================================================================== */

.content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(180deg, #fff 0%, #f9fafb 100%);
}

.details-header {
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.details-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    color: #1a2744;
    margin-bottom: 4px;
}

.details-subtitle {
    font-size: 14px;
    color: #6b7280;
}

.details-content {
    padding: 24px;
}

.details-footer {
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

.details-panel {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

/* ==========================================================================
   SECTION TITLES
   ========================================================================== */

.section-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 18px;
    font-weight: 600;
    color: #1a2744;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.section-title .dashicons {
    color: #C9A962;
}

/* ==========================================================================
   LOADING STATES
   ========================================================================== */

.loading-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.9);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 100;
    backdrop-filter: blur(2px);
}

.loading-overlay.active {
    display: flex;
}

.loading-message {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 32px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.loading-spinner,
.spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: #C9A962;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.loading-state {
    padding: 40px;
    text-align: center;
    color: #6b7280;
}

/* ==========================================================================
   SUCCESS/NOTIFICATIONS
   ========================================================================== */

.checkout-success-panel {
    display: none;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    padding: 40px;
}

.checkout-success-panel.active {
    display: flex;
}

.success-content {
    text-align: center;
    max-width: 400px;
}

.success-checkmark {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: success-pulse 2s ease-in-out infinite;
}

.success-checkmark .dashicons {
    font-size: 40px;
    color: #28a745;
}

.confirmation-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.confirmation-text {
    font-size: 16px;
    color: #155724;
    font-weight: 500;
}

.notification {
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.notification.success {
    background: #d4edda;
    border: 1px solid #28a745;
    color: #155724;
}

.notification.error {
    background: #f8d7da;
    border: 1px solid #dc3545;
    color: #721c24;
}

.notification.warning {
    background: #fff3cd;
    border: 1px solid #ffc107;
    color: #856404;
}

.notification.info {
    background: #d1ecf1;
    border: 1px solid #17a2b8;
    color: #0c5460;
}

/* ==========================================================================
   ORDER HISTORY/NOTES
   ========================================================================== */

.order-history-section {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

.history-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.order-note-item {
    padding: 12px 16px;
    background: #f9fafb;
    border-radius: 8px;
    margin-bottom: 8px;
    border-left: 3px solid #C9A962;
}

.order-link {
    color: #1e40af;
    text-decoration: none;
    font-weight: 500;
}

.order-link:hover {
    text-decoration: underline;
}

.order-status-badge {
    display: inline-flex;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 12px;
}

.order-status-badge.completed {
    background: #d4edda;
    color: #155724;
}

.order-status-badge.pending {
    background: #fff3cd;
    color: #856404;
}

.order-status-badge.failed {
    background: #f8d7da;
    color: #721c24;
}

.order-completed-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    border: 1px solid #28a745;
    border-radius: 10px;
    margin-bottom: 20px;
}

/* ==========================================================================
   PRODUCTS AREA SELECTOR
   ========================================================================== */

.area-selector {
    background: #f9fafb;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
}

.area-selector-title {
    font-size: 14px;
    font-weight: 600;
    color: #1a2744;
    margin-bottom: 12px;
}

.area-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
}

.area-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: all 150ms ease;
}

.area-item:hover {
    border-color: #C9A962;
}

.area-item.selected {
    border-color: #C9A962;
    background: #fffbeb;
}

.area-checkbox {
    width: 18px;
    height: 18px;
    accent-color: #C9A962;
}

.area-name {
    font-size: 13px;
    font-weight: 500;
}

.area-info {
    font-size: 11px;
    color: #6b7280;
}

.area-bilateral {
    font-size: 10px;
    color: #C9A962;
    font-weight: 600;
}

.area-units-input {
    width: 60px;
    padding: 4px 8px;
    font-size: 12px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    text-align: center;
}

.area-clear-btn {
    padding: 4px 8px;
    background: transparent;
    border: none;
    color: #dc3545;
    font-size: 12px;
    cursor: pointer;
}

/* Custom Units */
.custom-units-section {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed #e5e7eb;
}

.custom-units-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #6b7280;
    cursor: pointer;
}

.custom-units-input {
    width: 80px;
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    text-align: center;
}

/* ==========================================================================
   PRODUCT CARDS (in modal)
   ========================================================================== */

.product-card {
    display: flex;
    align-items: flex-start;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-4, 16px);
    background: var(--ennu-white, #fff);
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-lg, 10px);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
}

.product-card:hover {
    border-color: var(--ennu-gold, #C9A962);
    box-shadow: var(--ennu-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));
    transform: translateY(-2px);
}

.product-card.selected {
    border-color: var(--ennu-gold, #C9A962);
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.1) 0%, rgba(201, 169, 98, 0.05) 100%);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.product-card:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.4);
}

.product-icon {
    width: 48px;
    height: 48px;
    background: #f3f4f6;
    border-radius: var(--ennu-radius-md, 8px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.product-info {
    flex: 1;
    min-width: 0;
}

.product-name {
    font-size: var(--ennu-text-sm, 14px);
    font-weight: var(--ennu-font-semibold, 600);
    color: #1f2937;
    margin-bottom: var(--ennu-space-1, 4px);
}

.product-meta {
    font-size: var(--ennu-text-xs, 12px);
    color: #6b7280;
}

.product-sku {
    font-size: 11px;
    color: #9ca3af;
}

.product-category {
    font-size: 11px;
    color: #6b7280;
    background: #f3f4f6;
    padding: 2px 6px;
    border-radius: var(--ennu-radius-sm, 4px);
    display: inline-block;
}

.product-pricing {
    text-align: right;
    flex-shrink: 0;
}

.product-price {
    font-size: var(--ennu-text-base, 16px);
    font-weight: var(--ennu-font-bold, 700);
    color: var(--ennu-navy, #1a2744);
}

.product-member-price {
    font-size: var(--ennu-text-xs, 12px);
    color: var(--ennu-gold, #C9A962);
    font-weight: var(--ennu-font-semibold, 600);
}

.product-unit {
    font-size: 11px;
    color: #6b7280;
}

.products-panel {
    padding: var(--ennu-space-5, 20px);
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--ennu-space-3, 12px);
}

.product-result-item {
    display: flex;
    align-items: center;
    gap: var(--ennu-space-3, 12px);
    padding: var(--ennu-space-2-5, 10px) var(--ennu-space-3, 12px);
    cursor: pointer;
    transition: background var(--ennu-duration-150, 150ms) ease;
    border-radius: var(--ennu-radius-md, 8px);
}

.product-result-item:hover {
    background: #f3f4f6;
}

/* Category Tabs */
.category-tabs {
    display: flex;
    gap: var(--ennu-space-2, 8px);
    padding: var(--ennu-space-3, 12px) var(--ennu-space-5, 20px);
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    overflow-x: auto;
}

.category-tab {
    padding: var(--ennu-space-2, 8px) var(--ennu-space-4, 16px);
    font-size: var(--ennu-text-xs, 13px);
    font-weight: var(--ennu-font-medium, 500);
    color: #6b7280;
    background: var(--ennu-white, #fff);
    border: 1px solid #e5e7eb;
    border-radius: var(--ennu-radius-full, 20px);
    cursor: pointer;
    transition: all var(--ennu-duration-150, 150ms) ease;
    white-space: nowrap;
}

.category-tab:hover {
    border-color: var(--ennu-gold, #C9A962);
    background: var(--ennu-gold-50, #fffbeb);
}

.category-tab:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--ennu-gold, #C9A962);
}

.category-tab.active {
    background: var(--ennu-navy, #1a2744);
    border-color: var(--ennu-navy, #1a2744);
    color: var(--ennu-white, #fff);
}

.category-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    font-size: 10px;
    font-weight: var(--ennu-font-semibold, 600);
    background: #e5e7eb;
    color: #4b5563;
    border-radius: 9px;
    margin-left: var(--ennu-space-1-5, 6px);
}

.category-tab.active .category-count {
    background: rgba(255, 255, 255, 0.2);
    color: var(--ennu-white, #fff);
}

/* ==========================================================================
   SEARCH BAR
   ========================================================================== */

.search-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    margin-bottom: 16px;
}

.search-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 14px;
    outline: none;
}

.search-loading {
    width: 20px;
    height: 20px;
    border: 2px solid #e5e7eb;
    border-top-color: #C9A962;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

/* ==========================================================================
   BADGES & TAGS
   ========================================================================== */

.badge-deposit {
    background: #fef3c7;
    color: #92400e;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}

.badge-initial {
    background: #dbeafe;
    color: #1e40af;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}

.badge-tax-exempt {
    background: #d4edda;
    color: #155724;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}

.badge-taxable {
    background: #fef3c7;
    color: #92400e;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}

.badge-tax-toggle {
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 12px;
    cursor: pointer;
    transition: all 150ms ease;
}

.badge-tip {
    background: #C9A962;
    color: #fff;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
}

.badge-text {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.balance-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    color: #fff;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 700;
}

.total-balance-badge {
    font-size: 16px;
    font-weight: 800;
    color: #C9A962;
}

/* ==========================================================================
   MISC COMPONENTS
   ========================================================================== */

.no-results {
    padding: 40px 20px;
    text-align: center;
    color: #6b7280;
}

.no-results .dashicons {
    font-size: 48px;
    color: #d1d5db;
    margin-bottom: 12px;
}

.savings-amount {
    font-size: 16px;
    font-weight: 700;
    color: #28a745;
}

.savings-text {
    font-size: 13px;
    color: #155724;
}

.savings-icon {
    color: #28a745;
}

.savings-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #28a745;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.add-button,
.add-item-section {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.btn-add-custom-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-add-custom-item:hover {
    background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(217, 119, 6, 0.3);
}

.btn-add-custom-item:active {
    transform: translateY(0);
}

.btn-add-custom-item .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* Custom Item Modal Styles */
#custom-item-modal .modal-container {
    max-width: 420px;
}

#custom-item-modal .form-group {
    margin-bottom: 16px;
}

#custom-item-modal .form-group label {
    display: block;
    font-weight: 600;
    font-size: 13px;
    color: #374151;
    margin-bottom: 6px;
}

#custom-item-modal .form-group label .required {
    color: #ef4444;
}

#custom-item-modal .form-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    transition: border-color 0.2s, box-shadow 0.2s;
}

#custom-item-modal .form-input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

#custom-item-modal .input-with-prefix {
    display: flex;
    align-items: stretch;
}

#custom-item-modal .input-prefix {
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-right: none;
    border-radius: 6px 0 0 6px;
    font-weight: 600;
    color: #6b7280;
}

#custom-item-modal .input-with-prefix .form-input {
    border-radius: 0 6px 6px 0;
}

#custom-item-modal .checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 500;
}

#custom-item-modal .checkbox-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #3b82f6;
}

#custom-item-modal textarea.form-input {
    resize: vertical;
    min-height: 60px;
}

#custom-item-modal .modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 20px;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
    border-radius: 0 0 12px 12px;
}

#custom-item-modal .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
}

#custom-item-modal .btn-cancel {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}

#custom-item-modal .btn-cancel:hover {
    background: #e5e7eb;
}

#custom-item-modal .btn-primary {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
    border: none;
}

#custom-item-modal .btn-primary:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
}

#custom-item-modal .btn-primary .dashicons {
    font-size: 16px;
}

.amount-preview {
    font-size: 14px;
    font-weight: 500;
    color: #1a2744;
}

.quick-cash-btn {
    padding: 10px;
    background: #fff;
    color: #155724;
    border: 2px solid #28a745;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
}

.quick-cash-btn:hover {
    background: #d4edda;
}

.quick-cash-btn.selected {
    background: #28a745;
    color: #fff;
}

/* Edit Lock Warning */
.ennu-edit-lock-warning {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 8px;
    margin-bottom: 16px;
}

.lock-message {
    flex: 1;
    font-size: 14px;
    color: #856404;
}

.lock-actions {
    display: flex;
    gap: 8px;
}

.takeover-btn,
.view-only-btn,
.request-edit-btn {
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
}

.takeover-btn {
    background: #C9A962;
    color: #fff;
    border: none;
}

.view-only-btn {
    background: #fff;
    color: #6b7280;
    border: 1px solid #d1d5db;
}

.request-edit-btn {
    background: #3b82f6;
    color: #fff;
    border: none;
}

/* Readonly Badge */
.ennu-readonly-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .ennu-checkout-interface-enhanced,
    .ennu-checkout-interface-enhanced * {
        animation-duration: 0ms !important;
        transition-duration: 0ms !important;
    }
}

/* Print styles */
@media print {
    .ennu-checkout-interface-enhanced {
        background: white;
        padding: 0;
    }

    .checkout-stats-bar,
    .ennu-autosave-status,
    .ennu-btn,
    .patient-card-lock {
        display: none !important;
    }

    .patient-card,
    .order-details-panel {
        box-shadow: none;
        border: 1px solid #ccc;
    }
}

/* ==========================================================================
   2025-01-03: CSS REFINEMENT FIXES
   Addresses: filters layout, center panel header, payment panel, balance displays
   ========================================================================== */

/* -----------------------------------------------------------------------------
   FIX: FILTERS LAYOUT - Make inline with tabs row
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .checkout-tabs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding: 12px 24px;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .checkout-tabs .checkout-tab {
    height: auto !important;
    min-height: unset !important;
    padding: 8px 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 9999px;
    white-space: nowrap;
    flex-shrink: 0;
}

.ennu-checkout-interface-enhanced .checkout-header-filters {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-left: auto;
}

.ennu-checkout-interface-enhanced .checkout-header-filters .checkout-header-select {
    min-width: 140px;
    padding: 8px 12px;
    font-size: 13px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
}

.ennu-checkout-interface-enhanced .checkout-header-filters .search-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 0 12px;
    min-width: 200px;
}

.ennu-checkout-interface-enhanced .checkout-header-filters .search-wrapper input {
    border: none;
    outline: none;
    padding: 8px 0;
    font-size: 13px;
    flex: 1;
    background: transparent;
}

/* -----------------------------------------------------------------------------
   FIX: CENTER PANEL PATIENT HEADER
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .selected-patient-header {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 20px;
    align-items: start;
    padding: 20px;
    background: linear-gradient(135deg, #f9fafb 0%, rgba(201, 169, 98, 0.05) 100%);
    border-radius: 12px;
    margin-bottom: 20px;
    border: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .selected-patient-header .patient-avatar,
.ennu-checkout-interface-enhanced .selected-patient-header .selected-patient-avatar {
    width: 70px;
    height: 70px;
    min-width: 70px;
    min-height: 70px;
    border-radius: 50%;
    background: linear-gradient(135deg, #C9A962 0%, #A68B4B 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    flex-shrink: 0;
    overflow: hidden;
}

/* Avatar image inside enhanced header */
.ennu-checkout-interface-enhanced .selected-patient-header .selected-patient-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* Dashicon fallback in enhanced header */
.ennu-checkout-interface-enhanced .selected-patient-header .selected-patient-avatar .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
}

.ennu-checkout-interface-enhanced .selected-patient-header h2 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 24px;
    font-weight: 500;
    color: #1a2744;
    margin: 0 0 8px 0;
}

.ennu-checkout-interface-enhanced .selected-patient-header .patient-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px 24px;
    font-size: 13px;
    color: #4b5563;
}

.ennu-checkout-interface-enhanced .selected-patient-header .patient-meta-grid > div {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ennu-checkout-interface-enhanced .selected-patient-header .patient-meta-grid strong {
    color: #1f2937;
    font-weight: 600;
}

/* Location badge with tax info */
.ennu-checkout-interface-enhanced .location-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #1a2744;
    color: #fff;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
}

.ennu-checkout-interface-enhanced .tax-badge {
    display: inline-flex;
    padding: 3px 8px;
    background: #059669;
    color: #fff;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    margin-left: 8px;
}

/* Provider display */
.ennu-checkout-interface-enhanced .provider-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #f3f4f6;
    color: #4b5563;
    border-radius: 6px;
    font-size: 12px;
    cursor: pointer;
    border: 1px dashed #d1d5db;
}

.ennu-checkout-interface-enhanced .provider-badge:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

/* View Face Chart button */
.ennu-checkout-interface-enhanced .view-face-chart-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 150ms ease;
    white-space: nowrap;
}

.ennu-checkout-interface-enhanced .view-face-chart-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

/* -----------------------------------------------------------------------------
   FIX: AUTOSAVE STATUS BAR
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .ennu-autosave-status {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    background: #f0fdf4;
    border-bottom: 1px solid #bbf7d0;
    font-size: 13px;
    color: #166534;
}

.ennu-checkout-interface-enhanced .ennu-autosave-status .status-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ennu-checkout-interface-enhanced .ennu-autosave-status .last-saved-info {
    font-size: 12px;
    color: #6b7280;
}

/* -----------------------------------------------------------------------------
   FIX: MEMBER BALANCE & GIFT CARD BALANCE BANNERS
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .ennu-member-balance-banner,
.ennu-checkout-interface-enhanced .ennu-member-join-banner {
    display: flex !important;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #1a2744 0%, #2d3e5f 100%);
    border-radius: 12px;
    margin-bottom: 16px;
}

.ennu-checkout-interface-enhanced .ennu-member-balance-banner .ennu-mb-icon,
.ennu-checkout-interface-enhanced .ennu-member-join-banner .ennu-mb-icon {
    font-size: 28px;
    color: #C9A962;
}

.ennu-checkout-interface-enhanced .ennu-member-balance-banner-content {
    flex: 1;
}

.ennu-checkout-interface-enhanced .ennu-member-balance-banner-title {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 2px;
}

.ennu-checkout-interface-enhanced .ennu-member-balance-banner-amount {
    font-size: 24px;
    font-weight: 700;
    color: #C9A962;
}

.ennu-checkout-interface-enhanced .ennu-member-join-content {
    flex: 1;
}

.ennu-checkout-interface-enhanced .ennu-member-join-title {
    font-size: 15px;
    font-weight: 600;
    color: #fff;
}

.ennu-checkout-interface-enhanced .ennu-member-join-subtitle {
    font-size: 12px;
    color: rgba(255,255,255,0.7);
}

.ennu-checkout-interface-enhanced .ennu-member-join-btn {
    padding: 8px 16px;
    background: #C9A962;
    color: #1a2744;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
}

.ennu-checkout-interface-enhanced .ennu-member-join-btn:hover {
    background: #d4b872;
}

/* Gift Card Balance Banner */
.ennu-checkout-interface-enhanced .gift-card-balance-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 1px solid #f59e0b;
    border-radius: 10px;
    margin-bottom: 16px;
}

.ennu-checkout-interface-enhanced .gift-card-balance-banner .gc-icon {
    font-size: 24px;
}

.ennu-checkout-interface-enhanced .gift-card-balance-banner .gc-content {
    flex: 1;
}

.ennu-checkout-interface-enhanced .gift-card-balance-banner .gc-title {
    font-size: 12px;
    font-weight: 600;
    color: #92400e;
}

.ennu-checkout-interface-enhanced .gift-card-balance-banner .gc-amount {
    font-size: 20px;
    font-weight: 700;
    color: #b45309;
}

/* -----------------------------------------------------------------------------
   FIX: PAYMENT PANEL - Remove scrolling, improve layout
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .payment-panel {
    max-height: none !important;
    overflow: visible;
}

.ennu-checkout-interface-enhanced .payment-panel .summary-section {
    overflow: visible !important;
    max-height: none !important;
    padding: 20px;
    background: transparent;
}

/* Order Items List - Compact display */
.ennu-checkout-interface-enhanced .order-items-summary {
    background: #f9fafb;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 16px;
    border: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .order-items-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px dashed #d1d5db;
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.ennu-checkout-interface-enhanced .order-items-count {
    background: #e5e7eb;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    color: #6b7280;
}

.ennu-checkout-interface-enhanced .order-item-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    font-size: 13px;
}

.ennu-checkout-interface-enhanced .order-item-name {
    color: #374151;
    flex: 1;
}

.ennu-checkout-interface-enhanced .order-item-type {
    font-size: 10px;
    padding: 2px 6px;
    background: #dbeafe;
    color: #1e40af;
    border-radius: 4px;
    margin-left: 8px;
}

.ennu-checkout-interface-enhanced .order-item-qty {
    font-size: 11px;
    color: #6b7280;
    margin-left: 8px;
}

.ennu-checkout-interface-enhanced .order-item-price {
    font-weight: 600;
    color: #1f2937;
    margin-left: 12px;
}

/* Subtotal/Tax/Total rows */
.ennu-checkout-interface-enhanced .totals-section {
    padding: 16px 0;
    border-top: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .totals-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    font-size: 14px;
}

.ennu-checkout-interface-enhanced .totals-row.subtotal {
    color: #4b5563;
}

.ennu-checkout-interface-enhanced .totals-row.tax {
    color: #6b7280;
    font-size: 13px;
}

.ennu-checkout-interface-enhanced .totals-row.total {
    padding-top: 12px;
    margin-top: 8px;
    border-top: 2px solid #1a2744;
}

.ennu-checkout-interface-enhanced .totals-row.total .totals-label {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 18px;
    font-weight: 600;
    color: #1a2744;
}

.ennu-checkout-interface-enhanced .totals-row.total .totals-value {
    font-size: 28px;
    font-weight: 800;
    color: #C9A962;
}

/* Tax breakdown collapsible */
.ennu-checkout-interface-enhanced .tax-breakdown {
    background: #f0fdf4;
    border-radius: 8px;
    padding: 10px 14px;
    margin: 8px 0;
    font-size: 12px;
}

.ennu-checkout-interface-enhanced .tax-breakdown-header {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #166534;
    font-weight: 600;
    margin-bottom: 6px;
}

.ennu-checkout-interface-enhanced .tax-breakdown-item {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
    color: #15803d;
}

/* -----------------------------------------------------------------------------
   FIX: PAYMENT METHOD CARDS - Improved visual design
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .payment-methods-section {
    margin-top: 20px;
    padding: 12px;
    border-top: 1px solid #e5e7eb;
    background: #fafafa;
    border-radius: 8px;
}

.ennu-checkout-interface-enhanced .payment-methods-section h4 {
    font-size: 15px;
    font-weight: 600;
    color: #1a2744;
    margin: 0 0 16px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Payment method cards grid */
.ennu-checkout-interface-enhanced .payment-method-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 16px;
}

.ennu-checkout-interface-enhanced .payment-method-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 12px;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 200ms ease;
    text-align: center;
}

.ennu-checkout-interface-enhanced .payment-method-card:hover {
    border-color: #C9A962;
    background: #fffbeb;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.ennu-checkout-interface-enhanced .payment-method-card.selected {
    border-color: #C9A962;
    background: linear-gradient(135deg, rgba(201, 169, 98, 0.15) 0%, rgba(201, 169, 98, 0.05) 100%);
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.2);
}

.ennu-checkout-interface-enhanced .payment-method-card.selected::before {
    content: '✓';
    position: absolute;
    top: 8px;
    right: 8px;
    width: 20px;
    height: 20px;
    background: #C9A962;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: bold;
}

.ennu-checkout-interface-enhanced .payment-method-card .pm-icon {
    font-size: 28px;
    color: #6b7280;
    transition: color 150ms ease;
}

.ennu-checkout-interface-enhanced .payment-method-card:hover .pm-icon,
.ennu-checkout-interface-enhanced .payment-method-card.selected .pm-icon {
    color: #C9A962;
}

.ennu-checkout-interface-enhanced .payment-method-card .pm-title {
    font-size: 13px;
    font-weight: 600;
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .payment-method-card .pm-subtitle {
    font-size: 11px;
    color: #6b7280;
}

/* Expandable payment method sections */
.ennu-checkout-interface-enhanced .payment-method-expandable {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    margin-bottom: 10px;
    overflow: hidden;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: #f9fafb;
    cursor: pointer;
    transition: background 150ms ease;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-header:hover {
    background: #f3f4f6;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-header-content {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-icon {
    font-size: 20px;
    color: #6b7280;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-title {
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-subtitle {
    font-size: 11px;
    color: #9ca3af;
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-chevron {
    font-size: 18px;
    color: #9ca3af;
    transition: transform 200ms ease;
}

.ennu-checkout-interface-enhanced .payment-method-expandable.expanded .pme-chevron {
    transform: rotate(180deg);
}

.ennu-checkout-interface-enhanced .payment-method-expandable .pme-content {
    padding: 16px;
    background: #fff;
    border-top: 1px solid #e5e7eb;
    display: none;
}

.ennu-checkout-interface-enhanced .payment-method-expandable.expanded .pme-content {
    display: block;
}

/* -----------------------------------------------------------------------------
   FIX: COUPON/GIFT CARD INPUT
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .coupon-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .coupon-section h4 {
    font-size: 14px;
    font-weight: 600;
    color: #1a2744;
    margin: 0 0 12px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ennu-checkout-interface-enhanced .coupon-input-wrapper {
    display: flex;
    gap: 8px;
}

.ennu-checkout-interface-enhanced .coupon-input-wrapper input {
    flex: 1;
    padding: 10px 14px;
    font-size: 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
}

.ennu-checkout-interface-enhanced .coupon-input-wrapper input:focus {
    outline: none;
    border-color: #C9A962;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15);
}

.ennu-checkout-interface-enhanced .coupon-input-wrapper button {
    padding: 10px 20px;
    background: #1a2744;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
}

.ennu-checkout-interface-enhanced .coupon-input-wrapper button:hover {
    background: #2d3e5f;
}

.ennu-checkout-interface-enhanced .gift-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: 13px;
    color: #C9A962;
    text-decoration: none;
    font-weight: 500;
}

.ennu-checkout-interface-enhanced .gift-card-link:hover {
    text-decoration: underline;
}

/* -----------------------------------------------------------------------------
   FIX: ACTION BUTTONS
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .checkout-actions {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.ennu-checkout-interface-enhanced .btn-checkout-primary {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 24px;
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%);
    color: #fff;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: all 200ms ease;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

.ennu-checkout-interface-enhanced .btn-checkout-primary:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(201, 169, 98, 0.4);
}

.ennu-checkout-interface-enhanced .btn-checkout-primary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.ennu-checkout-interface-enhanced .btn-checkout-secondary {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    background: #fff;
    color: #1a2744;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
    margin-top: 10px;
}

.ennu-checkout-interface-enhanced .btn-checkout-secondary:hover:not(:disabled) {
    border-color: #C9A962;
    background: #fffbeb;
}

.ennu-checkout-interface-enhanced .btn-checkout-secondary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.ennu-checkout-interface-enhanced .secondary-actions {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

.ennu-checkout-interface-enhanced .secondary-actions button {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    background: transparent;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 150ms ease;
}

.ennu-checkout-interface-enhanced .secondary-actions button:hover {
    background: #f3f4f6;
    color: #1f2937;
}

/* ==========================================================================
   2025-01-03: CRITICAL FIXES FOR REPORTED ISSUES
   ========================================================================== */

/* -----------------------------------------------------------------------------
   FIX 1: SUMMARY SECTION - NO SCROLLING
   Make summary section flow naturally without internal scroll
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .summary-section,
.summary-section {
    overflow: visible !important;
    overflow-y: visible !important;
    max-height: none !important;
    flex: none !important;
}

.ennu-checkout-interface-enhanced .right-panel,
.right-panel {
    overflow: visible !important;
    overflow-y: auto !important;
    max-height: none !important;
}

.ennu-checkout-interface-enhanced .payment-panel,
.payment-panel {
    overflow: visible !important;
    max-height: none !important;
}

/* -----------------------------------------------------------------------------
   FIX 2: PAYMENT METHODS - FULL WIDTH
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .payment-method-card,
.payment-method-card {
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    margin-bottom: 10px !important;
}

/* Grid layout for payment tiles - two-row layout */
.ennu-checkout-interface-enhanced .payment-methods-grid,
.payment-methods-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
    width: 100% !important;
}

.ennu-checkout-interface-enhanced .payment-method-expandable,
.payment-method-expandable {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* -----------------------------------------------------------------------------
   FIX 3: PANEL HEADERS - WHITE TEXT ON DARK BACKGROUND
   Force white text on all dark panel headers
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .panel-title,
.panel-title,
.ennu-checkout-interface-enhanced .panel-header,
.panel-header,
.ennu-checkout-interface-enhanced .center-panel-header,
.center-panel-header,
.ennu-checkout-interface-enhanced .patient-detail-header,
.patient-detail-header {
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .panel-title *,
.panel-title *,
.ennu-checkout-interface-enhanced .panel-header *,
.panel-header *,
.ennu-checkout-interface-enhanced .center-panel-header h2,
.ennu-checkout-interface-enhanced .center-panel-header h3,
.ennu-checkout-interface-enhanced .center-panel-header span,
.center-panel-header h2,
.center-panel-header h3,
.center-panel-header span,
.patient-detail-header h2,
.patient-detail-header h3,
.patient-detail-header span,
.patient-detail-header a {
    color: #ffffff !important;
}

/* Override any dark text in headers */
.ennu-checkout-interface-enhanced .patient-detail-header .patient-name,
.patient-detail-header .patient-name {
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .patient-detail-header .patient-meta,
.patient-detail-header .patient-meta,
.ennu-checkout-interface-enhanced .patient-detail-header .patient-meta span,
.patient-detail-header .patient-meta span {
    color: rgba(255, 255, 255, 0.9) !important;
}

.ennu-checkout-interface-enhanced .patient-detail-header .badge,
.patient-detail-header .badge,
.ennu-checkout-interface-enhanced .patient-detail-header .location-badge,
.patient-detail-header .location-badge {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

/* -----------------------------------------------------------------------------
   FIX 4: LEFT PANEL HEADER - WHITE TEXT
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .left-panel .panel-title,
.left-panel .panel-title,
.ennu-checkout-interface-enhanced .patients-panel .panel-title,
.patients-panel .panel-title {
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .left-panel .panel-title span,
.left-panel .panel-title span,
.ennu-checkout-interface-enhanced .patients-panel .panel-title span,
.patients-panel .panel-title span {
    color: #ffffff !important;
}

/* FIX 5: LEGACY - Patient card styles moved to v1.9.5+ section at end of file */

/* Patient list - allow scrolling but cards expand */
.ennu-checkout-interface-enhanced .patient-list,
.patient-list {
    overflow-y: auto !important;
    max-height: calc(100vh - 300px);
}

/* -----------------------------------------------------------------------------
   FIX 6: MEMBERSHIP BANNER - REMOVE DOUBLE CONTAINER
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .membership-banner,
.membership-banner,
.ennu-checkout-interface-enhanced .member-join-banner,
.member-join-banner,
.ennu-checkout-interface-enhanced .ennu-membership-upsell,
.ennu-membership-upsell {
    background: linear-gradient(135deg, #C9A962 0%, #b8963a 100%) !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin: 16px 0 !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.25) !important;
}

/* Remove any nested container styling */
.ennu-checkout-interface-enhanced .membership-banner > div,
.membership-banner > div,
.ennu-checkout-interface-enhanced .member-join-banner > div,
.member-join-banner > div {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner .membership-content,
.membership-banner .membership-content,
.ennu-checkout-interface-enhanced .member-join-banner .banner-content,
.member-join-banner .banner-content {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner h4,
.membership-banner h4,
.ennu-checkout-interface-enhanced .member-join-banner h4,
.member-join-banner h4 {
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    margin: 0 0 8px 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner p,
.membership-banner p,
.ennu-checkout-interface-enhanced .member-join-banner p,
.member-join-banner p {
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: 14px !important;
    margin: 0 0 12px 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner .btn,
.membership-banner .btn,
.ennu-checkout-interface-enhanced .member-join-banner .btn,
.member-join-banner .btn,
.ennu-checkout-interface-enhanced .membership-banner button,
.membership-banner button,
.ennu-checkout-interface-enhanced .member-join-banner button,
.member-join-banner button {
    background: #1a2744 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}

.ennu-checkout-interface-enhanced .membership-banner .btn:hover,
.membership-banner .btn:hover,
.ennu-checkout-interface-enhanced .member-join-banner .btn:hover,
.member-join-banner .btn:hover {
    background: #2d3e5f !important;
}

/* -----------------------------------------------------------------------------
   FIX 7: TIMESTAMP AND BALANCES - PROPER LAYOUT
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .patient-detail-header .header-meta,
.patient-detail-header .header-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px !important;
}

.ennu-checkout-interface-enhanced .timestamp,
.timestamp,
.ennu-checkout-interface-enhanced .check-in-time,
.check-in-time {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px !important;
    background: rgba(255, 255, 255, 0.15) !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    font-size: 13px !important;
    white-space: nowrap !important;
}

.ennu-checkout-interface-enhanced .member-balance,
.member-balance,
.ennu-checkout-interface-enhanced .gift-card-balance,
.gift-card-balance,
.ennu-checkout-interface-enhanced .rewards-balance,
.rewards-balance {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 12px !important;
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}

.ennu-checkout-interface-enhanced .member-balance .balance-amount,
.member-balance .balance-amount,
.ennu-checkout-interface-enhanced .gift-card-balance .balance-amount,
.gift-card-balance .balance-amount,
.ennu-checkout-interface-enhanced .rewards-balance .balance-amount,
.rewards-balance .balance-amount {
    color: #C9A962 !important;
    font-weight: 700 !important;
}

/* -----------------------------------------------------------------------------
   FIX 8: PAYMENT PANEL VISUAL IMPROVEMENTS
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .payment-panel .section-title,
.payment-panel .section-title {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1a2744 !important;
    margin: 0 0 12px 0 !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid #e5e7eb !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.ennu-checkout-interface-enhanced .payment-panel .section-title .dashicons,
.payment-panel .section-title .dashicons {
    color: #C9A962 !important;
    font-size: 18px !important;
}

/* Payment method cards - cleaner look */
.ennu-checkout-interface-enhanced .payment-method-card,
.payment-method-card {
    background: #ffffff !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 14px 16px !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
}

.ennu-checkout-interface-enhanced .payment-method-card:hover,
.payment-method-card:hover {
    border-color: #C9A962 !important;
    background: #fffbeb !important;
}

.ennu-checkout-interface-enhanced .payment-method-card.selected,
.payment-method-card.selected,
.ennu-checkout-interface-enhanced .payment-method-card.active,
.payment-method-card.active {
    border-color: #C9A962 !important;
    background: #fffbeb !important;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.2) !important;
}

.ennu-checkout-interface-enhanced .payment-method-card .method-icon,
.payment-method-card .method-icon {
    font-size: 22px !important;
    color: #6b7280 !important;
}

.ennu-checkout-interface-enhanced .payment-method-card.selected .method-icon,
.payment-method-card.selected .method-icon,
.ennu-checkout-interface-enhanced .payment-method-card.active .method-icon,
.payment-method-card.active .method-icon {
    color: #C9A962 !important;
}

.ennu-checkout-interface-enhanced .payment-method-card .method-name,
.payment-method-card .method-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
}

.ennu-checkout-interface-enhanced .payment-method-card .method-description,
.payment-method-card .method-description {
    font-size: 12px !important;
    color: #6b7280 !important;
}

/* Order summary - clean layout */
.ennu-checkout-interface-enhanced .order-summary,
.order-summary {
    background: #f9fafb !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin-bottom: 16px !important;
}

.ennu-checkout-interface-enhanced .order-summary .summary-row,
.order-summary .summary-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    font-size: 14px !important;
}

.ennu-checkout-interface-enhanced .order-summary .summary-row.total,
.order-summary .summary-row.total {
    border-top: 2px solid #e5e7eb !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
}

.ennu-checkout-interface-enhanced .order-summary .summary-row.total .summary-value,
.order-summary .summary-row.total .summary-value {
    color: #C9A962 !important;
    font-size: 20px !important;
}

/* -----------------------------------------------------------------------------
   FIX 9: RIGHT PANEL OVERALL STRUCTURE
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .right-panel,
.right-panel,
.ennu-checkout-interface-enhanced .payment-summary-panel,
.payment-summary-panel {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    max-height: none !important;
}

.ennu-checkout-interface-enhanced .right-panel > *,
.right-panel > * {
    flex-shrink: 0 !important;
}

/* Ensure checkout actions are always visible */
.ennu-checkout-interface-enhanced .checkout-actions,
.checkout-actions {
    margin-top: auto !important;
    padding-top: 16px !important;
    border-top: 1px solid #e5e7eb !important;
    background: #ffffff !important;
}

/* -----------------------------------------------------------------------------
   FIX 10: CENTER PANEL HEADER - ENSURE VISIBLE
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .center-panel .panel-header,
.center-panel .panel-header,
.ennu-checkout-interface-enhanced .patient-detail-header,
.patient-detail-header {
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%) !important;
    padding: 16px 20px !important;
    border-radius: 12px 12px 0 0 !important;
    border-bottom: 3px solid #C9A962 !important;
}

.ennu-checkout-interface-enhanced .center-panel .panel-header h2,
.center-panel .panel-header h2,
.ennu-checkout-interface-enhanced .center-panel .panel-header h3,
.center-panel .panel-header h3 {
    color: #ffffff !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    margin: 0 !important;
}

/* ==========================================================================
   2025-01-03 v1.7.0: ADDITIONAL UI REFINEMENTS
   ========================================================================== */

/* -----------------------------------------------------------------------------
   LEFT PANEL HEADER - WHITE TEXT ON DARK BACKGROUND
   Fix "Checked-In Patients" header text visibility
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .left-panel h2,
.ennu-checkout-interface-enhanced .left-panel .panel-title,
.ennu-checkout-interface-enhanced .left-panel .panel-header,
.ennu-checkout-interface-enhanced .left-panel .panel-header h2,
.ennu-checkout-interface-enhanced .left-panel .panel-header span,
.ennu-checkout-interface-enhanced [class*="checked-in"] h2,
.ennu-checkout-interface-enhanced aside h2,
.ennu-checkout-interface-enhanced aside[class*="panel"] h2,
.ennu-checkout-interface-enhanced .patient-list-header,
.ennu-checkout-interface-enhanced .patient-list-header *,
.ennu-checkout-interface-enhanced aside .panel-header *,
aside.left-panel .panel-header,
aside.left-panel .panel-header * {
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .left-panel .panel-header,
.ennu-checkout-interface-enhanced aside .panel-header,
aside[class*="panel"] .panel-header {
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%) !important;
    border-bottom: 3px solid #C9A962 !important;
    padding: 16px 20px !important;
    border-radius: 12px 12px 0 0 !important;
}

.ennu-checkout-interface-enhanced .left-panel .panel-header .badge,
.ennu-checkout-interface-enhanced aside .panel-header .badge {
    background: #C9A962 !important;
    color: #1A2744 !important;
    font-weight: 600 !important;
}

/* Right panel header fix - Payment Summary */
.ennu-checkout-interface-enhanced .right-panel h2,
.ennu-checkout-interface-enhanced .right-panel .panel-title,
.ennu-checkout-interface-enhanced .right-panel .panel-header,
.ennu-checkout-interface-enhanced .right-panel .panel-header h2,
.ennu-checkout-interface-enhanced .right-panel .panel-header span,
.ennu-checkout-interface-enhanced aside[class*="right"] h2,
.ennu-checkout-interface-enhanced complementary h2,
aside.right-panel .panel-header,
aside.right-panel .panel-header * {
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .right-panel .panel-header,
.ennu-checkout-interface-enhanced aside[class*="right"] .panel-header,
.ennu-checkout-interface-enhanced complementary .panel-header {
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%) !important;
    border-bottom: 3px solid #C9A962 !important;
    padding: 16px 20px !important;
    border-radius: 12px 12px 0 0 !important;
}

/* -----------------------------------------------------------------------------
   PAYMENT METHODS - FULL WIDTH IN CONTAINER
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .payment-method-card,
.payment-method-card {
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    background: #ffffff !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 200ms ease !important;
    margin-bottom: 10px !important;
}

.ennu-checkout-interface-enhanced .payment-methods-container,
.payment-methods-container,
.ennu-checkout-interface-enhanced .payment-method-selection,
.payment-method-selection {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
}

.ennu-checkout-interface-enhanced .payment-method-card.selected,
.payment-method-card.selected,
.ennu-checkout-interface-enhanced .payment-method-card.active,
.payment-method-card.active {
    border-color: #C9A962 !important;
    background: #fffbeb !important;
}

.ennu-checkout-interface-enhanced .payment-method-card:hover,
.payment-method-card:hover {
    border-color: #C9A962 !important;
}

/* -----------------------------------------------------------------------------
   LEFT PANEL PATIENT CARDS - PREVENT CONTENT HIDING
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .left-panel .patient-card,
.ennu-checkout-interface-enhanced aside .patient-card,
.ennu-checkout-interface-enhanced .patient-list .patient-card,
.patient-list .patient-card {
    overflow: visible !important;
    min-height: auto !important;
    height: auto !important;
    padding: 12px 16px !important;
    margin-bottom: 8px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    transition: all 150ms ease !important;
}

.ennu-checkout-interface-enhanced .left-panel .patient-card:hover,
.ennu-checkout-interface-enhanced aside .patient-card:hover {
    border-color: #C9A962 !important;
    box-shadow: 0 2px 8px rgba(201, 169, 98, 0.15) !important;
}

.ennu-checkout-interface-enhanced .left-panel .patient-card.selected,
.ennu-checkout-interface-enhanced .left-panel .patient-card.active,
.ennu-checkout-interface-enhanced aside .patient-card.selected,
.ennu-checkout-interface-enhanced aside .patient-card.active {
    border-left: 4px solid #C9A962 !important;
    background: #fffbeb !important;
}

/* LEGACY: Patient card wildcard and name styles moved to v1.9.5+ section at end of file */

/* Patient list container - scrollable with visible content */
.ennu-checkout-interface-enhanced .left-panel .patient-list,
.ennu-checkout-interface-enhanced aside .patient-list,
.patient-list {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: calc(100vh - 400px) !important;
    padding: 12px !important;
}

/* -----------------------------------------------------------------------------
   MEMBERSHIP BANNER - CLEAN SINGLE CONTAINER
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .membership-banner,
.membership-banner,
.ennu-checkout-interface-enhanced .vip-membership-banner,
.vip-membership-banner,
.ennu-checkout-interface-enhanced [class*="membership"] {
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(26, 39, 68, 0.2) !important;
}

.ennu-checkout-interface-enhanced .membership-banner *,
.membership-banner *,
.ennu-checkout-interface-enhanced .vip-membership-banner * {
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .membership-banner .banner-title,
.ennu-checkout-interface-enhanced .membership-banner h3,
.membership-banner h3 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin-bottom: 8px !important;
}

.ennu-checkout-interface-enhanced .membership-banner .banner-subtitle,
.ennu-checkout-interface-enhanced .membership-banner p,
.membership-banner p {
    font-size: 14px !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-bottom: 12px !important;
}

.ennu-checkout-interface-enhanced .membership-banner button,
.ennu-checkout-interface-enhanced .membership-banner .btn-add,
.membership-banner button {
    background: #C9A962 !important;
    color: #1A2744 !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
}

.ennu-checkout-interface-enhanced .membership-banner button:hover,
.membership-banner button:hover {
    background: #b89752 !important;
    transform: translateY(-1px) !important;
}

/* Remove any nested container styling in membership */
.ennu-checkout-interface-enhanced .membership-banner > div,
.membership-banner > div {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* -----------------------------------------------------------------------------
   SUMMARY SECTION - ABSOLUTELY NO SCROLLING (REINFORCED)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .summary-section,
.summary-section,
.ennu-checkout-interface-enhanced .payment-summary,
.payment-summary,
.ennu-checkout-interface-enhanced [class*="summary-section"],
[class*="summary-section"] {
    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Right panel - no scrolling */
.ennu-checkout-interface-enhanced .right-panel,
.right-panel,
.ennu-checkout-interface-enhanced aside[class*="right"],
.ennu-checkout-interface-enhanced complementary {
    overflow: visible !important;
    overflow-y: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Saved payment methods section */
.ennu-checkout-interface-enhanced .saved-payment-methods,
.saved-payment-methods {
    width: 100% !important;
    margin-bottom: 16px !important;
}

.ennu-checkout-interface-enhanced .saved-payment-methods h4,
.saved-payment-methods h4 {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin-bottom: 12px !important;
}

.ennu-checkout-interface-enhanced .saved-card,
.saved-card {
    display: flex !important;
    align-items: center !important;
    padding: 12px 16px !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    width: 100% !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
}

.ennu-checkout-interface-enhanced .saved-card.selected,
.saved-card.selected {
    border-color: #C9A962 !important;
    background: #fffbeb !important;
}

/* Coupon input area */
.ennu-checkout-interface-enhanced .coupon-section,
.coupon-section {
    width: calc(100% - 24px) !important;
    margin: 0 12px 16px 12px !important;
    padding: 16px !important;
    background: #f9fafb !important;
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    box-sizing: border-box !important;
}

.ennu-checkout-interface-enhanced .coupon-section input.coupon-input-large,
.coupon-section input.coupon-input-large {
    flex: 1 !important;
    padding: 14px 18px !important;
    border: 2px solid #d1d5db !important;
    border-radius: 10px !important;
    font-size: 15px !important;
}

.ennu-checkout-interface-enhanced .coupon-section button.coupon-apply-btn-large,
.coupon-section button.coupon-apply-btn-large {
    padding: 14px 28px !important;
    background: linear-gradient(135deg, #1e3a5f 0%, #2d4a6f 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}

/* Action buttons at bottom of payment panel */
.ennu-checkout-interface-enhanced .checkout-actions,
.checkout-actions,
.ennu-checkout-interface-enhanced .payment-actions,
.payment-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid #e5e7eb !important;
}

.ennu-checkout-interface-enhanced .checkout-actions button,
.checkout-actions button,
.ennu-checkout-interface-enhanced .payment-actions button,
.payment-actions button {
    width: 100% !important;
}

/* Primary checkout button */
.ennu-checkout-interface-enhanced .btn-checkout-primary,
.btn-checkout-primary,
.ennu-checkout-interface-enhanced .btn-complete-checkout,
.btn-complete-checkout,
.ennu-checkout-interface-enhanced button[class*="complete"],
button[class*="complete-checkout"] {
    background: linear-gradient(135deg, #C9A962 0%, #b89752 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 16px 24px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 200ms ease !important;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3) !important;
    width: 100% !important;
}

.ennu-checkout-interface-enhanced .btn-checkout-primary:hover,
.btn-checkout-primary:hover,
.ennu-checkout-interface-enhanced .btn-complete-checkout:hover,
.btn-complete-checkout:hover {
    background: linear-gradient(135deg, #b89752 0%, #a78642 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(201, 169, 98, 0.4) !important;
}

/* ==========================================================================
   2025-01-03 v1.8.0: COMPREHENSIVE UI FIXES
   All issues reported by user addressed in this section
   ========================================================================== */

/* -----------------------------------------------------------------------------
   FIX 1: LOCATION FILTER BUTTONS
   Style the location filter bar (All Locations, ENNU Fern Creek, etc.)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .ennu-location-filter,
.ennu-location-filter {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 12px 24px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.ennu-checkout-interface-enhanced .ennu-location-btn,
.ennu-location-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 16px !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    color: #4b5563 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
}

.ennu-checkout-interface-enhanced .ennu-location-btn:hover,
.ennu-location-btn:hover {
    background: #e5e7eb !important;
    border-color: #d1d5db !important;
    color: #1f2937 !important;
}

.ennu-checkout-interface-enhanced .ennu-location-btn.active,
.ennu-location-btn.active,
.ennu-checkout-interface-enhanced .ennu-location-btn[aria-pressed="true"],
.ennu-location-btn[aria-pressed="true"] {
    background: #1a2744 !important;
    border-color: #1a2744 !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .ennu-location-btn .dashicons,
.ennu-location-btn .dashicons {
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
}

/* -----------------------------------------------------------------------------
   FIX 2: DATE RANGE TABS (Today, This Week, This Month, All Time)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .ennu-tabs.checkout-tabs,
.ennu-tabs.checkout-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 24px !important;
    background: #f9fafb !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.ennu-checkout-interface-enhanced .ennu-tab.checkout-tab,
.ennu-tab.checkout-tab {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 18px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    color: #4b5563 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
}

.ennu-checkout-interface-enhanced .ennu-tab.checkout-tab:hover,
.ennu-tab.checkout-tab:hover {
    background: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

.ennu-checkout-interface-enhanced .ennu-tab.checkout-tab.active,
.ennu-tab.checkout-tab.active,
.ennu-checkout-interface-enhanced .ennu-tab.checkout-tab[aria-selected="true"],
.ennu-tab.checkout-tab[aria-selected="true"] {
    background: #1a2744 !important;
    border-color: #1a2744 !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .ennu-tab.checkout-tab .tab-badge,
.ennu-tab.checkout-tab .tab-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 22px !important;
    height: 22px !important;
    padding: 0 6px !important;
    background: rgba(0, 0, 0, 0.1) !important;
    border-radius: 11px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

.ennu-checkout-interface-enhanced .ennu-tab.checkout-tab.active .tab-badge,
.ennu-tab.checkout-tab.active .tab-badge {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
}

/* -----------------------------------------------------------------------------
   FIX 3: HEADER FILTERS (Dropdowns, Search, Toggle)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .checkout-header-filters,
.checkout-header-filters {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-left: auto !important;
    flex-wrap: wrap !important;
}

.ennu-checkout-interface-enhanced .checkout-header-select,
.checkout-header-select,
.ennu-checkout-interface-enhanced #filter-status,
.ennu-checkout-interface-enhanced #filter-provider,
#filter-status,
#filter-provider {
    min-width: 140px !important;
    padding: 8px 12px !important;
    padding-right: 32px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    background: #ffffff !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 8px center !important;
    background-size: 16px !important;
}

.ennu-checkout-interface-enhanced .checkout-header-select:focus,
.checkout-header-select:focus {
    outline: none !important;
    border-color: #C9A962 !important;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.2) !important;
}

.ennu-checkout-interface-enhanced .checkout-header-search,
.checkout-header-search {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 12px !important;
    background: #ffffff !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    min-width: 200px !important;
}

.ennu-checkout-interface-enhanced .checkout-header-search .dashicons,
.checkout-header-search .dashicons {
    color: #9ca3af !important;
    font-size: 16px !important;
}

.ennu-checkout-interface-enhanced .checkout-header-search input,
.checkout-header-search input,
.ennu-checkout-interface-enhanced #filter-search,
#filter-search {
    border: none !important;
    outline: none !important;
    padding: 8px 0 !important;
    font-size: 13px !important;
    background: transparent !important;
    width: 100% !important;
    color: #374151 !important;
}

.ennu-checkout-interface-enhanced .checkout-toggle-filter,
.checkout-toggle-filter {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 12px !important;
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    color: #6b7280 !important;
    cursor: pointer !important;
}

.ennu-checkout-interface-enhanced .checkout-toggle-filter input[type="checkbox"],
.checkout-toggle-filter input[type="checkbox"] {
    accent-color: #C9A962 !important;
}

/* -----------------------------------------------------------------------------
   FIX 4: STATS BAR (Ready for Checkout, In Treatment, etc.)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .checkout-stats-bar,
.checkout-stats-bar {
    display: flex !important;
    gap: 12px !important;
    padding: 16px 24px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
    flex-wrap: wrap !important;
}

.ennu-checkout-interface-enhanced .stat-badge,
.stat-badge {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 24px !important;
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    min-width: 120px !important;
    text-align: center !important;
}

.ennu-checkout-interface-enhanced .stat-badge .stat-value,
.stat-badge .stat-value {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1f2937 !important;
    line-height: 1.2 !important;
}

.ennu-checkout-interface-enhanced .stat-badge .stat-label,
.stat-badge .stat-label {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
    margin-top: 4px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.ennu-checkout-interface-enhanced .stat-badge.active,
.stat-badge.active {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%) !important;
    border-color: #34d399 !important;
}

.ennu-checkout-interface-enhanced .stat-badge.active .stat-value,
.stat-badge.active .stat-value {
    color: #059669 !important;
}

.ennu-checkout-interface-enhanced .stat-badge.warning,
.stat-badge.warning {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important;
    border-color: #fbbf24 !important;
}

.ennu-checkout-interface-enhanced .stat-badge.warning .stat-value,
.stat-badge.warning .stat-value {
    color: #d97706 !important;
}

.ennu-checkout-interface-enhanced .stat-badge.info,
.stat-badge.info {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%) !important;
    border-color: #60a5fa !important;
}

.ennu-checkout-interface-enhanced .stat-badge.info .stat-value,
.stat-badge.info .stat-value {
    color: #2563eb !important;
}

/* -----------------------------------------------------------------------------
   FIX 5: LEFT PANEL HEADER (Checked-In Patients)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .patients-panel .panel-title,
.patients-panel .panel-title,
.ennu-checkout-interface-enhanced aside .panel-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 20px !important;
    margin: 0 !important;
    background: linear-gradient(135deg, #1a2744 0%, #2d3e5f 100%) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.ennu-checkout-interface-enhanced .patients-panel .panel-title .dashicons,
.patients-panel .panel-title .dashicons {
    color: #C9A962 !important;
    font-size: 20px !important;
}

.ennu-checkout-interface-enhanced .patient-count-badge,
.patient-count-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 28px !important;
    height: 28px !important;
    padding: 0 8px !important;
    background: #C9A962 !important;
    color: #1a2744 !important;
    border-radius: 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    margin-left: auto !important;
}

/* -----------------------------------------------------------------------------
   FIX 6: RIGHT PANEL HEADER (Payment Summary)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced aside[class*="payment"] h2,
.ennu-checkout-interface-enhanced .payment-summary-panel h2,
.ennu-checkout-interface-enhanced complementary h2 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 20px !important;
    margin: 0 !important;
    background: linear-gradient(135deg, #1a2744 0%, #2d3e5f 100%) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

.ennu-checkout-interface-enhanced aside[class*="payment"] h2 .dashicons,
.ennu-checkout-interface-enhanced .payment-summary-panel h2 .dashicons,
.ennu-checkout-interface-enhanced complementary h2 .dashicons {
    color: #C9A962 !important;
}

/* -----------------------------------------------------------------------------
   FIX 7: SUMMARY SECTION - ABSOLUTELY NO INTERNAL SCROLLING
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .summary-section,
.summary-section,
.ennu-checkout-interface-enhanced [class*="summary-section"],
[class*="summary-section"],
.ennu-checkout-interface-enhanced aside[class*="payment"] > div,
.ennu-checkout-interface-enhanced complementary > div {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    max-height: none !important;
    height: auto !important;
    flex: none !important;
}

/* Right panel itself should not scroll internally */
.ennu-checkout-interface-enhanced aside[class*="payment"],
.ennu-checkout-interface-enhanced complementary,
.ennu-checkout-interface-enhanced .payment-summary-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Summary rows styling */
.ennu-checkout-interface-enhanced .summary-row,
.summary-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 0 !important;
    font-size: 14px !important;
    color: #4b5563 !important;
}

.ennu-checkout-interface-enhanced .summary-label,
.summary-label {
    font-weight: 500 !important;
}

.ennu-checkout-interface-enhanced .summary-value,
.summary-value {
    font-weight: 600 !important;
    color: #1f2937 !important;
}

.ennu-checkout-interface-enhanced .summary-total,
.summary-total {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 16px 0 !important;
    margin-top: 12px !important;
    border-top: 2px solid #e5e7eb !important;
    font-size: 18px !important;
    font-weight: 700 !important;
}

.ennu-checkout-interface-enhanced .summary-total .summary-value,
.summary-total .summary-value {
    color: #C9A962 !important;
    font-size: 24px !important;
}

/* -----------------------------------------------------------------------------
   FIX 8: PAYMENT METHODS - FULL WIDTH & INTUITIVE DESIGN
   ----------------------------------------------------------------------------- */

/* Container for all payment method cards - VERTICAL STACK */
.ennu-checkout-interface-enhanced .payment-methods,
.payment-methods,
.ennu-checkout-interface-enhanced .saved-payment-methods,
.saved-payment-methods {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
}

/* Individual payment method cards - HORIZONTAL LAYOUT (icon + text) */
.ennu-checkout-interface-enhanced .payment-method-card,
.payment-method-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 14px 16px !important;
    background: #ffffff !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
    box-sizing: border-box !important;
}

.ennu-checkout-interface-enhanced .payment-method-card:hover,
.payment-method-card:hover {
    border-color: #C9A962 !important;
    background: #fffbeb !important;
}

.ennu-checkout-interface-enhanced .payment-method-card.selected,
.payment-method-card.selected,
.ennu-checkout-interface-enhanced .payment-method-card.active,
.payment-method-card.active,
.ennu-checkout-interface-enhanced .payment-method-card:has(input:checked),
.payment-method-card:has(input:checked) {
    border-color: #C9A962 !important;
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%) !important;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15) !important;
}

/* Payment icon styling */
.ennu-checkout-interface-enhanced .payment-method-card .payment-icon,
.payment-method-card .payment-icon,
.ennu-checkout-interface-enhanced .payment-method-card .dashicons,
.payment-method-card .dashicons {
    flex-shrink: 0 !important;
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important;
    color: #6b7280 !important;
}

.ennu-checkout-interface-enhanced .payment-method-card.selected .payment-icon,
.payment-method-card.selected .payment-icon,
.ennu-checkout-interface-enhanced .payment-method-card.selected .dashicons,
.payment-method-card.selected .dashicons {
    color: #C9A962 !important;
}

/* Payment details (text) styling */
.ennu-checkout-interface-enhanced .payment-method-card .payment-details,
.payment-method-card .payment-details {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.ennu-checkout-interface-enhanced .payment-method-card .payment-type,
.payment-method-card .payment-type {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
}

.ennu-checkout-interface-enhanced .payment-method-card .payment-note,
.payment-method-card .payment-note,
.ennu-checkout-interface-enhanced .payment-method-card .payment-description,
.payment-method-card .payment-description {
    font-size: 12px !important;
    color: #6b7280 !important;
    margin-top: 2px !important;
}

/* Saved payment methods (credit cards) */
.ennu-checkout-interface-enhanced [class*="saved-payment"],
.ennu-checkout-interface-enhanced [class*="payment-token"],
[class*="saved-payment-method"] {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 16px !important;
    margin-bottom: 12px !important;
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%) !important;
    border: 2px solid #22c55e !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

/* Payment section headers */
.ennu-checkout-interface-enhanced h4,
.ennu-checkout-interface-enhanced .payment-section-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin: 20px 0 12px 0 !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid #e5e7eb !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.ennu-checkout-interface-enhanced h4 .dashicons,
.ennu-checkout-interface-enhanced .payment-section-title .dashicons {
    color: #C9A962 !important;
}

/* -----------------------------------------------------------------------------
   FIX 9: MEMBER BALANCE & GIFT CARD BALANCE BANNERS
   These are in the center panel, dynamically loaded via JS
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .ennu-checkout-balance-row,
.ennu-checkout-balance-row {
    display: flex !important;
    gap: 16px !important;
    margin-bottom: 20px !important;
    flex-wrap: wrap !important;
}

/* Balance banner containers - transparent wrappers */
.ennu-checkout-interface-enhanced .ennu-checkout-balance-banner,
.ennu-checkout-balance-banner {
    flex: 1 !important;
    min-width: 280px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

/* Member balance banner - only show if has content */
.ennu-checkout-interface-enhanced #ennu-member-balance-banner,
#ennu-member-balance-banner {
    flex: 1 !important;
    min-width: 280px !important;
}

/* Giftup balance banner - respect inline display:none when empty */
.ennu-checkout-interface-enhanced #giftup-balance-banner,
#giftup-balance-banner {
    flex: 1 !important;
    min-width: 280px !important;
}

/* Hide empty giftup banner */
#giftup-balance-banner[style*="display: none"],
#giftup-balance-banner:empty {
    display: none !important;
}

/* ===== MEMBER JOIN BANNER (for non-members) ===== */
.ennu-checkout-interface-enhanced .ennu-member-join-banner,
.ennu-member-join-banner {
    background: linear-gradient(135deg, #1a2744 0%, #2d3e5f 100%) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.ennu-checkout-interface-enhanced .ennu-member-join-content,
.ennu-member-join-content {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 16px 20px !important;
}

.ennu-checkout-interface-enhanced .ennu-member-join-banner .ennu-mb-icon,
.ennu-member-join-banner .ennu-mb-icon {
    flex-shrink: 0 !important;
    font-size: 28px !important;
    line-height: 1 !important;
}

.ennu-checkout-interface-enhanced .ennu-member-join-banner .ennu-mb-icon img,
.ennu-member-join-banner .ennu-mb-icon img {
    width: 28px !important;
    height: 28px !important;
}

.ennu-checkout-interface-enhanced .ennu-member-join-text,
.ennu-member-join-text {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    gap: 4px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-label,
.ennu-mb-join-label {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-desc,
.ennu-mb-join-desc {
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.8) !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-btn,
.ennu-mb-join-btn,
.ennu-checkout-interface-enhanced #btn-add-membership-to-order,
#btn-add-membership-to-order {
    flex-shrink: 0 !important;
    padding: 10px 20px !important;
    background: #C9A962 !important;
    color: #1a2744 !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
    white-space: nowrap !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-btn:hover,
.ennu-mb-join-btn:hover,
.ennu-checkout-interface-enhanced #btn-add-membership-to-order:hover,
#btn-add-membership-to-order:hover {
    background: #d4b872 !important;
    transform: translateY(-1px) !important;
}

/* ===== MEMBER BALANCE BANNER (for existing members with balance) ===== */
.ennu-checkout-interface-enhanced .ennu-member-balance-banner,
.ennu-member-balance-banner {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 16px 20px !important;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important;
    border: 2px solid #C9A962 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(201, 169, 98, 0.2) !important;
}

.ennu-checkout-interface-enhanced .ennu-member-balance-banner .ennu-mb-icon,
.ennu-member-balance-banner .ennu-mb-icon {
    font-size: 32px !important;
}

.ennu-checkout-interface-enhanced .ennu-member-balance-banner-text,
.ennu-member-balance-banner-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-label,
.ennu-mb-label {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #92400e !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-amount,
.ennu-mb-amount {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1a2744 !important;
}

/* Gift card balance banner (GiftUp) */
.ennu-checkout-interface-enhanced .ennu-giftup-balance-banner,
.ennu-giftup-balance-banner,
.ennu-checkout-interface-enhanced [class*="giftup-banner"],
[class*="giftup-banner"] {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 16px 20px !important;
    background: linear-gradient(135deg, #1a2a4a 0%, #2c4a7c 100%) !important;
    border: 2px solid #d4af37 !important;
    border-radius: 12px !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .ennu-giftup-icon,
.ennu-giftup-icon {
    font-size: 28px !important;
}

.ennu-checkout-interface-enhanced .ennu-giftup-amount,
.ennu-giftup-amount {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #d4af37 !important;
}

/* -----------------------------------------------------------------------------
   FIX 10: CENTER PANEL - PATIENT DETAILS HEADER
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .patient-detail-header,
.patient-detail-header,
.ennu-checkout-interface-enhanced .checkout-content > div:first-child {
    background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.ennu-checkout-interface-enhanced .patient-detail-header h2,
.patient-detail-header h2 {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1f2937 !important;
    margin: 0 0 8px 0 !important;
}

/* Patient info grid */
.ennu-checkout-interface-enhanced .patient-info-grid,
.patient-info-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 12px !important;
    padding: 16px 0 !important;
}

/* Timestamp in patient cards (left panel) */
.ennu-checkout-interface-enhanced .patient-card .check-in-time,
.patient-card .check-in-time {
    font-size: 12px !important;
    color: #6b7280 !important;
    white-space: nowrap !important;
}

/* -----------------------------------------------------------------------------
   FIX 11: PATIENT CARDS IN LEFT PANEL - CONTENT NOT HIDING
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .patient-card,
.patient-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 14px 16px !important;
    margin-bottom: 8px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
}

.ennu-checkout-interface-enhanced .patient-card:hover,
.patient-card:hover {
    border-color: #C9A962 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

.ennu-checkout-interface-enhanced .patient-card.active,
.patient-card.active,
.ennu-checkout-interface-enhanced .patient-card.selected,
.patient-card.selected {
    border-color: #C9A962 !important;
    background: linear-gradient(135deg, #fffbeb 0%, #ffffff 100%) !important;
    box-shadow: 0 0 0 3px rgba(201, 169, 98, 0.15) !important;
}

/* Legacy patient card styles removed - see v1.9.5+ patient card styles at end of file */

/* Patient card status badge */
.ennu-checkout-interface-enhanced .patient-card .status-badge,
.patient-card .status-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 4px 8px !important;
    background: #ecfdf5 !important;
    color: #059669 !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* -----------------------------------------------------------------------------
   FIX 12: VIP MEMBERSHIP BANNER - SINGLE CONTAINER
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .membership-banner,
.membership-banner,
.ennu-checkout-interface-enhanced [class*="membership-banner"],
[class*="vip-membership"] {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 20px 24px !important;
    margin-bottom: 20px !important;
    background: linear-gradient(135deg, #1a2744 0%, #2d3e5f 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.ennu-checkout-interface-enhanced .membership-banner > *,
.membership-banner > * {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner h4,
.membership-banner h4,
.ennu-checkout-interface-enhanced .membership-banner .membership-title {
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    border: none !important;
    padding: 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner p,
.membership-banner p {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 14px !important;
    margin: 0 !important;
}

.ennu-checkout-interface-enhanced .membership-banner button,
.membership-banner button {
    background: #C9A962 !important;
    color: #1a2744 !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    margin-left: auto !important;
}

.ennu-checkout-interface-enhanced .membership-banner button:hover,
.membership-banner button:hover {
    background: #d4b872 !important;
}

/* -----------------------------------------------------------------------------
   FIX 13: DATE RANGE BAR (Custom date inputs)
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .checkout-date-range-bar,
.checkout-date-range-bar {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 24px !important;
    background: #f3f4f6 !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.ennu-checkout-interface-enhanced .checkout-date-range-bar label,
.checkout-date-range-bar label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #4b5563 !important;
}

.ennu-checkout-interface-enhanced .checkout-date-input,
.checkout-date-input {
    padding: 8px 12px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    background: #ffffff !important;
}

.ennu-checkout-interface-enhanced .date-separator,
.date-separator {
    color: #6b7280 !important;
    font-size: 13px !important;
}

/* -----------------------------------------------------------------------------
   FIX 14: REWARDS & FINANCING EXPANDABLE SECTION
   ----------------------------------------------------------------------------- */
.ennu-checkout-interface-enhanced .rewards-section,
.rewards-section,
.ennu-checkout-interface-enhanced [class*="rewards-financing"],
[class*="rewards-financing"] {
    margin-top: 16px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

.ennu-checkout-interface-enhanced .rewards-section-header,
.rewards-section-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 16px !important;
    background: #f9fafb !important;
    cursor: pointer !important;
}

.ennu-checkout-interface-enhanced .rewards-section-content,
.rewards-section-content {
    padding: 16px !important;
    background: #ffffff !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.ennu-checkout-interface-enhanced .reward-option,
.reward-option {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 14px !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    cursor: pointer !important;
}

.ennu-checkout-interface-enhanced .reward-option:hover,
.reward-option:hover {
    border-color: #C9A962 !important;
    background: #fffbeb !important;
}

.ennu-checkout-interface-enhanced .reward-option .balance-badge,
.reward-option .balance-badge {
    background: #22c55e !important;
    color: #ffffff !important;
    font-size: 11px !important;
    padding: 2px 6px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   2025-01-03 v1.8.2: FILTER ROW LAYOUT IMPROVEMENTS
   Keep all filters in same row on desktop, improve toggle styling
   ========================================================================== */

/* Force filters to stay in single row on desktop (768px+) */
@media (min-width: 768px) {
    .ennu-checkout-interface-enhanced .checkout-header-filters,
    .checkout-header-filters {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 10px !important;
        margin-left: auto !important;
    }
    
    /* Compact the select dropdowns */
    .ennu-checkout-interface-enhanced .checkout-header-select,
    .checkout-header-select,
    #filter-status,
    #filter-provider {
        min-width: 120px !important;
        max-width: 150px !important;
        padding: 6px 10px !important;
        font-size: 12px !important;
    }
    
    /* Compact the search input */
    .ennu-checkout-interface-enhanced .checkout-header-search,
    .checkout-header-search {
        min-width: 150px !important;
        max-width: 180px !important;
    }
    
    .ennu-checkout-interface-enhanced .checkout-header-search input,
    .checkout-header-search input {
        padding: 6px 8px !important;
        font-size: 12px !important;
    }
}

/* Booking Orders Toggle - Enhanced Styling */
.ennu-checkout-interface-enhanced .checkout-toggle-filter,
.checkout-toggle-filter {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 12px !important;
    background: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
    border-radius: 20px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
    cursor: pointer !important;
    transition: all 150ms ease !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.ennu-checkout-interface-enhanced .checkout-toggle-filter:hover,
.checkout-toggle-filter:hover {
    background: #e5e7eb !important;
    border-color: #9ca3af !important;
}

/* Active state - when checked (Booking Orders Hidden) */
.ennu-checkout-interface-enhanced .checkout-toggle-filter.active,
.checkout-toggle-filter.active {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important;
    border-color: #C9A962 !important;
    color: #92400e !important;
}

/* Checkbox styling */
.ennu-checkout-interface-enhanced .checkout-toggle-filter input[type="checkbox"],
.checkout-toggle-filter input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    accent-color: #C9A962 !important;
    cursor: pointer !important;
}

/* Toggle label styling */
.ennu-checkout-interface-enhanced .checkout-toggle-filter .toggle-label,
.checkout-toggle-filter .toggle-label {
    font-weight: 500 !important;
    letter-spacing: 0.01em !important;
}

/* Responsive - allow wrapping on smaller screens */
@media (max-width: 1200px) {
    .ennu-checkout-interface-enhanced .checkout-header-filters,
    .checkout-header-filters {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
}

@media (max-width: 767px) {
    .ennu-checkout-interface-enhanced .checkout-header-filters,
    .checkout-header-filters {
        flex-wrap: wrap !important;
        width: 100% !important;
        justify-content: flex-start !important;
    }
    
    .ennu-checkout-interface-enhanced .checkout-header-select,
    .checkout-header-select {
        min-width: 100px !important;
        flex: 1 1 auto !important;
    }
    
    .ennu-checkout-interface-enhanced .checkout-header-search,
    .checkout-header-search {
        flex: 1 1 100% !important;
        order: 10 !important;
    }
}

/* ==========================================================================
   2025-01-03 v1.9.3: UI REFINEMENTS
   - Flush avatar layout
   - Compact membership banner  
   - Better line items
   - Profile button styling
   ========================================================================== */

/* ===== FLUSH PATIENT INFO LAYOUT ===== */
.ennu-checkout-interface-enhanced .selected-patient-info,
.selected-patient-info {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 16px !important;
}

.ennu-checkout-interface-enhanced .selected-patient-avatar,
.selected-patient-avatar {
    flex-shrink: 0 !important;
}

.ennu-checkout-interface-enhanced .selected-patient-details,
.selected-patient-details {
    flex: 1 !important;
    min-width: 0 !important;
}

/* ===== PATIENT PROFILE BUTTON ===== */
.patient-profile-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 12px !important;
    background: linear-gradient(135deg, #C9A962 0%, #A78642 100%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}

.patient-profile-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(201, 169, 98, 0.3) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.patient-profile-btn .dashicons {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
}

/* ===== COMPACT MEMBERSHIP BANNER ===== */
.ennu-checkout-interface-enhanced .ennu-member-join-banner,
.ennu-member-join-banner,
.ennu-checkout-interface-enhanced .ennu-member-balance-banner,
.ennu-member-balance-banner {
    padding: 10px 16px !important;
    margin-bottom: 12px !important;
    border-radius: 8px !important;
    gap: 12px !important;
}

.ennu-checkout-interface-enhanced .ennu-member-join-content,
.ennu-member-join-content {
    padding: 0 !important;
    gap: 12px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-icon,
.ennu-mb-icon {
    font-size: 20px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-label,
.ennu-mb-join-label {
    font-size: 14px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-desc,
.ennu-mb-join-desc {
    font-size: 12px !important;
}

.ennu-checkout-interface-enhanced .ennu-mb-join-btn,
.ennu-mb-join-btn {
    padding: 6px 12px !important;
    font-size: 12px !important;
}

/* ===== IMPROVED LINE ITEMS ===== */
.ennu-checkout-interface-enhanced .treatment-item,
.treatment-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 16px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    transition: all 0.15s ease !important;
}

.ennu-checkout-interface-enhanced .treatment-item:hover,
.treatment-item:hover {
    border-color: #C9A962 !important;
    box-shadow: 0 2px 8px rgba(201, 169, 98, 0.15) !important;
}

.ennu-checkout-interface-enhanced .treatment-item-info,
.treatment-item-info {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.ennu-checkout-interface-enhanced .treatment-item-name,
.treatment-item-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #111827 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.ennu-checkout-interface-enhanced .treatment-item-meta,
.treatment-item-meta {
    font-size: 12px !important;
    color: #6b7280 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

.ennu-checkout-interface-enhanced .treatment-item-price,
.treatment-item-price {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #16a34a !important;
    white-space: nowrap !important;
    margin-left: 16px !important;
}

.ennu-checkout-interface-enhanced .treatment-item-actions,
.treatment-item-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: 12px !important;
}

/* Tax Exempt Badge - Clickable */
.tax-exempt-badge,
.ennu-checkout-interface-enhanced .tax-exempt-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 2px 8px !important;
    background: #dcfce7 !important;
    color: #166534 !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    border: 1px solid transparent !important;
}

.tax-exempt-badge:hover,
.ennu-checkout-interface-enhanced .tax-exempt-badge:hover {
    background: #bbf7d0 !important;
    border-color: #86efac !important;
}

/* Taxable Badge - When item is taxable */
.taxable-badge,
.ennu-checkout-interface-enhanced .taxable-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 2px 8px !important;
    background: #fef3c7 !important;
    color: #92400e !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    border: 1px solid transparent !important;
}

.taxable-badge:hover,
.ennu-checkout-interface-enhanced .taxable-badge:hover {
    background: #fde68a !important;
    border-color: #fbbf24 !important;
}

/* Complimentary Badge */
.complimentary-badge,
.ennu-checkout-interface-enhanced .complimentary-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 2px 8px !important;
    background: #dbeafe !important;
    color: #1e40af !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    border: 1px solid transparent !important;
}

.complimentary-badge:hover,
.ennu-checkout-interface-enhanced .complimentary-badge:hover {
    background: #bfdbfe !important;
    border-color: #93c5fd !important;
}

/* Credit Badge (existing) */
.credit-badge,
.ennu-checkout-interface-enhanced .credit-badge {
    display: inline-flex !important;
    align-items: center !important;
    padding: 2px 8px !important;
    background: #f3e8ff !important;
    color: #7c3aed !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

/* Remove Item Button */
.treatment-remove-btn,
.ennu-checkout-interface-enhanced .treatment-remove-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    background: #fef2f2 !important;
    color: #dc2626 !important;
    border: 1px solid #fecaca !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

.treatment-remove-btn:hover,
.ennu-checkout-interface-enhanced .treatment-remove-btn:hover {
    background: #fee2e2 !important;
    border-color: #f87171 !important;
    color: #b91c1c !important;
}

.treatment-remove-btn .dashicons,
.ennu-checkout-interface-enhanced .treatment-remove-btn .dashicons {
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
}

/* ===== GRATUITY SECTION ===== */
.gratuity-section,
.ennu-checkout-interface-enhanced .gratuity-section {
    background: #fffbeb !important;
    border: 1px solid #fde68a !important;
    border-radius: 10px !important;
    padding: 16px !important;
    margin-top: 16px !important;
}

.gratuity-header,
.ennu-checkout-interface-enhanced .gratuity-header {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #92400e !important;
}

.gratuity-header .dashicons,
.ennu-checkout-interface-enhanced .gratuity-header .dashicons {
    color: #f59e0b !important;
}

.gratuity-presets,
.ennu-checkout-interface-enhanced .gratuity-presets {
    display: flex !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    flex-wrap: wrap !important;
}

.gratuity-preset-btn,
.ennu-checkout-interface-enhanced .gratuity-preset-btn {
    padding: 8px 16px !important;
    background: #fff !important;
    border: 1px solid #fde68a !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #92400e !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

.gratuity-preset-btn:hover,
.ennu-checkout-interface-enhanced .gratuity-preset-btn:hover {
    background: #fef3c7 !important;
    border-color: #f59e0b !important;
}

.gratuity-preset-btn.active,
.ennu-checkout-interface-enhanced .gratuity-preset-btn.active {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    border-color: #d97706 !important;
    color: #fff !important;
}

.gratuity-custom,
.ennu-checkout-interface-enhanced .gratuity-custom {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.gratuity-custom label,
.ennu-checkout-interface-enhanced .gratuity-custom label {
    font-size: 13px !important;
    color: #92400e !important;
}

.gratuity-custom input,
.ennu-checkout-interface-enhanced .gratuity-custom input {
    width: 100px !important;
    padding: 8px 12px !important;
    border: 1px solid #fde68a !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    text-align: right !important;
}

.gratuity-custom input:focus,
.ennu-checkout-interface-enhanced .gratuity-custom input:focus {
    outline: none !important;
    border-color: #f59e0b !important;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.1) !important;
}

.gratuity-amount-display,
.ennu-checkout-interface-enhanced .gratuity-amount-display {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #f59e0b !important;
    margin-left: auto !important;
}

/* ==========================================================================
   2025-01-05 v1.9.5: PATIENT CARD COMPACT STYLING
   Clean, aligned, compact layout for patient cards
   ========================================================================== */

/* Patient Card Container */
.ennu-checkout-interface-enhanced .patient-card,
.patient-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

.ennu-checkout-interface-enhanced .patient-card:hover,
.patient-card:hover {
    border-color: #C9A962 !important;
    box-shadow: 0 2px 8px rgba(201, 169, 98, 0.15) !important;
}

.ennu-checkout-interface-enhanced .patient-card.selected,
.patient-card.selected {
    border-color: #C9A962 !important;
    border-left: 3px solid #C9A962 !important;
    background: #fffdf8 !important;
}

/* Patient Card Header - Name and Total */
.ennu-checkout-interface-enhanced .patient-card .patient-card-header,
.patient-card .patient-card-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 12px 8px !important;
    gap: 8px !important;
}

/* Patient Name */
.ennu-checkout-interface-enhanced .patient-card .patient-name,
.patient-card .patient-name {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1a2744 !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    flex: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-name:hover,
.patient-card .patient-name:hover {
    color: #C9A962 !important;
}

/* Patient Total - Green badge */
.ennu-checkout-interface-enhanced .patient-card .patient-total,
.patient-card .patient-total {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #059669 !important;
    white-space: nowrap !important;
}

/* Patient Card Details - Grid layout */
.ennu-checkout-interface-enhanced .patient-card .patient-card-details,
.patient-card .patient-card-details {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 12px 8px !important;
    font-size: 12px !important;
}

/* Detail Row - Label/Value pairs */
.ennu-checkout-interface-enhanced .patient-card .detail-row,
.patient-card .detail-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 3px 0 !important;
    border-bottom: 1px solid #f3f4f6 !important;
}

.ennu-checkout-interface-enhanced .patient-card .detail-row:last-child,
.patient-card .detail-row:last-child {
    border-bottom: none !important;
}

/* Detail Label - Fixed width for alignment */
.ennu-checkout-interface-enhanced .patient-card .detail-label,
.patient-card .detail-label {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #9ca3af !important;
    width: 55px !important;
    flex-shrink: 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
}

/* Detail Value */
.ennu-checkout-interface-enhanced .patient-card .detail-value,
.patient-card .detail-value {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

/* Provider Name */
.ennu-checkout-interface-enhanced .patient-card .provider-name,
.patient-card .provider-name {
    font-weight: 600 !important;
    color: #1f2937 !important;
}

/* Order Link - Small arrow */
.ennu-checkout-interface-enhanced .patient-card .order-link,
.patient-card .order-link {
    font-size: 12px !important;
    color: #C9A962 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    padding: 0 !important;
    background: none !important;
}

.ennu-checkout-interface-enhanced .patient-card .order-link:hover,
.patient-card .order-link:hover {
    color: #a88b3d !important;
}

/* Order Status Badge - Inline */
.ennu-checkout-interface-enhanced .patient-card .order-status-badge,
.patient-card .order-status-badge {
    display: inline-block !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    background: #f1f5f9 !important;
    color: #64748b !important;
}

.ennu-checkout-interface-enhanced .patient-card .order-status-badge.status-pending,
.patient-card .order-status-badge.status-pending {
    background: #fef3c7 !important;
    color: #92400e !important;
}

.ennu-checkout-interface-enhanced .patient-card .order-status-badge.status-completed,
.patient-card .order-status-badge.status-completed {
    background: #d1fae5 !important;
    color: #065f46 !important;
}

.ennu-checkout-interface-enhanced .patient-card .order-status-badge.status-processing,
.patient-card .order-status-badge.status-processing {
    background: #dbeafe !important;
    color: #1e40af !important;
}

.ennu-checkout-interface-enhanced .patient-card .order-status-badge.status-booked,
.patient-card .order-status-badge.status-booked {
    background: #f3e8ff !important;
    color: #7c3aed !important;
}

/* Location Badge */
.ennu-checkout-interface-enhanced .patient-card .location-badge,
.patient-card .location-badge {
    display: inline-block !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #fff !important;
}

.ennu-checkout-interface-enhanced .patient-card .location-badge.location-ky,
.patient-card .location-badge.location-ky {
    background: #10b981 !important;
}

.ennu-checkout-interface-enhanced .patient-card .location-badge.location-in,
.patient-card .location-badge.location-in {
    background: #92400e !important;
}

/* Patient Status - Flush footer bar */
.ennu-checkout-interface-enhanced .patient-card .patient-status,
.patient-card .patient-status {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 6px 12px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status.ready,
.patient-card .patient-status.ready {
    background: #10b981 !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status.treatment,
.patient-card .patient-status.treatment {
    background: #f59e0b !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status.completed,
.patient-card .patient-status.completed {
    background: #6366f1 !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status.pending,
.patient-card .patient-status.pending {
    background: #9ca3af !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status.checkout,
.patient-card .patient-status.checkout {
    background: #C9A962 !important;
    color: #ffffff !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status .status-icon,
.patient-card .patient-status .status-icon {
    font-size: 11px !important;
    line-height: 1 !important;
}

.ennu-checkout-interface-enhanced .patient-card .patient-status .status-text,
.patient-card .patient-status .status-text {
    font-size: 10px !important;
}

/* ==========================================================================
   2026-01-13: PATIENT CARD V2 STYLES
   Modern compact card with avatar, metadata row, and expand/collapse
   ========================================================================== */

/* V2 Card Container */
.patient-card.patient-card-v2 {
    padding: 0 !important;
    overflow: hidden !important;
    position: relative !important;
}

/* V2 Main Content Wrapper */
.patient-card-v2 .patient-card-content {
    padding: 12px !important;
    position: relative !important;
    z-index: 1 !important;
    background: #fff !important;
    transition: transform 0.2s ease !important;
}

/* V2 Header - Avatar + Info + Total */
.patient-card-v2 .patient-card-header-v2 {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin-bottom: 8px !important;
}

/* Avatar Container */
.patient-card-v2 .patient-avatar-container {
    position: relative !important;
    flex-shrink: 0 !important;
}

.patient-card-v2 .patient-avatar {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 2px solid #e5e7eb !important;
}

.patient-card-v2 .patient-avatar-initials {
    /* NOTE: No display property here - let inline styles control visibility */
    /* When shown, the element needs flex for centering (set via JS or when no image) */
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #C9A962 0%, #a88b3d 100%) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    border: 2px solid #e5e7eb !important;
}

.patient-card-v2 .membership-badge {
    position: absolute !important;
    bottom: -2px !important;
    right: -2px !important;
    width: 16px !important;
    height: 16px !important;
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important;
    color: #fff !important;
    font-size: 9px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #fff !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
}

/* Primary Info - Name and Meta */
.patient-card-v2 .patient-info-primary {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.patient-card-v2 .patient-name-v2 {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1a2744 !important;
    text-decoration: none !important;
    line-height: 1.3 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: block !important;
}

.patient-card-v2 .patient-name-v2:hover {
    color: #C9A962 !important;
}

/* Meta Row - Time, Location, Provider */
.patient-card-v2 .patient-meta-row {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11px !important;
    color: #6b7280 !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
}

.patient-card-v2 .meta-time {
    font-weight: 500 !important;
    white-space: nowrap !important;
}

.patient-card-v2 .meta-separator {
    color: #d1d5db !important;
}

.patient-card-v2 .meta-provider {
    font-weight: 500 !important;
    color: #374151 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Location Badge Mini */
.patient-card-v2 .location-badge-mini {
    display: inline-block !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #fff !important;
    white-space: nowrap !important;
}

.patient-card-v2 .location-badge-mini.location-ky {
    background: #10b981 !important;
}

.patient-card-v2 .location-badge-mini.location-in {
    background: #92400e !important;
}

/* Total Container */
.patient-card-v2 .patient-total-container {
    text-align: right !important;
    flex-shrink: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 1px !important;
}

.patient-card-v2 .patient-total-amount {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #059669 !important;
    white-space: nowrap !important;
}

.patient-card-v2 .patient-total-amount.paid {
    color: #6b7280 !important;
}

.patient-card-v2 .patient-balance-indicator {
    font-size: 10px !important;
    font-weight: 600 !important;
}

.patient-card-v2 .balance-due {
    color: #dc2626 !important;
}

.patient-card-v2 .balance-paid {
    color: #10b981 !important;
}

/* Status Row */
.patient-card-v2 .patient-card-status-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding-top: 8px !important;
    border-top: 1px solid #f3f4f6 !important;
}

/* V2 Status Badge */
.patient-card-v2 .patient-status-v2 {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 3px 8px !important;
    border-radius: 12px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
}

.patient-card-v2 .patient-status-v2 .status-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
}

.patient-card-v2 .patient-status-v2.ready {
    background: #d1fae5 !important;
    color: #065f46 !important;
}

.patient-card-v2 .patient-status-v2.ready .status-dot {
    background: #10b981 !important;
}

.patient-card-v2 .patient-status-v2.treatment {
    background: #fef3c7 !important;
    color: #92400e !important;
}

.patient-card-v2 .patient-status-v2.treatment .status-dot {
    background: #f59e0b !important;
}

.patient-card-v2 .patient-status-v2.completed {
    background: #e0e7ff !important;
    color: #3730a3 !important;
}

.patient-card-v2 .patient-status-v2.completed .status-dot {
    background: #6366f1 !important;
}

.patient-card-v2 .patient-status-v2.booked {
    background: #f3e8ff !important;
    color: #6b21a8 !important;
}

.patient-card-v2 .patient-status-v2.booked .status-dot {
    background: #a855f7 !important;
}

/* Order ID Badge */
.patient-card-v2 .order-id-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11px !important;
    color: #6b7280 !important;
    font-weight: 500 !important;
}

.patient-card-v2 .order-link-icon {
    width: 14px !important;
    height: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #C9A962 !important;
    text-decoration: none !important;
    font-size: 10px !important;
}

.patient-card-v2 .order-link-icon:hover {
    color: #a88b3d !important;
}

.patient-card-v2 .order-link-icon img {
    width: 10px !important;
    height: 10px !important;
}

/* Expand Toggle */
.patient-card-v2 .expand-toggle {
    margin-left: auto !important;
    padding: 4px !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    color: #9ca3af !important;
    border-radius: 4px !important;
    transition: all 0.15s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.patient-card-v2 .expand-toggle:hover {
    background: #f3f4f6 !important;
    color: #374151 !important;
}

.patient-card-v2 .expand-toggle[aria-expanded="true"] .expand-icon {
    transform: rotate(180deg) !important;
}

.patient-card-v2 .expand-icon {
    width: 16px !important;
    height: 16px !important;
    transition: transform 0.2s ease !important;
}

/* Expanded Details */
.patient-card-v2 .patient-card-expanded {
    display: none !important;
    padding: 12px !important;
    background: #f9fafb !important;
    border-top: 1px solid #e5e7eb !important;
}

.patient-card-v2 .patient-card-expanded[aria-hidden="false"] {
    display: block !important;
}

.patient-card-v2 .expanded-loading {
    text-align: center !important;
    padding: 16px !important;
    color: #6b7280 !important;
    font-size: 12px !important;
}

/* Swipe Actions (mobile only - hidden on desktop) */
.patient-card-v2 .patient-card-swipe-actions {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 120px !important;
    display: none !important; /* Hidden by default on desktop */
    z-index: 0 !important;
}

/* Only show swipe actions on touch/mobile devices */
@media (hover: none) and (pointer: coarse) {
    .patient-card-v2 .patient-card-swipe-actions {
        display: flex !important;
}
}

.patient-card-v2 .swipe-action {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    border: none !important;
    cursor: pointer !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 600 !important;
}

.patient-card-v2 .swipe-action.action-view {
    background: #3b82f6 !important;
}

.patient-card-v2 .swipe-action.action-profile {
    background: #10b981 !important;
}

.patient-card-v2 .swipe-action .action-icon {
    font-size: 18px !important;
}

.patient-card-v2 .swipe-action .action-label {
    font-size: 9px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
}

/* ==========================================================================
   EDIT LOCK INDICATOR - Avatar-based Staff Presence
   Matches header avatar styling from ennu-infrastructure
   ========================================================================== */

.ennu-checkout-interface-enhanced .patient-card .patient-card-lock,
.patient-card .patient-card-lock {
    position: absolute !important;
    top: 6px !important;
    right: 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px 4px 4px !important;
    border-radius: 20px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    z-index: 10 !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    transition: all 0.2s ease !important;
}

/* Self lock - Green accent (you're editing) */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock.lock-self,
.patient-card .patient-card-lock.lock-self {
    background: rgba(209, 250, 229, 0.95) !important;
    border: 1px solid #10b981 !important;
    color: #065f46 !important;
}

/* Other lock - Gold accent (someone else editing) */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock.lock-other,
.patient-card .patient-card-lock.lock-other {
    background: rgba(254, 243, 199, 0.95) !important;
    border: 1px solid var(--luxury-gold, #C9A962) !important;
    color: #92400e !important;
}

/* Avatar Wrapper */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-avatar-wrapper,
.patient-card .patient-card-lock .lock-avatar-wrapper {
    position: relative !important;
    width: 24px !important;
    height: 24px !important;
    flex-shrink: 0 !important;
}

/* Avatar Image */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-avatar,
.patient-card .patient-card-lock .lock-avatar {
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    display: block !important;
    object-fit: cover !important;
    border: 2px solid #fff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Avatar Initials Fallback */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-avatar-initials,
.patient-card .patient-card-lock .lock-avatar-initials {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, var(--luxury-navy, #1A2744) 0%, #2a3a5a 100%) !important;
    color: var(--luxury-gold, #C9A962) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    border: 2px solid #fff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Status Dot - Base */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-status-dot,
.patient-card .patient-card-lock .lock-status-dot {
    position: absolute !important;
    bottom: -2px !important;
    right: -2px !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    border: 2px solid #fff !important;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4) !important;
}

/* Status Dot - Self (green) */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-status-dot.dot-self,
.patient-card .patient-card-lock .lock-status-dot.dot-self {
    background: #22c55e !important;
    animation: ennu-lock-pulse-green 2s infinite !important;
}

/* Status Dot - Other (orange/gold) */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-status-dot.dot-active,
.patient-card .patient-card-lock .lock-status-dot.dot-active {
    background: #f59e0b !important;
    animation: ennu-lock-pulse-gold 2s infinite !important;
}

/* Pulse Animations */
@keyframes ennu-lock-pulse-green {
    0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4); }
    70% { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
    100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

@keyframes ennu-lock-pulse-gold {
    0% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4); }
    70% { box-shadow: 0 0 0 6px rgba(245, 158, 11, 0); }
    100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}

/* Lock Name */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .lock-name,
.patient-card .patient-card-lock .lock-name {
    max-width: 60px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
}

/* Dashicons (hidden by default with new avatar system) */
.ennu-checkout-interface-enhanced .patient-card .patient-card-lock .dashicons,
.patient-card .patient-card-lock .dashicons {
        display: none !important;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .patient-card .patient-card-lock .lock-status-dot {
        animation: none !important;
    }
}

/* ==========================================================================
   MIDDLE PANEL HEADER - CONSISTENT STYLING
   Clean, aligned layout for patient info header
   ========================================================================== */

/* Content Header Container */
.ennu-checkout-interface-enhanced .content-header,
.content-header {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    padding: 16px 20px !important;
    border-bottom: 1px solid #e5e7eb !important;
    gap: 16px !important;
    background: #fff !important;
}

/* Selected Patient Info - Left side */
.ennu-checkout-interface-enhanced .selected-patient-info,
.selected-patient-info {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

/* Avatar */
.ennu-checkout-interface-enhanced .selected-patient-avatar,
.selected-patient-avatar {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #C9A962 0%, #b8944f 100%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    flex-shrink: 0 !important;
    overflow: hidden !important;
}

.ennu-checkout-interface-enhanced .selected-patient-avatar img,
.selected-patient-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

.ennu-checkout-interface-enhanced .selected-patient-avatar .dashicons,
.selected-patient-avatar .dashicons {
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important;
}

/* Patient Details */
.ennu-checkout-interface-enhanced .selected-patient-details,
.selected-patient-details {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

/* Patient Name Header */
.ennu-checkout-interface-enhanced .patient-header-name,
.patient-header-name {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.ennu-checkout-interface-enhanced .patient-name-text,
.patient-name-text {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a2744 !important;
    line-height: 1.2 !important;
}

/* Patient Billing Address - Below name */
.ennu-checkout-interface-enhanced .patient-header-address,
.patient-header-address {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 12px !important;
    color: #6b7280 !important;
    margin-top: 2px !important;
}

.ennu-checkout-interface-enhanced .patient-header-address .dashicons,
.patient-header-address .dashicons {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
    color: #9ca3af !important;
}

.ennu-checkout-interface-enhanced .patient-header-address .address-text,
.patient-header-address .address-text {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 350px !important;
    cursor: pointer !important;
}

/* Address text as editable badge */
.ennu-checkout-interface-enhanced .patient-header-address .address-text.editable-badge,
.patient-header-address .address-text.editable-badge {
    padding: 2px 8px !important;
    border-radius: 4px !important;
    background: #f8f9fa !important;
    border: 1px solid transparent !important;
    transition: all 0.2s ease !important;
}

.ennu-checkout-interface-enhanced .patient-header-address .address-text.editable-badge:hover,
.patient-header-address .address-text.editable-badge:hover {
    background: #e9ecef !important;
    border-color: #dee2e6 !important;
}

.ennu-checkout-interface-enhanced .patient-header-address .address-text .dashicons,
.patient-header-address .address-text .dashicons {
    font-size: 11px !important;
    width: 11px !important;
    height: 11px !important;
    margin-left: 4px !important;
    opacity: 0.6 !important;
    vertical-align: middle !important;
}

.ennu-checkout-interface-enhanced .patient-header-address .no-address,
.patient-header-address .no-address {
    color: #9ca3af !important;
    font-style: italic !important;
}

/* Address Edit Form - hidden by default, shown via JS */
.ennu-checkout-interface-enhanced .address-edit-form,
.address-edit-form {
    display: none;
    flex-direction: column;
    gap: 8px;
    margin-top: 4px;
    padding: 10px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #dee2e6;
    max-width: 400px;
}

/* When address form is shown via jQuery .show() it gets display:block,
   we need to ensure it displays as flex when visible */
.ennu-checkout-interface-enhanced .address-edit-form[style*="display: block"],
.address-edit-form[style*="display: block"],
.ennu-checkout-interface-enhanced .address-edit-form.active,
.address-edit-form.active {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.ennu-checkout-interface-enhanced .address-edit-row,
.address-edit-row {
    display: flex !important;
    gap: 8px !important;
}

.ennu-checkout-interface-enhanced .address-edit-row-inline,
.address-edit-row-inline {
    flex-wrap: nowrap !important;
}

.ennu-checkout-interface-enhanced .address-input,
.address-input {
    flex: 1 !important;
    padding: 6px 10px !important;
    font-size: 12px !important;
    border: 1px solid #ced4da !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #212529 !important;
    min-width: 0 !important;
}

.ennu-checkout-interface-enhanced .address-input:focus,
.address-input:focus {
    outline: none !important;
    border-color: #80bdff !important;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.15) !important;
}

.ennu-checkout-interface-enhanced .address-input-city,
.address-input-city {
    flex: 2 !important;
}

.ennu-checkout-interface-enhanced .address-input-state,
.address-input-state {
    flex: 0 0 60px !important;
    text-transform: uppercase !important;
}

.ennu-checkout-interface-enhanced .address-input-zip,
.address-input-zip {
    flex: 0 0 80px !important;
}

.ennu-checkout-interface-enhanced .address-edit-actions,
.address-edit-actions {
    display: flex !important;
    gap: 8px !important;
    justify-content: flex-end !important;
    margin-top: 4px !important;
}

/* Patient Header Meta - Grid layout for alignment */
.ennu-checkout-interface-enhanced .patient-header-meta,
.patient-header-meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

/* Meta Row - Label/Value pairs */
.ennu-checkout-interface-enhanced .meta-row,
.meta-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 12px !important;
}

/* Meta Label - Fixed width */
.ennu-checkout-interface-enhanced .meta-label,
.meta-label {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #9ca3af !important;
    width: 60px !important;
    flex-shrink: 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
}

/* Meta Value */
.ennu-checkout-interface-enhanced .meta-value,
.meta-value {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

/* Editable Badge - Base styles */
.ennu-checkout-interface-enhanced .editable-badge,
.editable-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

.ennu-checkout-interface-enhanced .editable-badge .dashicons,
.editable-badge .dashicons {
    font-size: 10px !important;
    width: 10px !important;
    height: 10px !important;
    opacity: 0.6 !important;
}

.ennu-checkout-interface-enhanced .editable-badge:hover .dashicons,
.editable-badge:hover .dashicons {
    opacity: 1 !important;
}

/* Location Badge */
.ennu-checkout-interface-enhanced .editable-badge.location-badge,
.editable-badge.location-badge {
    background: linear-gradient(135deg, #1a2744 0%, #2c4a7c 100%) !important;
    color: #fff !important;
}

.ennu-checkout-interface-enhanced .editable-badge.location-badge:hover,
.editable-badge.location-badge:hover {
    background: linear-gradient(135deg, #2c4a7c 0%, #3d5a8c 100%) !important;
}

/* Tax Badge */
.ennu-checkout-interface-enhanced .tax-badge,
.tax-badge {
    display: inline-block !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #fff !important;
}

.ennu-checkout-interface-enhanced .tax-badge.tax-ky,
.tax-badge.tax-ky {
    background: #10b981 !important;
}

.ennu-checkout-interface-enhanced .tax-badge.tax-in,
.tax-badge.tax-in {
    background: #92400e !important;
}

/* Provider Badge */
.ennu-checkout-interface-enhanced .editable-badge.provider-badge.has-provider,
.editable-badge.provider-badge.has-provider {
    background: #d1fae5 !important;
    color: #065f46 !important;
}

.ennu-checkout-interface-enhanced .editable-badge.provider-badge.no-provider,
.editable-badge.provider-badge.no-provider {
    background: #fef3c7 !important;
    color: #92400e !important;
}

/* Inline Select */
.ennu-checkout-interface-enhanced .inline-select,
.inline-select {
    padding: 4px 8px !important;
    border: 1px solid #C9A962 !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    min-width: 140px !important;
    background: #fff !important;
}

/* Inline Buttons */
.ennu-checkout-interface-enhanced .inline-btn,
.inline-btn {
    padding: 4px 10px !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    transition: all 0.15s ease !important;
}

.ennu-checkout-interface-enhanced .inline-btn-save,
.inline-btn-save {
    background: #C9A962 !important;
    color: #fff !important;
}

.ennu-checkout-interface-enhanced .inline-btn-save:hover,
.inline-btn-save:hover {
    background: #b8944f !important;
}

.ennu-checkout-interface-enhanced .inline-btn-cancel,
.inline-btn-cancel {
    background: #6b7280 !important;
    color: #fff !important;
}

.ennu-checkout-interface-enhanced .inline-btn-cancel:hover,
.inline-btn-cancel:hover {
    background: #4b5563 !important;
}

/* Header Actions - Right side */
.ennu-checkout-interface-enhanced .patient-header-actions,
.patient-header-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
}

.ennu-checkout-interface-enhanced .header-action-btn,
.header-action-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    background: linear-gradient(135deg, #C9A962 0%, #b8944f 100%) !important;
    color: #fff !important;
    border: none !important;
}

.ennu-checkout-interface-enhanced .header-action-btn:hover,
.header-action-btn:hover {
    background: linear-gradient(135deg, #b8944f 0%, #a88b3d 100%) !important;
    color: #fff !important;
}

.ennu-checkout-interface-enhanced .header-action-btn .dashicons,
.header-action-btn .dashicons {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
}

.ennu-checkout-interface-enhanced .header-action-btn.header-action-secondary,
.header-action-btn.header-action-secondary {
    background: #f3f4f6 !important;
    color: #374151 !important;
    border: 1px solid #e5e7eb !important;
}

.ennu-checkout-interface-enhanced .header-action-btn.header-action-secondary:hover,
.header-action-btn.header-action-secondary:hover {
    background: #e5e7eb !important;
    color: #1f2937 !important;
}

/* ==========================================================================
   PAYMENT METHODS GRID - FINAL OVERRIDE (must be at end of file)
   Forces two-row horizontal layout for payment tiles
   ========================================================================== */
.payment-methods-grid,
.ennu-checkout-interface-enhanced .payment-methods-grid,
.payment-panel .payment-methods-grid,
.ennu-payment-section .payment-methods-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
    width: 100% !important;
}

.payment-methods-grid .payment-method-tile,
.ennu-checkout-interface-enhanced .payment-methods-grid .payment-method-tile {
    width: 100% !important;
    margin-bottom: 0 !important;
    padding: 8px 4px !important;
}

/* ==========================================================================
   EDITING DISABLED STATE - Processing/Completed Orders
   Shows prominent warning when order cannot be edited
   ========================================================================== */

/* Main editing disabled warning banner - sticky at top */
.ennu-editing-disabled-banner {
    position: sticky;
    top: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 20px;
    background: linear-gradient(135deg, #fef3cd 0%, #ffeeba 100%);
    border-bottom: 2px solid #f0ad4e;
    box-shadow: 0 2px 8px rgba(240, 173, 78, 0.3);
    animation: pulse-warning 2s ease-in-out infinite;
}

@keyframes pulse-warning {
    0%, 100% { box-shadow: 0 2px 8px rgba(240, 173, 78, 0.3); }
    50% { box-shadow: 0 2px 16px rgba(240, 173, 78, 0.5); }
}

.ennu-editing-disabled-banner .banner-icon {
    font-size: 24px;
    line-height: 1;
}

.ennu-editing-disabled-banner .banner-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ennu-editing-disabled-banner .banner-title {
    font-size: 15px;
    font-weight: 700;
    color: #856404;
    margin: 0;
}

.ennu-editing-disabled-banner .banner-subtitle {
    font-size: 12px;
    color: #856404;
    opacity: 0.85;
    margin: 0;
}

.ennu-editing-disabled-banner .banner-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #fff;
    border: 1px solid #f0ad4e;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    color: #856404;
    text-transform: capitalize;
}

/* Entire interface locked visual overlay effect */
.ennu-checkout-interface-enhanced.ennu-editing-locked {
    position: relative;
}

.ennu-checkout-interface-enhanced.ennu-editing-locked .checkout-content-panel,
.ennu-checkout-interface-enhanced.ennu-editing-locked .order-details-panel {
    position: relative;
}

.ennu-checkout-interface-enhanced.ennu-editing-locked .checkout-content-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 243, 205, 0.05);
    pointer-events: none;
    z-index: 1;
    border-radius: 12px;
}

/* Disable all interactive elements in locked state */
.ennu-checkout-interface-enhanced.ennu-editing-locked .add-treatment-btn,
.ennu-checkout-interface-enhanced.ennu-editing-locked .btn-add-service,
.ennu-checkout-interface-enhanced.ennu-editing-locked .btn-add-product,
.ennu-checkout-interface-enhanced.ennu-editing-locked .remove-item-btn,
.ennu-checkout-interface-enhanced.ennu-editing-locked .btn-remove-item,
.ennu-checkout-interface-enhanced.ennu-editing-locked .btn-remove-treatment,
.ennu-checkout-interface-enhanced.ennu-editing-locked .quantity-input,
.ennu-checkout-interface-enhanced.ennu-editing-locked .price-input,
.ennu-checkout-interface-enhanced.ennu-editing-locked .editable-field,
.ennu-checkout-interface-enhanced.ennu-editing-locked .inline-edit,
.ennu-checkout-interface-enhanced.ennu-editing-locked .tax-toggle,
.ennu-checkout-interface-enhanced.ennu-editing-locked .item-toggle,
.ennu-checkout-interface-enhanced.ennu-editing-locked .ennu-evolus-discount-toggle,
.ennu-checkout-interface-enhanced.ennu-editing-locked #btn-add-membership-to-order,
.ennu-checkout-interface-enhanced.ennu-editing-locked .ennu-mb-join-btn {
    opacity: 0.4 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* Style for locked form elements */
.ennu-checkout-interface-enhanced.ennu-editing-locked input:not([type="radio"]):not([type="checkbox"]),
.ennu-checkout-interface-enhanced.ennu-editing-locked select,
.ennu-checkout-interface-enhanced.ennu-editing-locked textarea {
    background-color: #f9f9f9 !important;
    cursor: not-allowed !important;
}

/* Show lock icon on treatment items */
.ennu-checkout-interface-enhanced.ennu-editing-locked .treatment-item::after,
.ennu-checkout-interface-enhanced.ennu-editing-locked .order-item::after {
    content: '🔒';
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 14px;
    opacity: 0.5;
}

.ennu-checkout-interface-enhanced.ennu-editing-locked .treatment-item,
.ennu-checkout-interface-enhanced.ennu-editing-locked .order-item {
    position: relative;
}

/* Hide product search in locked state */
.ennu-checkout-interface-enhanced.ennu-editing-locked .product-search-panel,
.ennu-checkout-interface-enhanced.ennu-editing-locked .treatments-search-section,
.ennu-checkout-interface-enhanced.ennu-editing-locked #product-search-input {
    display: none !important;
}

/* Gratuity section locked */
.ennu-checkout-interface-enhanced.ennu-editing-locked .gratuity-section {
    opacity: 0.5;
    pointer-events: none;
}

/* Provider/Location selectors locked */
.ennu-checkout-interface-enhanced.ennu-editing-locked .provider-selector,
.ennu-checkout-interface-enhanced.ennu-editing-locked .location-selector,
.ennu-checkout-interface-enhanced.ennu-editing-locked [data-action="assign-provider"],
.ennu-checkout-interface-enhanced.ennu-editing-locked [data-action="change-location"] {
    pointer-events: none !important;
    opacity: 0.6 !important;
}

/* ==========================================================================
   HISTORY TAB - Activity Timeline
   ========================================================================== */

.history-tab-container {
    padding: 0;
}

.history-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 20px;
}

.history-title-left {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: #1a2744;
}

.history-controls {
    display: flex;
    align-items: center;
    gap: 12px;
}

.history-auto-refresh {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #6b7280;
    cursor: pointer;
}

.history-auto-refresh input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #C9A962;
}

.history-refresh-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s;
}

.history-refresh-btn:hover {
    background: #e5e7eb;
    color: #1a2744;
}

.history-refresh-btn .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* Spinning animation for refresh */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.spinning {
    animation: spin 1s linear infinite;
}

/* Timeline Container */
.history-timeline {
    min-height: 200px;
}

.timeline-container {
    position: relative;
    padding-left: 30px;
}

/* Timeline vertical line */
.timeline-container::before {
    content: '';
    position: absolute;
    left: 11px;
    top: 0;
    bottom: 20px;
    width: 2px;
    background: linear-gradient(to bottom, #e5e7eb 0%, #f3f4f6 100%);
}

/* Date Headers */
.timeline-date-header {
    position: relative;
    font-size: 12px;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 16px 0 12px 0;
    margin-left: -30px;
    padding-left: 30px;
    background: linear-gradient(90deg, #f9fafb 0%, transparent 100%);
}

.timeline-date-header::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    background: #e5e7eb;
    border-radius: 50%;
    border: 2px solid #fff;
}

/* Timeline Events */
.timeline-event {
    position: relative;
    display: flex;
    gap: 12px;
    padding: 12px 0;
    margin-left: -30px;
}

.timeline-event:last-child {
    padding-bottom: 0;
}

/* Timeline Marker (colored dot with icon) */
.timeline-marker {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    color: #fff;
    z-index: 1;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.timeline-marker .dashicons {
    font-size: 12px;
    width: 12px;
    height: 12px;
}

/* Timeline Content */
.timeline-content {
    flex: 1;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 12px 14px;
    transition: all 0.2s;
}

.timeline-content:hover {
    border-color: #d1d5db;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.timeline-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 4px;
}

.timeline-title {
    font-weight: 600;
    font-size: 14px;
    color: #1a2744;
}

.timeline-time {
    font-size: 12px;
    color: #9ca3af;
    white-space: nowrap;
}

.timeline-context {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 4px;
}

.timeline-context .ctx-where {
    color: #3b82f6;
    font-weight: 500;
}

.timeline-context .ctx-how {
    color: #9ca3af;
    font-style: italic;
}

.timeline-description {
    font-size: 13px;
    color: #4b5563;
    line-height: 1.4;
    margin-bottom: 6px;
    padding: 6px 8px;
    background: #f9fafb;
    border-radius: 4px;
    border-left: 2px solid #e5e7eb;
}

.timeline-actor {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
}

.timeline-actor .dashicons {
    font-size: 12px;
    width: 12px;
    height: 12px;
}

.timeline-actor-system {
    color: #9ca3af;
    font-weight: 400;
}

/* Event Type Colors (applied to markers) */
.event-booking .timeline-marker { background-color: #3b82f6; }
.event-checkin .timeline-marker { background-color: #10b981; }
.event-checkout .timeline-marker { background-color: #f97316; }
.event-payment .timeline-marker { background-color: #d4af37; }
.event-order .timeline-marker { background-color: #3b82f6; }
.event-facechart .timeline-marker { background-color: #a855f7; }
.event-view .timeline-marker { background-color: #9ca3af; }
.event-verification .timeline-marker { background-color: #8b5cf6; }
.event-note .timeline-marker { background-color: #6b7280; }
.event-security .timeline-marker { background-color: #ef4444; }
.event-canceled .timeline-marker { background-color: #ef4444; }
.event-system .timeline-marker { background-color: #6b7280; }
.event-default .timeline-marker { background-color: #6b7280; }

/* Event Type Border Accent */
.event-booking .timeline-content { border-left: 3px solid #3b82f6; }
.event-checkin .timeline-content { border-left: 3px solid #10b981; }
.event-checkout .timeline-content { border-left: 3px solid #f97316; }
.event-payment .timeline-content { border-left: 3px solid #d4af37; }
.event-order .timeline-content { border-left: 3px solid #3b82f6; }
.event-facechart .timeline-content { border-left: 3px solid #a855f7; }
.event-verification .timeline-content { border-left: 3px solid #8b5cf6; }
.event-security .timeline-content { border-left: 3px solid #ef4444; }
.event-canceled .timeline-content { border-left: 3px solid #ef4444; }

/* Loading State */
.history-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #9ca3af;
    text-align: center;
}

.history-loading .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
    margin-bottom: 12px;
    color: #C9A962;
}

/* Empty State */
.history-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #9ca3af;
    text-align: center;
}

.history-empty .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
    margin-bottom: 12px;
    color: #d1d5db;
}

/* Error State */
.history-error {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    color: #ef4444;
    text-align: center;
    background: #fef2f2;
    border-radius: 8px;
}

.history-error .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    margin-bottom: 8px;
}

.btn-retry-history {
    margin-top: 12px;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid #ef4444;
    border-radius: 6px;
    color: #ef4444;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-retry-history:hover {
    background: #ef4444;
    color: #fff;
}

/* Timeline Footer */
.timeline-footer {
    padding: 16px 0 0 0;
    text-align: center;
    color: #9ca3af;
    font-size: 12px;
    border-top: 1px dashed #e5e7eb;
    margin-top: 16px;
}

/* ==========================================================================
   PROVIDER INFO BLOCK - Header Panel
   ========================================================================== */

.content-header {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    flex-wrap: wrap;
}

.provider-info-block {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
    border: 1px solid #e5e7eb;
    border-left: 3px solid #C9A962;
    border-radius: 8px;
    min-width: 200px;
    max-width: 280px;
}

.provider-avatar-wrapper {
    flex-shrink: 0;
}

.provider-avatar-img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #C9A962;
    box-shadow: 0 2px 8px rgba(201, 169, 98, 0.2);
}

.provider-avatar-placeholder {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1a2744 0%, #2d3a52 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C9A962;
    border: 2px solid #C9A962;
}

.provider-avatar-placeholder .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
}

.provider-info-details {
    flex: 1;
    min-width: 0;
}

.provider-info-name {
    font-weight: 600;
    font-size: 14px;
    color: #1a2744;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.provider-info-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.provider-meta-row {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #6b7280;
}

.provider-meta-row .dashicons {
    font-size: 12px;
    width: 12px;
    height: 12px;
    color: #9ca3af;
}

.provider-meta-row.provider-last-edit {
    color: #10b981;
}

.provider-meta-row.provider-last-edit .dashicons {
    color: #10b981;
}

/* Responsive adjustments for header */
@media (max-width: 1200px) {
    .content-header {
        flex-direction: column;
    }
    
    .provider-info-block {
        max-width: 100%;
        width: 100%;
    }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .provider-info-block {
        background: linear-gradient(135deg, #1a2744 0%, #2d3a52 100%);
        border-color: #374151;
    }

    .provider-info-name {
        color: #f3f4f6;
    }

    .provider-meta-row {
        color: #9ca3af;
    }
}

/* ========================================
   NEW CARD SAVE VISUAL FEEDBACK STYLES
   ======================================== */

/* Success state for save card button */
.btn-save-card.btn-save-card-success {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    animation: successPulse 0.5s ease;
}

.btn-save-card.btn-save-card-success .dashicons {
    animation: checkBounce 0.4s ease;
}

@keyframes successPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

@keyframes checkBounce {
    0% { transform: scale(0); }
    50% { transform: scale(1.3); }
    100% { transform: scale(1); }
}

/* New card highlight animation */
.payment-method-card.new-card-highlight {
    position: relative;
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 2px solid #10b981 !important;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.15), 0 4px 16px rgba(16, 185, 129, 0.2);
}

.payment-method-card.new-card-highlight::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(45deg, #10b981, #059669, #10b981);
    z-index: -1;
    animation: borderGlow 2s ease infinite;
}

@keyframes borderGlow {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}

/* Card slide-in animation */
.payment-method-card.card-animate-in {
    animation: cardSlideIn 0.4s ease-out forwards;
}

@keyframes cardSlideIn {
    0% {
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    60% {
        transform: translateY(5px) scale(1.02);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* "Just Added" badge */
.new-card-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    margin-left: 8px;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 10px;
    animation: badgePop 0.3s ease 0.2s backwards;
}

@keyframes badgePop {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    70% {
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Card selected checkmark */
.card-selected-check {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #10b981;
    font-size: 24px;
    width: 24px;
    height: 24px;
    opacity: 0;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.payment-method-card.selected .card-selected-check {
    opacity: 1;
    animation: checkAppear 0.3s ease forwards;
}

@keyframes checkAppear {
    0% {
        opacity: 0;
        transform: translateY(-50%) scale(0) rotate(-45deg);
    }
    70% {
        transform: translateY(-50%) scale(1.2) rotate(10deg);
    }
    100% {
        opacity: 1;
        transform: translateY(-50%) scale(1) rotate(0);
    }
}

/* Ensure proper spacing when checkmark is present */
.payment-method-card.selected {
    padding-right: 48px;
}

/* Subtle shimmer effect on new card */
.payment-method-card.new-card-highlight::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.4),
        transparent
    );
    animation: shimmer 1.5s ease 0.5s;
    pointer-events: none;
}

@keyframes shimmer {
    0% { left: -100%; }
    100% { left: 100%; }
}


/* ========================================
   PATIENT INFO TAB STYLES
   ======================================== */

/* Tab container */
.patient-info-tab-container {
    padding: 0;
}

.patient-info-header {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 20px;
}

.patient-info-title-left {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 600;
    color: #1a365d;
}

.patient-info-subtitle {
    font-size: 12px;
    color: #718096;
    margin-left: 30px;
}

/* Sections container */
.patient-info-sections {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Individual section */
.patient-info-section {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.patient-info-section:hover {
    border-color: #cbd5e0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* Section header - clickable */
.patient-info-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    cursor: pointer;
    user-select: none;
    transition: background 0.2s ease;
}

.patient-info-section-header:hover {
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}

.section-header-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.section-header-left .dashicons {
    font-size: 18px;
    color: #4a5568;
}

.section-title-text {
    font-weight: 600;
    color: #1a365d;
    font-size: 14px;
}

.section-field-count {
    font-size: 11px;
    color: #718096;
    background: #e2e8f0;
    padding: 2px 8px;
    border-radius: 10px;
}

.section-toggle {
    color: #a0aec0;
    transition: transform 0.2s ease;
}

/* Collapsed state */
.patient-info-section.collapsed .section-toggle {
    transform: rotate(-90deg);
}

.patient-info-section.collapsed .patient-info-section-content {
    display: none;
}

/* Section content */
.patient-info-section-content {
    padding: 18px;
    border-top: 1px solid #e2e8f0;
}

/* Fields grid - responsive */
.patient-info-fields-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
}

/* Individual field */
.patient-info-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 12px;
    background: #f8fafc;
    border-radius: 6px;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

.patient-info-field:hover {
    background: #f1f5f9;
    border-color: #e2e8f0;
}

.patient-info-field.field-has-value {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.patient-info-field.field-empty {
    background: #fafafa;
}

.patient-info-field.field-required-empty {
    background: #fff7ed;
    border-color: #fed7aa;
}

.patient-info-field.field-required-empty .field-label {
    color: #c2410c;
}

/* Field label */
.field-label {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.required-marker {
    color: #ef4444;
    font-size: 14px;
    line-height: 1;
}

/* Field value */
.field-value {
    font-size: 13px;
    color: #1e293b;
    word-break: break-word;
    line-height: 1.4;
}

.field-value .empty-value {
    color: #94a3b8;
    font-style: italic;
    font-size: 12px;
}

/* Empty state */
.patient-info-empty {
    text-align: center;
    padding: 60px 20px;
    background: #f8fafc;
    border-radius: 10px;
    border: 2px dashed #e2e8f0;
}

.patient-info-empty p {
    margin: 0;
    color: #64748b;
}

/* No fields message */
.no-fields {
    color: #94a3b8;
    font-style: italic;
    text-align: center;
    padding: 20px;
    margin: 0;
}

/* Pre-checkin section special styling */
.patient-info-section[data-category="precheckin"] .patient-info-section-header {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
}

.patient-info-section[data-category="precheckin"] .section-header-left .dashicons {
    color: #b45309;
}

.patient-info-section[data-category="precheckin"] .section-title-text {
    color: #92400e;
}

/* Medical history section special styling */
.patient-info-section[data-category="medical_history"] .patient-info-section-header {
    background: linear-gradient(135deg, #fce7f3 0%, #fbcfe8 100%);
}

.patient-info-section[data-category="medical_history"] .section-header-left .dashicons {
    color: #be185d;
}

/* Allergies section warning styling */
.patient-info-section[data-category="allergies"] .patient-info-section-header {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
}

.patient-info-section[data-category="allergies"] .section-header-left .dashicons {
    color: #dc2626;
}

.patient-info-section[data-category="allergies"] .section-title-text {
    color: #991b1b;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .patient-info-fields-grid {
        grid-template-columns: 1fr;
    }

    .patient-info-section-header {
        padding: 12px 14px;
    }

    .patient-info-section-content {
        padding: 14px;
    }

    .patient-info-field {
        padding: 8px 10px;
    }
}

/* Animation for section expand/collapse */
.patient-info-section-content {
    animation: slideDown 0.2s ease;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =====================================================
   MULTI-PROVIDER TOGGLE STYLES
   ===================================================== */

.multi-provider-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    user-select: none;
}

.multi-provider-toggle input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.multi-provider-toggle .toggle-slider {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    background: #d1d5db;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.multi-provider-toggle .toggle-slider::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    background: white;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    transition: transform 0.2s ease;
}

.multi-provider-toggle input[type="checkbox"]:checked + .toggle-slider {
    background: #C9A962;
}

.multi-provider-toggle input[type="checkbox"]:checked + .toggle-slider::before {
    transform: translateX(16px);
}

.multi-provider-toggle .toggle-label {
    color: #4b5563;
    transition: color 0.2s ease;
}

.multi-provider-toggle input[type="checkbox"]:checked ~ .toggle-label {
    color: #C9A962;
}

.multi-provider-toggle:hover .toggle-slider {
    background: #9ca3af;
}

.multi-provider-toggle input[type="checkbox"]:checked:hover + .toggle-slider {
    background: #b8994f;
}

/* Line item provider badge when multi-provider is disabled */
.line-item-provider-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: #f3f4f6;
    border-radius: 4px;
    font-size: 12px;
    color: #4b5563;
}

.line-item-provider-badge .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

/* ==========================================================================
   PAYMENT CONFIRMATION MODAL - Enterprise Safety Feature v1.0.0
   Luxury-styled confirmation modal shown before charging any credit card
   SELF-CONTAINED: Does not rely on parent CSS variables
   ========================================================================== */

#payment-confirmation-modal {
    /* Full screen overlay */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 999999 !important;

    /* Dark overlay background */
    background: rgba(26, 39, 68, 0.85) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    /* Hidden by default */
    display: none;
    align-items: center;
    justify-content: center;

    /* Animation */
    opacity: 0;
    transition: opacity 0.3s ease;
}

#payment-confirmation-modal.active {
    display: flex !important;
    opacity: 1;
}

.payment-confirm-modal {
    max-width: 480px;
    width: 95%;
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
    background: #ffffff;
    box-shadow:
        0 25px 50px -12px rgba(0, 0, 0, 0.4),
        0 0 0 1px rgba(201, 169, 98, 0.3),
        0 0 80px rgba(201, 169, 98, 0.15);
    animation: confirmModalSlideIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes confirmModalSlideIn {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* Modal Header */
.payment-confirm-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 24px;
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%);
    border-bottom: 3px solid #C9A962;
}

.confirm-header-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #C9A962 0%, #b8994f 100%);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.4);
}

.confirm-header-icon .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #1A2744;
}

.payment-confirm-header .modal-title {
    flex: 1;
    margin: 0;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: #ffffff;
    letter-spacing: 0.5px;
}

.payment-confirm-header .modal-close {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.payment-confirm-header .modal-close:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

/* Modal Body */
.payment-confirm-body {
    padding: 24px;
    background: #ffffff;
}

/* Sections */
.confirm-section {
    margin-bottom: 20px;
}

.confirm-section-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #6b7280;
    margin-bottom: 8px;
}

/* Patient Info */
.confirm-patient {
    padding: 16px;
    background: linear-gradient(135deg, #f9fafb 0%, rgba(201, 169, 98, 0.05) 100%);
    border-radius: 12px;
    border: 1px solid #e5e7eb;
}

.confirm-patient-name {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    color: #1A2744;
    margin-bottom: 4px;
}

.confirm-patient-email {
    font-size: 13px;
    color: #4b5563;
}

/* Order Breakdown */
.confirm-breakdown {
    padding: 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
}

.confirm-breakdown-rows {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.confirm-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
}

.confirm-row-label {
    color: #4b5563;
}

.confirm-row-value {
    font-weight: 600;
    color: #1f2937;
}

.confirm-row-value.confirm-negative {
    color: #059669;
}

.confirm-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, #d1d5db, transparent);
    margin: 12px 0;
}

.confirm-total-row {
    padding-top: 8px;
}

.confirm-total-row .confirm-row-label {
    font-weight: 600;
    color: #1f2937;
}

.confirm-total-row .confirm-row-value {
    font-size: 18px;
    font-weight: 700;
    color: #1A2744;
}

/* Payment Method Card Display */
.confirm-payment-method {
    padding: 16px;
    background: #f9fafb;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
}

.confirm-card-display {
    display: flex;
    align-items: center;
    gap: 16px;
}

.confirm-card-icon {
    width: 56px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(26, 39, 68, 0.3);
}

.confirm-card-icon .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #C9A962;
}

/* Card brand logos */
.confirm-card-icon.visa { background: linear-gradient(135deg, #1a1f71 0%, #2c3e8c 100%); }
.confirm-card-icon.mastercard { background: linear-gradient(135deg, #eb001b 0%, #f79e1b 100%); }
.confirm-card-icon.amex { background: linear-gradient(135deg, #006fcf 0%, #0091d5 100%); }
.confirm-card-icon.discover { background: linear-gradient(135deg, #ff6600 0%, #ff9933 100%); }

.confirm-card-details {
    flex: 1;
}

.confirm-card-brand {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.confirm-card-number {
    font-size: 16px;
    font-weight: 600;
    color: #1A2744;
    font-family: 'SF Mono', 'Monaco', 'Menlo', monospace;
    letter-spacing: 2px;
    margin: 4px 0;
}

.confirm-card-expiry {
    font-size: 12px;
    color: #6b7280;
}

/* Charge Amount Highlight Box */
.confirm-charge-amount {
    margin-bottom: 24px;
}

.confirm-charge-box {
    padding: 24px;
    background: linear-gradient(135deg, #1A2744 0%, #2D3E5F 100%);
    border-radius: 16px;
    text-align: center;
    box-shadow:
        0 8px 24px rgba(26, 39, 68, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.confirm-charge-label {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 8px;
}

.confirm-charge-value {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 42px;
    font-weight: 700;
    color: #C9A962;
    text-shadow: 0 2px 8px rgba(201, 169, 98, 0.4);
    line-height: 1.1;
}

.confirm-charge-note {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 8px;
}

/* Action Buttons */
.confirm-actions {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.btn-confirm-cancel {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 20px;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-confirm-cancel:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

.btn-confirm-cancel .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.btn-confirm-proceed {
    flex: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 24px;
    background: linear-gradient(135deg, #C9A962 0%, #b8994f 100%);
    border: none;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 700;
    color: #1A2744;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow:
        0 4px 12px rgba(201, 169, 98, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.btn-confirm-proceed:hover {
    transform: translateY(-2px);
    box-shadow:
        0 6px 16px rgba(201, 169, 98, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.btn-confirm-proceed:active {
    transform: translateY(0);
}

.btn-confirm-proceed .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.btn-confirm-proceed .confirm-btn-amount {
    padding: 4px 10px;
    background: rgba(26, 39, 68, 0.2);
    border-radius: 6px;
    font-size: 14px;
    margin-left: 4px;
}

/* Processing state */
.btn-confirm-proceed.processing {
    pointer-events: none;
    opacity: 0.8;
}

.btn-confirm-proceed.processing .btn-text {
    display: none;
}

.btn-confirm-proceed.processing::after {
    content: 'Processing...';
}

/* Security Note */
.confirm-security-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 8px;
    font-size: 12px;
    color: #6b7280;
}

.confirm-security-note .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: #059669;
}

/* Responsive - Mobile */
@media (max-width: 520px) {
    .payment-confirm-modal {
        max-width: 100%;
        width: 100%;
        border-radius: 20px 20px 0 0;
        margin-top: auto;
    }

    #payment-confirmation-modal.active {
        align-items: flex-end;
    }

    .payment-confirm-header {
        padding: 16px 20px;
    }

    .payment-confirm-body {
        padding: 20px;
        max-height: 70vh;
        overflow-y: auto;
    }

    .confirm-charge-value {
        font-size: 36px;
    }

    .confirm-actions {
        flex-direction: column;
    }

    .btn-confirm-cancel,
    .btn-confirm-proceed {
        flex: none;
        width: 100%;
    }
}

/* ==========================================================================
   ORDER COMPLETED STATE
   ========================================================================== */

/* Button completed state */
#btn-process-checkout.btn-completed {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    color: white !important;
    cursor: default !important;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3) !important;
}

#btn-process-checkout.btn-completed .dashicons {
    color: white !important;
}

/* Payment disabled state */
#payment-method-options.payment-disabled {
    opacity: 0.5;
    pointer-events: none;
    filter: grayscale(50%);
}

/* Summary completed state */
.checkout-summary.order-completed {
    border-color: #10b981;
    background: linear-gradient(180deg, #ecfdf5 0%, #f0fdf4 100%);
}

/* Order Completion Summary Panel */
.order-completion-summary {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 50%, #f0fdf4 100%);
    border: 2px solid #10b981;
    border-radius: 16px;
    padding: 24px;
    margin: 20px 0;
    box-shadow: 0 4px 20px rgba(16, 185, 129, 0.15);
    animation: completionSlideIn 0.4s ease;
}

@keyframes completionSlideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.completion-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.completion-icon {
    font-size: 28px;
}

.completion-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: #065f46;
}

.completion-order-info {
    color: #6b7280;
    font-size: 14px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #d1fae5;
}

.completion-payments-section {
    background: white;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 20px;
}

.completion-payments-header {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #9ca3af;
    margin-bottom: 12px;
}

.completion-payments-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.completion-payment-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: #f9fafb;
    border-radius: 8px;
}

.completion-payment-row .payment-icon {
    font-size: 18px;
}

.completion-payment-row .payment-method {
    flex: 1;
    font-weight: 500;
    color: #374151;
}

.completion-payment-row .payment-amount {
    font-weight: 600;
    color: #1f2937;
}

.completion-payment-row .payment-status {
    font-size: 12px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 4px;
}

.completion-payment-row .payment-status.success {
    background: #d1fae5;
    color: #065f46;
}

.completion-total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 12px;
    margin-top: 12px;
    border-top: 2px solid #d1fae5;
    font-weight: 600;
}

.completion-total-row span:first-child {
    color: #6b7280;
}

.completion-total-amount {
    font-size: 20px;
    color: #065f46;
}

.completion-actions {
    display: flex;
    gap: 12px;
}

.btn-completion-action {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
}

.btn-completion-action .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.btn-completion-action.btn-print {
    background: white;
    color: #374151;
    border: 1px solid #e5e7eb;
}

.btn-completion-action.btn-print:hover {
    background: #f9fafb;
    border-color: #d1d5db;
}

.btn-completion-action.btn-next {
    background: linear-gradient(135deg, #C9A962 0%, #D4B86A 100%);
    color: #1A2744;
    box-shadow: 0 4px 12px rgba(201, 169, 98, 0.3);
}

.btn-completion-action.btn-next:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(201, 169, 98, 0.4);
}

/* Responsive */
@media (max-width: 520px) {
    .completion-actions {
        flex-direction: column;
    }
    
    .btn-completion-action {
        flex: none;
        width: 100%;
    }
}

/* ==========================================================================
   CONFIRMATION MODAL - GRANULAR BREAKDOWN
   ========================================================================== */

/* Granular credit/payment detail rows */
.confirm-credit-detail,
.confirm-payment-detail {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px dashed #e5e7eb;
}

.confirm-credit-detail:last-child,
.confirm-payment-detail:last-child {
    border-bottom: none;
}

.confirm-credit-detail .confirm-row-label,
.confirm-payment-detail .confirm-row-label {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #374151;
    font-size: 13px;
}

.confirm-row-icon {
    font-size: 16px;
    min-width: 20px;
    text-align: center;
}

.confirm-credit-detail .confirm-row-value,
.confirm-payment-detail .confirm-row-value {
    font-weight: 600;
    color: #059669;
    font-size: 13px;
}

/* Container styling */
#confirm-credits-container,
#confirm-payments-container {
    background: #f9fafb;
    border-radius: 8px;
    padding: 8px 12px;
    margin: 4px 0;
}

#confirm-credits-container {
    background: linear-gradient(135deg, #fef3c7 0%, #fef9c3 100%);
    border: 1px solid #fcd34d;
}

#confirm-payments-container {
    background: linear-gradient(135deg, #d1fae5 0%, #ecfdf5 100%);
    border: 1px solid #6ee7b7;
}

/* ==========================================================================
   GUARANTEED LINE ITEMS - Initial Treatment & Booking Deposit (v2.4.0)
   Always displayed at the top of order summaries for clarity
   ========================================================================== */

/* Base guaranteed row styling */
.guaranteed-row {
    background: linear-gradient(90deg, #f8fafc 0%, #ffffff 100%);
    border-left: 3px solid transparent;
}

/* Initial Treatment Row */
.guaranteed-row.initial-treatment-row {
    border-left-color: #3b82f6; /* Blue */
    background: linear-gradient(90deg, #eff6ff 0%, #ffffff 100%);
}

/* Deposit Row */
.guaranteed-row.deposit-row {
    border-left-color: #6b7280; /* Gray - default */
}

/* Deposit Row when paid */
.guaranteed-row.deposit-row.deposit-paid {
    border-left-color: #22c55e; /* Green */
    background: linear-gradient(90deg, #f0fdf4 0%, #ffffff 100%);
}

/* Badge cell */
.guaranteed-badge-cell {
    width: 36px;
    padding-left: 8px !important;
    vertical-align: middle;
}

/* Circular badges */
.guaranteed-badge {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #3b82f6;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.guaranteed-badge.initial {
    background: #3b82f6; /* Blue */
}

.guaranteed-badge.deposit {
    background: #6b7280; /* Gray - default */
}

.deposit-paid .guaranteed-badge.deposit {
    background: #22c55e; /* Green */
}

.deposit-none .guaranteed-badge.deposit {
    background: #9ca3af; /* Light gray */
}

/* Item cell styling */
.guaranteed-item-cell {
    vertical-align: middle;
}

.guaranteed-item-cell strong {
    display: block;
    font-size: 14px;
    color: #1f2937;
    margin-bottom: 2px;
}

.guaranteed-item-cell small {
    font-size: 12px;
    line-height: 1.3;
}

/* Separator between guaranteed items and other items */
.guaranteed-separator td {
    padding: 10px 0 !important;
    border: none !important;
}

.separator-line {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, #e5e7eb 15%, #e5e7eb 85%, transparent 100%);
    margin: 0 16px;
}

/* Text helpers */
.text-success {
    color: #22c55e !important;
}

.text-muted {
    color: #6b7280 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .guaranteed-badge {
        width: 20px;
        height: 20px;
        font-size: 10px;
    }
    
    .guaranteed-item-cell strong {
        font-size: 13px;
    }
    
    .guaranteed-item-cell small {
        font-size: 11px;
    }
}

/* OD Payments Summary Header (from earlier update) */
.od-payments-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: linear-gradient(90deg, #f0fdf4 0%, #ffffff 100%);
    border: 1px solid #86efac;
    border-radius: 6px;
    margin-bottom: 12px;
}

.od-payments-summary .total-count {
    font-size: 13px;
    font-weight: 600;
    color: #166534;
}

.od-payments-summary .total-amount {
    font-size: 14px;
    font-weight: 700;
    color: #15803d;
}

/* OD Link No Patient State */
.od-link-no-patient {
    text-align: center;
    padding: 24px 16px;
    background: #fefce8;
    border: 1px dashed #facc15;
    border-radius: 8px;
    margin: 16px 0;
}

.od-link-no-patient .dashicons {
    font-size: 32px;
    color: #ca8a04;
    margin-bottom: 8px;
}

.od-link-no-patient p {
    margin: 0;
    color: #854d0e;
    font-size: 14px;
}

/* OD Link No Payments State */
.od-link-no-payments {
    text-align: center;
    padding: 24px 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin: 16px 0;
}

.od-link-no-payments .dashicons {
    font-size: 32px;
    color: #9ca3af;
    margin-bottom: 8px;
}

.od-link-no-payments p {
    margin: 0 0 4px 0;
    color: #6b7280;
    font-size: 14px;
}

.od-link-no-payments p.subtext {
    font-size: 12px;
    color: #9ca3af;
}

/* ==========================================================================
   STRIPE TEST MODE INDICATOR (v2.5.0)
   ========================================================================== */

/* Test Mode Badge in Header */
.stripe-test-mode-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 2px solid #f59e0b;
    color: #92400e;
    padding: 6px 12px;
    border-radius: 6px;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: stripe-test-pulse 2s ease-in-out infinite;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
}

@keyframes stripe-test-pulse {
    0%, 100% { 
        opacity: 1;
        box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
    }
    50% { 
        opacity: 0.85;
        box-shadow: 0 2px 12px rgba(245, 158, 11, 0.5);
    }
}

.stripe-test-mode-badge .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    animation: stripe-warning-bounce 1s ease-in-out infinite;
}

@keyframes stripe-warning-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
}

.stripe-mode-label {
    font-weight: 800;
}

.stripe-mode-info {
    font-weight: 500;
    font-size: 10px;
    opacity: 0.85;
    text-transform: none;
}

/* DEPRECATED v2.7.0 - Toggle button removed, kept for backwards compatibility */
.stripe-mode-toggle-btn {
    background: #92400e;
    color: white;
    border: none;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    margin-left: 8px;
    transition: all 0.2s ease;
}

.stripe-mode-toggle-btn:hover {
    background: #78350f;
    transform: translateY(-1px);
}

.stripe-mode-toggle-btn:disabled {
    background: #d4a574;
    cursor: wait;
}

/* Live Mode - Enable Test Button */
.stripe-live-mode-badge {
    display: inline-flex;
    align-items: center;
}

.stripe-enable-test-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #d1d5db;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.stripe-enable-test-btn:hover {
    background: #fef3c7;
    border-color: #f59e0b;
    color: #92400e;
}

.stripe-enable-test-btn .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

.stripe-enable-test-btn:disabled {
    opacity: 0.5;
    cursor: wait;
}

/* Test Mode Warning Banner */
.stripe-test-banner {
    background: linear-gradient(90deg, #fef3c7 0%, #fde68a 30%, #fef3c7 70%, #fde68a 100%);
    background-size: 200% 100%;
    animation: stripe-banner-shimmer 3s ease-in-out infinite;
    border: 2px solid #f59e0b;
    border-radius: 8px;
    padding: 12px 20px;
    margin: 0 0 16px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 13px;
    color: #92400e;
    position: relative;
}

@keyframes stripe-banner-shimmer {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.stripe-test-banner > .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: #b45309;
    flex-shrink: 0;
}

.stripe-test-banner strong {
    color: #b45309;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.stripe-test-banner .test-card-hint {
    background: rgba(255, 255, 255, 0.6);
    padding: 4px 8px;
    border-radius: 4px;
    font-family: var(--ennu-font-mono, 'SF Mono', Monaco, 'Consolas', monospace);
}

.stripe-test-banner .test-card-hint code {
    background: #78350f;
    color: #fef3c7;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
}

.stripe-test-banner .dismiss-banner {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: #92400e;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stripe-test-banner .dismiss-banner:hover {
    background: rgba(146, 64, 14, 0.1);
}

.stripe-test-banner .dismiss-banner .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .stripe-test-mode-badge {
        padding: 4px 8px;
        font-size: 10px;
    }
    
    .stripe-mode-toggle-btn {
        padding: 3px 6px;
        font-size: 10px;
    }
    
    .stripe-test-banner {
        flex-wrap: wrap;
        padding: 10px 40px 10px 16px;
        font-size: 12px;
        gap: 8px;
    }
    
    .stripe-test-banner .test-card-hint {
        width: 100%;
        text-align: center;
        margin-top: 4px;
    }
}

/* ==========================================
   Test Order Duplication Styles (v2.6.0)
   ========================================== */

/* Test Order Banner - Displayed at top of test orders */
.ennu-test-order-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 100%);
    border: 2px solid #3b82f6;
    border-radius: 12px;
    margin-bottom: 16px;
    position: relative;
    animation: testOrderSlideIn 0.3s ease-out;
}

@keyframes testOrderSlideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ennu-test-order-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa, #3b82f6);
    background-size: 200% 100%;
    animation: testOrderGradientMove 2s linear infinite;
    border-radius: 12px 12px 0 0;
}

@keyframes testOrderGradientMove {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

.ennu-test-order-banner .test-order-icon {
    font-size: 24px;
    color: #1d4ed8;
    background: white;
    padding: 8px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);
}

.ennu-test-order-banner .test-order-label {
    font-weight: 700;
    font-size: 14px;
    color: #1d4ed8;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 4px 12px;
    background: white;
    border-radius: 20px;
    border: 2px solid #3b82f6;
}

.ennu-test-order-banner .test-order-meta {
    font-size: 13px;
    color: #1e40af;
    flex: 1;
}

.ennu-test-order-banner .test-order-source-link {
    color: #1d4ed8;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px dashed #3b82f6;
    transition: all 0.2s ease;
}

.ennu-test-order-banner .test-order-source-link:hover {
    color: #1e3a8a;
    border-bottom-style: solid;
}

.ennu-test-order-banner .test-order-warning {
    font-size: 11px;
    color: #b45309;
    background: #fef3c7;
    padding: 4px 10px;
    border-radius: 20px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Create Test Copy Button */
.ennu-btn-test-copy {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    color: #475569;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 8px;
}

.ennu-btn-test-copy:hover {
    background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%);
    border-color: #94a3b8;
    color: #1e293b;
    transform: translateY(-1px);
}

.ennu-btn-test-copy:active {
    transform: translateY(0);
}

.ennu-btn-test-copy:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.ennu-btn-test-copy .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

.ennu-btn-test-copy .dashicons.spin {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Test order styling for patient cards in sidebar */
.patient-card.is-test-order {
    border-left: 4px solid #3b82f6;
    background: linear-gradient(135deg, #f0f9ff 0%, #ffffff 100%);
    position: relative;
}

.patient-card.is-test-order::before {
    content: 'TEST';
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 9px;
    font-weight: 700;
    color: white;
    background: #3b82f6;
    padding: 2px 6px;
    border-radius: 4px;
    letter-spacing: 0.5px;
}

/* Test order styling in payment panel */
.summary-section.is-test-order {
    border: 2px dashed #3b82f6;
    border-radius: 8px;
    background: #f8fafc;
}

/* Test order payment warning */
.test-order-payment-warning {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 8px;
    margin-bottom: 12px;
    font-size: 12px;
    color: #92400e;
}

.test-order-payment-warning .dashicons {
    font-size: 18px;
    color: #f59e0b;
}

.test-order-payment-warning.blocked {
    background: #fee2e2;
    border-color: #ef4444;
    color: #991b1b;
}

.test-order-payment-warning.blocked .dashicons {
    color: #ef4444;
}

/* Responsive adjustments for test order styles */
@media (max-width: 768px) {
    .ennu-test-order-banner {
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px 12px;
    }
    
    .ennu-test-order-banner .test-order-meta {
        width: 100%;
        order: 3;
        font-size: 11px;
    }
    
    .ennu-test-order-banner .test-order-warning {
        font-size: 10px;
        padding: 3px 8px;
    }
    
    .ennu-btn-test-copy {
        padding: 3px 8px;
        font-size: 10px;
    }
}

/* ==========================================================================
   TEST ORDER MODAL (v2.6.1)
   Modal for selecting target user when creating test orders
   ========================================================================== */

/* Test Order Modal - Standalone styles (not using base .ennu-modal-overlay) */
.ennu-test-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    justify-content: center;
    align-items: center;
}

.ennu-test-modal {
    background: white;
    border-radius: 16px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    width: 480px;
    max-width: 95vw;
    max-height: 90vh;
    overflow: hidden;
    animation: testModalSlideIn 0.25s ease-out;
}

@keyframes testModalSlideIn {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(-10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.ennu-test-modal .ennu-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
}

.ennu-test-modal .ennu-modal-header h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: white;
}

.ennu-test-modal .ennu-modal-header h3 .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.ennu-test-modal .ennu-modal-close {
    background: rgba(255, 255, 255, 0.15);
    color: white;
    border: none;
    border-radius: 6px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease;
}

.ennu-test-modal .ennu-modal-close:hover {
    background: rgba(255, 255, 255, 0.25);
}

.ennu-test-modal .ennu-modal-body {
    padding: 20px;
}

.ennu-test-modal .test-order-info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 100%);
    border: 1px solid #93c5fd;
    border-radius: 10px;
    margin-bottom: 20px;
    font-size: 13px;
    color: #1e40af;
    line-height: 1.5;
}

.ennu-test-modal .test-order-info .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
    color: #3b82f6;
    flex-shrink: 0;
    margin-top: 2px;
}

.ennu-test-modal .test-order-user-select-wrapper {
    margin-top: 16px;
}

.ennu-test-modal .test-order-user-select-wrapper label {
    display: block;
    font-weight: 600;
    font-size: 14px;
    color: #1e293b;
    margin-bottom: 8px;
}

.ennu-test-modal #test-order-user-select {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    background: white;
    color: #1e293b;
    cursor: pointer;
    transition: all 0.2s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 18px;
    padding-right: 40px;
}

.ennu-test-modal #test-order-user-select:hover {
    border-color: #94a3b8;
}

.ennu-test-modal #test-order-user-select:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.ennu-test-modal .select-hint {
    font-size: 12px;
    color: #64748b;
    margin-top: 8px;
}

.ennu-test-modal .ennu-modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    background: #f8fafc;
    padding: 16px 20px;
    border-top: 1px solid #e2e8f0;
}

.ennu-test-modal .ennu-btn-secondary {
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 500;
    background: white;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease;
}

.ennu-test-modal .ennu-btn-secondary:hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #475569;
}

.ennu-test-modal .ennu-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    border: none;
    border-radius: 8px;
    color: white;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
}

.ennu-test-modal .ennu-btn-primary:hover:not(:disabled) {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
}

.ennu-test-modal .ennu-btn-primary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.ennu-test-modal .ennu-btn-primary .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* Responsive adjustments for test order modal */
@media (max-width: 540px) {
    .ennu-test-modal-overlay {
        align-items: flex-end;
    }
    
    .ennu-test-modal {
        width: 100%;
        max-width: 100%;
        border-radius: 16px 16px 0 0;
    }
    
    .ennu-test-modal .ennu-modal-footer {
        flex-direction: column;
    }
    
    .ennu-test-modal .ennu-modal-footer button {
        width: 100%;
        justify-content: center;
    }
}