:root{--primary: #4F46E5;--primary-hover: #4338CA;--secondary: #0EA5E9;--accent: #F43F5E;--background: #F8FAFC;--surface: #FFFFFF;--text-main: #0F172A;--text-muted: #64748B;--border: #E2E8F0;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--transition: all .3s cubic-bezier(.4, 0, .2, 1);--radius: 12px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--background);color:var(--text-main);line-height:1.4;min-height:100vh;padding:.5rem 1rem}#app{max-width:1200px;margin:0 auto}.content-wrapper{display:flex;justify-content:center;align-items:flex-start;min-height:100vh;padding:10px 12px;width:100%}.container{width:100%;max-width:100%;margin:0 auto}.main-header{text-align:center;margin-bottom:1.25rem}.main-header h1{font-family:Outfit,sans-serif;font-weight:700;font-size:1.75rem;color:var(--primary-color);margin-bottom:.25rem;letter-spacing:-.5px}.main-header p{color:var(--text-secondary);font-size:.95rem}.main-single-view{width:100%;display:flex;justify-content:center}.form-section{width:100%;background:#fff;padding:2rem;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.main-container{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}@media (max-width: 1024px){.main-container{grid-template-columns:1fr}}.form-section{background:var(--surface);padding:1.25rem;border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-md);animation:fadeInLeft .6s ease-out}.ticket-form-stack{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}label{font-size:.75rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}input:not([type=checkbox]):not([type=radio]),select{width:100%;max-width:100%;padding:.75rem 1rem;border-radius:calc(var(--radius) / 2);border:2px solid var(--border);font-family:inherit;font-size:1rem;transition:var(--transition);outline:none;background:#f1f5f9}input[type=checkbox],input[type=radio]{width:auto;max-width:none;cursor:pointer;accent-color:var(--primary);transform:scale(1.1)}input:focus,select:focus{border-color:var(--primary);background:var(--surface);box-shadow:0 0 0 4px #4f46e51a}#input-trainName,#input-from,#input-to,#input-quota,.field-name,.field-coach,.field-seat{text-transform:uppercase}.passenger-section h3{font-size:1.25rem;font-weight:600;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.passenger-section h3:before{content:"";width:4px;height:20px;background:var(--primary);border-radius:2px}#passenger-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}.passenger-item{display:grid;grid-template-columns:32px repeat(6,1fr) 32px;gap:.5rem;align-items:center;background:#fff;padding:.75rem;border-radius:var(--radius);border:1px solid var(--border);transition:var(--transition);box-shadow:var(--shadow-sm)}.passenger-item:hover{border-color:var(--primary);box-shadow:var(--shadow-md);transform:translateY(-1px)}.field-index{grid-column:1;grid-row:1 / span 2;font-weight:700;color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:.85rem;background:#eef2ff;width:24px;height:24px;border-radius:50%;align-self:start;margin-top:6px}.field-name{grid-column:2 / span 3;grid-row:1}.field-age{grid-column:5 / span 2;grid-row:1}.field-gender{grid-column:7 / span 1;grid-row:1}.field-catering{grid-column:2 / span 3;grid-row:3;text-transform:uppercase}.field-coach{grid-column:2 / span 2;grid-row:4}.field-seat{grid-column:4 / span 2;grid-row:4}.field-berth{grid-column:6 / span 2;grid-row:4}.remove-passenger{grid-column:8;grid-row:1 / span 2;justify-self:center;align-self:center;background:#fee2e2;color:#ef4444;border:none;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;transition:all .2s}.passenger-item input,.passenger-item select{width:100%;padding:.5rem .75rem;font-size:.85rem;background:#f8fafc;border:1px solid #E2E8F0;border-radius:6px}.passenger-item input:focus,.passenger-item select:focus{background:#fff;border-color:var(--primary);box-shadow:0 0 0 3px #4f46e51a}.preview-section{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-lg);overflow:visible!important;position:sticky;top:2rem;animation:fadeInRight .6s ease-out}.preview-controls{padding:1rem;background:#1e293b;display:flex;gap:1rem;justify-content:center}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-hover));color:#fff;padding:.875rem 1.75rem;border-radius:calc(var(--radius) / 2);border:none;font-weight:600;font-size:1rem;cursor:pointer;transition:var(--transition);box-shadow:0 4px 6px -1px #4f46e566}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #4f46e580;filter:brightness(1.1)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:#f1f5f9;color:var(--text-main);padding:.625rem 1.25rem;border-radius:calc(var(--radius) / 2);border:1px solid var(--border);font-weight:500;cursor:pointer;transition:var(--transition)}.btn-secondary:hover{background:var(--border);transform:scale(1.02)}.remove-passenger{background:#fee2e2;color:#ef4444;border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:all .2s}.remove-passenger:hover{background:#ef4444;color:#fff}.section-hint{font-size:.8rem;color:var(--text-secondary);margin-bottom:12px;font-style:italic}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.preview-section{width:100%;animation:fadeIn .4s ease-out}.preview-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:#fffc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;margin-bottom:2rem;border:1px solid rgba(255,255,255,.4);box-shadow:0 4px 6px #0000000d}.ticket-preview-box{background:#fff;padding:2rem;border-radius:0!important;box-shadow:0 10px 25px #0000001a;display:flex;justify-content:center;overflow:visible!important}#ticket-preview-container{width:100%;max-width:800px}.ticket-wrapper{background:#fff;width:100%;border-radius:0!important;border:none!important;padding:0!important;margin:0 auto!important}@media print{@page{margin:0!important;size:auto}.no-print{display:none!important}html,body{width:100%!important;height:auto!important;margin:0!important;padding:7mm!important;overflow:visible!important;background:#fff!important}body,.content-wrapper,.container,.main-flow-container{padding:0!important;margin:0!important;background:#fff!important;box-shadow:none!important;width:100%!important;max-width:none!important}.preview-section{display:block!important;width:100%!important}.ticket-preview-box{padding:0!important;margin:0!important;border:none!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;width:100%!important}.ticket-wrapper{margin:0!important;padding:0!important;border:none!important}#ticket-preview-container{width:100%!important;max-width:none!important}#printTable{width:100%!important;margin:0!important;border:2pt solid #000!important;border-collapse:collapse!important;border-spacing:0!important;border-radius:0!important;box-shadow:none!important;table-layout:auto!important}#printTable td,#printTable tr{border-color:#000!important;border-radius:0!important}.app-background{display:none}}.main-grid{display:grid;grid-template-columns:1fr;gap:2rem;transition:all .4s cubic-bezier(.4,0,.2,1);align-items:start}@media (max-width: 1023px){.main-grid.show-form #ticket-preview-section,.main-grid.show-preview #ticket-form-section{display:none}}@media (min-width: 1024px){.container{max-width:100%;padding:10px 24px}.main-grid{grid-template-columns:520px 1fr;gap:3rem}#ticket-form-section,#ticket-preview-section{display:block!important}#ticket-preview-section{position:sticky;top:40px}}.fade-in{animation:fadeIn .6s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.flex-1{flex:1}.btn-danger{background:#fee2e2;color:#ef4444;padding:.875rem 1.25rem;border-radius:calc(var(--radius) / 2);border:1px solid #fecaca;font-weight:600;cursor:pointer;transition:var(--transition)}.btn-danger:hover{background:#ef4444;color:#fff;transform:translateY(-2px);box-shadow:0 4px 6px -1px #ef444466}.required{color:#e53935;margin-left:2px}.error-border{border:2px solid #e53935!important;background-color:#fff8f8!important}.error-border:focus{outline:none;box-shadow:0 0 0 2px #e5393533}.hidden{display:none!important}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.w-full{width:100%}.flex{display:flex}.gap-4{gap:1rem}@media (max-width: 640px){.form-row{grid-template-columns:1fr;gap:.5rem}.form-section{padding:1rem}.main-header h1{font-size:1.5rem}.passenger-item{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:auto auto auto;gap:.5rem;padding:2.5rem .75rem .75rem;position:relative;box-shadow:0 1px 3px #0000001a}.field-index{position:absolute;top:.75rem;left:.75rem;width:auto;height:auto;background:transparent;margin:0;grid-column:auto;grid-row:auto;font-size:.9rem;color:var(--primary)}.remove-passenger{position:absolute;top:.5rem;right:.5rem;grid-column:auto;grid-row:auto;background:transparent;color:#ef4444;width:32px;height:32px}.remove-passenger:hover{background:#fee2e2;color:#ef4444}.field-name{grid-column:1 / -1;grid-row:1;width:100%}.field-age{grid-column:1 / span 2;grid-row:2}.field-gender{grid-column:3 / span 2;grid-row:2}.field-catering{grid-column:1 / span 2;grid-row:3}.field-coach{grid-column:1 / span 1;grid-row:4;padding:.75rem .5rem}.field-seat{grid-column:2 / span 1;grid-row:4;padding:.75rem .5rem}.field-berth{grid-column:3 / span 2;grid-row:4}input,select{font-size:16px;width:100%;max-width:100%}.form-actions{flex-direction:column}.btn-primary,.btn-danger{width:100%}}.mobile-tabs{display:none;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.25rem;margin-bottom:1.5rem;box-shadow:var(--shadow-sm);width:100%}.tab-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1rem;border:none;background:transparent;color:var(--text-muted);font-family:inherit;font-size:.95rem;font-weight:600;border-radius:calc(var(--radius) - 4px);cursor:pointer;transition:var(--transition)}.tab-btn:hover{color:var(--text-main);background:#f1f5f9}.tab-btn.active{background:var(--primary);color:#fff;box-shadow:var(--shadow-md)}.tab-icon{font-size:1.1rem}@media (max-width: 1023px){.mobile-tabs{display:flex}}.form-card-section{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;margin-bottom:1.5rem;transition:var(--transition);box-shadow:var(--shadow-sm)}.form-card-section:hover{border-color:#c7d2fe;box-shadow:var(--shadow-md)}.form-section-header{display:flex;align-items:center;gap:.5rem;margin-bottom:1.25rem;border-bottom:1px solid var(--border);padding-bottom:.5rem}.form-section-icon{font-size:1.25rem}.form-section-header h4{font-size:.9rem;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:.05em;margin:0}.form-section-content{display:flex;flex-direction:column;gap:1rem}.options-toggle-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.5rem;margin-bottom:1.25rem;width:100%}.toggle-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;padding:.65rem .5rem;background:#f8fafc;border:1.5px solid var(--border);border-radius:8px;cursor:pointer;transition:var(--transition);text-align:center;-webkit-user-select:none;user-select:none;position:relative}.toggle-card input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}.toggle-card:hover{background:#f1f5f9;border-color:var(--text-muted)}.toggle-card.checked{background:#eef2ff;border-color:var(--primary);color:var(--primary)}.toggle-card.checked:after{content:"✓";position:absolute;top:4px;right:6px;font-size:.7rem;font-weight:700;color:var(--primary)}.toggle-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em;line-height:1.2}.booking-date-picker{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.booking-date-picker select{width:auto!important;min-width:60px;padding:.5rem .35rem!important;font-size:.85rem!important;background:#f8fafc!important;border:1px solid var(--border)!important;border-radius:6px!important;cursor:pointer;outline:none;transition:var(--transition)}#select-bd-month{min-width:80px!important}#select-bd-year{min-width:75px!important}.booking-date-picker select:focus{border-color:var(--primary)!important;background:#fff!important}.form-actions{display:flex;gap:.75rem}@media (max-width: 640px){.form-actions{flex-direction:column;gap:.5rem}}.main-grid.hide-preview-mode{grid-template-columns:1fr!important;max-width:680px;margin:0 auto}.main-grid.hide-preview-mode #ticket-preview-section{display:none!important}@media (min-width: 1024px){.main-grid.hide-preview-mode{max-width:1200px!important}.main-grid.hide-preview-mode .ticket-form-stack{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}.main-grid.hide-preview-mode .payment-section,.main-grid.hide-preview-mode .form-actions{grid-column:1 / -1}}