*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #F8FAFC;--card-bg: #FFFFFF;--text-main: #0F172A;--text-muted: #64748B;--text-light: #94A3B8;--border: #E2E8F0;--border-subtle: #F1F5F9;--accent: #2A7F8E;--accent-hover: #1F616C;--accent-light: #F0F9FA;--accent-border: #CBD5E1;--accent-glow: rgba(42, 127, 142, .15);--success: #16A34A;--success-bg: #F0FDF4;--success-border: #BBF7D0;--danger: #DC2626;--danger-bg: #FEF2F2;--danger-border: #FECACA;--amber: #D97706;--amber-bg: #FFFBEB;--amber-border: #FDE68A;--radius-lg: 16px;--radius-md: 12px;--radius-sm: 8px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 16px -2px rgba(15, 23, 42, .06), 0 2px 6px -1px rgba(15, 23, 42, .04);--shadow-hover: 0 10px 25px -5px rgba(15, 23, 42, .08), 0 8px 10px -6px rgba(15, 23, 42, .04)}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg);color:var(--text-main);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh}.page{max-width:1180px;margin:0 auto;padding:24px 20px 60px}.page-center{display:flex;align-items:center;justify-content:center;min-height:80vh}.brand-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:var(--card-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border);margin-bottom:24px}.brand-logo-wrap{display:flex;align-items:center;gap:12px}.logo{height:36px;object-fit:contain}.brand-subtitle{font-size:13px;font-weight:600;color:var(--text-muted);border-left:2px solid var(--border);padding-left:12px;text-transform:uppercase;letter-spacing:.5px}.header-meta{display:flex;align-items:center;gap:12px}.invoice-chip{font-family:SF Mono,Menlo,Monaco,monospace;font-size:14px;font-weight:700;background:var(--bg);color:var(--text-main);padding:6px 12px;border-radius:var(--radius-sm);border:1px solid var(--border)}.status-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:6px 14px;border-radius:20px;text-transform:uppercase;letter-spacing:.6px}.status-dot{width:7px;height:7px;border-radius:50%;background:currentColor}.status-badge[data-status=draft]{background:#f1f5f9;color:#475569}.status-badge[data-status=sent]{background:#eff6ff;color:#2563eb}.status-badge[data-status=partially_paid]{background:#fef3c7;color:#d97706}.status-badge[data-status=fully_paid]{background:#dcfce7;color:#15803d}.status-badge[data-status=cancelled]{background:#fee2e2;color:#b91c1c}.banner{display:flex;align-items:center;gap:16px;padding:16px 20px;border-radius:var(--radius-md);margin-bottom:24px;border:1px solid transparent}.banner-success{background:var(--success-bg);border-color:var(--success-border);color:#14532d}.banner-cancelled{background:var(--danger-bg);border-color:var(--danger-border);color:#7f1d1d}.banner-icon-wrap{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;flex-shrink:0;background:#ffffffb3}.banner-title{font-weight:700;font-size:15px}.card{background:var(--card-bg);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-md);padding:24px;margin-bottom:24px;transition:transform .2s ease,box-shadow .2s ease}.card-header-badge{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px}.card-icon{font-size:16px}.section-title{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--accent)}.payment-grid{display:flex;flex-direction:column;gap:24px}@media(min-width:992px){.payment-grid{display:grid;grid-template-columns:1.18fr .82fr;gap:28px;align-items:start}.payment-sidebar-col{position:sticky;top:24px}}.tour-card .tour-name{font-size:22px;font-weight:800;color:var(--text-main);line-height:1.3;margin-bottom:12px;letter-spacing:-.3px}.tour-meta-row,.pax-meta-row{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text-muted);margin-top:8px}.meta-icon{font-size:16px}.tour-dates strong{color:var(--text-main)}.duration-pill{background:var(--accent-light);color:var(--accent);font-size:12px;font-weight:700;padding:3px 10px;border-radius:12px;margin-left:4px}.recipient-card .recipient-name{font-size:18px;font-weight:700;color:var(--text-main);margin-bottom:4px}.recipient-detail{font-size:14px;color:var(--text-muted);margin-top:4px}.detail-label{font-weight:600;color:var(--text-main)}.due-date-card{display:flex;align-items:center;gap:14px;background:var(--amber-bg);border:1px solid var(--amber-border);padding:14px 20px;border-radius:var(--radius-md);margin-bottom:24px}.due-date-icon{font-size:22px}.due-date-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--amber)}.due-date-value{font-size:16px;font-weight:700;color:#92400e}.items-card{padding-bottom:12px}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.items-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;margin-top:8px}.items-table th{text-align:left;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);padding:12px 10px;border-bottom:2px solid var(--border-subtle);background:var(--bg)}.items-table th:first-child{border-top-left-radius:var(--radius-sm);border-bottom-left-radius:var(--radius-sm)}.items-table th:last-child{border-top-right-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm)}.items-table th.num,.items-table td.num{text-align:right;white-space:nowrap}.items-table td{padding:14px 10px;border-bottom:1px solid var(--border-subtle);vertical-align:top}.item-title{font-weight:600;color:var(--text-main)}.item-detail{font-size:12px;color:var(--text-muted);margin-top:3px}.qty-badge{display:inline-block;background:var(--bg);border:1px solid var(--border);padding:2px 8px;border-radius:6px;font-weight:600;font-size:13px}.total-cell{font-weight:700;color:var(--text-main);font-variant-numeric:tabular-nums}.totals-card{background:linear-gradient(180deg,#fff,#f8fafc)}.totals-list{display:flex;flex-direction:column;gap:12px;margin-top:12px}.total-row{display:flex;align-items:center;justify-content:space-between;font-size:14px}.total-label{color:var(--text-muted)}.total-value{font-weight:600;color:var(--text-main);font-variant-numeric:tabular-nums}.total-row.deposit .total-value{color:var(--amber)}.total-row.paid .total-value.negative{color:var(--success)}.balance-highlight{display:flex;align-items:center;justify-content:space-between;background:var(--accent-light);border:1px solid rgba(42,127,142,.2);padding:16px 18px;border-radius:var(--radius-md);margin-top:8px}.balance-label{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--accent)}.balance-value{font-size:24px;font-weight:800;color:var(--accent-hover);font-variant-numeric:tabular-nums;letter-spacing:-.5px}.action-card{padding:20px}.tabs-segmented{display:flex;background:var(--bg);padding:4px;border-radius:var(--radius-md);border:1px solid var(--border);margin-bottom:20px;gap:4px}.tab-segment{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 14px;min-height:48px;font-size:13px;font-weight:700;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);cursor:pointer;transition:all .2s ease}.tab-segment:hover:not(.active){color:var(--text-main);background:#ffffff80}.tab-segment.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px #2a7f8e40}.bank-header-note{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-muted);margin-bottom:16px;padding-bottom:12px;border-bottom:1px dashed var(--border)}.bank-badge{background:#e0f2fe;color:#0369a1;font-size:11px;font-weight:800;padding:2px 8px;border-radius:4px}.bank-muted{opacity:.4;pointer-events:none}.sepa-trust-seal{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:600;color:var(--accent-hover);background:var(--accent-light);padding:10px;border-radius:var(--radius-sm);margin-top:16px;border:1px solid rgba(42,127,142,.15)}.copy-field{margin-bottom:14px}.copy-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);margin-bottom:4px}.copy-value-row{display:flex;align-items:center;justify-content:space-between;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;gap:10px;transition:border-color .2s ease;min-height:48px}.copy-value-row:hover{border-color:var(--accent-border)}.copy-value{font-size:14px;font-weight:600;color:var(--text-main);word-break:break-all;flex:1}.copy-value.monospace{font-family:SF Mono,Menlo,Monaco,monospace;letter-spacing:.5px}.copy-value.primary-val{font-size:15px;font-weight:700;color:var(--accent)}.copy-btn{background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 14px;min-height:36px;font-size:12px;font-weight:700;color:var(--text-main);cursor:pointer;transition:all .2s ease;flex-shrink:0;box-shadow:var(--shadow-sm)}.copy-btn:hover{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}.copy-btn.copied{background:var(--success);border-color:var(--success);color:#fff}.copy-btn-inner{display:flex;align-items:center;gap:5px}.reference-highlight-box{background:var(--amber-bg);border:1px solid var(--amber-border);padding:14px;border-radius:var(--radius-md);margin-top:16px}.reference-highlight-box .copy-value-row{background:#fff;border-color:var(--amber-border)}.reference-highlight-box .copy-value{color:#92400e;font-weight:800}.reference-note{font-size:12px;color:#92400e;margin-top:10px;line-height:1.4;font-weight:500}.card-payment-title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}.card-payment-title{font-size:14px;font-weight:700;color:var(--text-main)}.card-brand-badges{display:flex;align-items:center;gap:6px}.card-brand-chip{font-size:10px;font-weight:800;padding:2px 6px;border-radius:4px;border:1px solid var(--border);text-transform:uppercase}.card-brand-chip.visa{background:#1a1f71;color:#fff;border-color:#1a1f71}.card-brand-chip.mc{background:#eb001b;color:#fff;border-color:#eb001b}.card-breakdown{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:14px 16px;margin-bottom:16px}.breakdown-row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;color:var(--text-muted)}.breakdown-row.total{font-weight:800;font-size:16px;color:var(--text-main);border-top:1px solid var(--border);padding-top:10px;margin-top:6px}.breakdown-vnd-card{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border);display:flex;align-items:center;justify-content:space-between}.breakdown-vnd-label{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted)}.rate-info-icon{cursor:help;font-size:14px;color:var(--accent)}.breakdown-vnd-value{font-size:18px;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums}.card-fee-note-box{background:var(--bg);padding:12px 14px;border-radius:var(--radius-sm);margin-bottom:16px}.card-fee-note{font-size:12px;color:var(--text-muted);line-height:1.4}.card-fee-disclaimer{font-size:11px;color:var(--text-light);margin-top:4px}.pay-button{width:100%;padding:16px;min-height:52px;background:var(--accent);color:#fff;border:none;border-radius:var(--radius-md);font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 4px 14px #2a7f8e59;transition:all .2s ease}.pay-button:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 20px #2a7f8e73}.pay-button:active:not(:disabled){transform:translateY(0)}.pay-button:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}.pay-btn-inner{display:flex;align-items:center;justify-content:center;gap:8px}.card-security-guarantee{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;color:var(--text-muted);margin-top:12px}.pay-error{color:var(--danger);font-size:13px;margin-top:10px;text-align:center;font-weight:600}.payment-notes-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:16px 18px;margin-bottom:24px}.notes-header{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);margin-bottom:10px}.notes-list{list-style:none;counter-reset:notes-counter}.notes-list li{counter-increment:notes-counter;position:relative;padding-left:22px;font-size:12px;color:var(--text-muted);line-height:1.5}.notes-list li+li{margin-top:8px}.notes-list li:before{content:counter(notes-counter) ".";position:absolute;left:0;font-weight:800;color:var(--accent)}.portal-footer{text-align:center;padding-top:20px;border-top:1px solid var(--border);font-size:12px;color:var(--text-muted)}.footer-trust-bar{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;font-size:11px;color:var(--text-muted);flex-wrap:wrap}.trust-sep{opacity:.4}.loading-card,.error-card{text-align:center;padding:48px 32px;max-width:480px;width:100%}.loading-text{font-size:15px;font-weight:600;color:var(--text-muted);margin-top:16px}.spinner-glow{width:40px;height:40px;border:4px solid var(--accent-light);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto}.btn-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:640px){.page{padding:12px 10px 36px}.brand-header{flex-direction:column;align-items:flex-start;gap:12px;padding:14px 16px}.brand-subtitle{display:none}.header-meta{width:100%;justify-content:space-between}.card{padding:16px 14px;border-radius:var(--radius-md);margin-bottom:16px}.tour-card .tour-name{font-size:18px}.balance-highlight{flex-direction:row;align-items:center;padding:14px}.balance-value{font-size:20px}.tab-segment{padding:10px 8px;font-size:12px}.copy-value-row{padding:8px 10px}.copy-value{font-size:13px}.copy-btn{padding:6px 10px}.footer-trust-bar{font-size:10px;gap:4px}}