*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#f4f7fb;color:#172033}.app-shell{display:flex;min-height:100vh}.sidebar{width:240px;background:#0d1830;color:#fff;padding:22px;position:fixed;inset:0 auto 0 0}.brand{font-weight:800;font-size:18px;margin-bottom:30px}.brand small{display:block;color:#9aa9c4;font-size:10px;margin-top:4px}.nav-item{display:block;width:100%;border:0;background:none;color:#aebbd1;padding:13px;text-align:left;border-radius:9px;margin:4px 0;cursor:pointer}.nav-item.active{background:#1b2d50;color:#fff}.main{margin-left:240px;width:calc(100% - 240px);padding:25px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.page{display:none}.active-page{display:block}.hero,.panel,.stat,.flight{background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:22px;margin-bottom:16px}.hero{background:#122952;color:white}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat b{font-size:27px;display:block;margin:8px 0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}label{font-size:11px;font-weight:bold;color:#64748b;display:block;margin-bottom:12px}input,select,textarea{width:100%;padding:11px;border:1px solid #d7dfeb;border-radius:8px;margin-top:6px}button{cursor:pointer}.primary,.ghost{border:0;border-radius:8px;padding:11px 16px;font-weight:bold}.primary{background:#2f6df6;color:white}.ghost{background:#eaf0f7;color:#334b72}.form-actions,.section-head,.toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:15px 0}.total-box{display:flex;justify-content:space-between;background:#f1f5fb;padding:14px;border-radius:8px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:650px}th,td{padding:12px;border-bottom:1px solid #edf1f6;text-align:left;font-size:12px}.badge{padding:5px 8px;border-radius:20px;background:#e7f8f0;color:#16835b;font-size:10px;font-weight:bold}.flight-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.flight{margin:0}.route{display:flex;justify-content:space-between;align-items:center;margin:22px 0}.route strong{font-size:25px}.line{height:1px;background:#ccd6e4;flex:1;margin:0 12px}.mobile-menu{display:none}.ticket-page{background:#eef3f9}.ticket-page-wrap{max-width:850px;margin:auto;padding:30px 20px}.ticket-toolbar{display:flex;justify-content:space-between;margin-bottom:18px}.ticket{background:white;border:1px solid #dce4ef;border-radius:14px;overflow:hidden}.ticket-head{background:#102653;color:#fff;padding:22px;display:flex;justify-content:space-between}.pnr{font-size:20px;font-weight:800}.ticket-body{padding:24px}.ticket-route{display:grid;grid-template-columns:1fr 80px 1fr;text-align:center;align-items:center;margin:25px 0}.ticket-route strong{font-size:35px}.ticket-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;border-top:1px solid #e2e7ef;padding-top:18px}.ticket-grid small{display:block;color:#8995a8;font-size:9px;text-transform:uppercase}.ticket-grid b{font-size:12px}.ticket-bottom{display:flex;justify-content:space-between;border-top:1px dashed #ccd6e4;margin-top:24px;padding-top:18px}.barcode{font-family:monospace;letter-spacing:3px}.ticket-note{margin-top:18px;background:#f4f7fb;padding:12px;font-size:10px;line-height:1.5}@media(max-width:900px){.sidebar{transform:translateX(-100%);z-index:5}.sidebar.open{transform:translateX(0)}.main{margin-left:0;width:100%}.mobile-menu{display:block}.stats,.flight-cards,.form-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.stats,.flight-cards,.form-grid,.grid-2,.ticket-grid{grid-template-columns:1fr}.ticket-route{grid-template-columns:1fr 45px 1fr}}@media print{.ticket-toolbar{display:none}.ticket-page-wrap{padding:0}.ticket{box-shadow:none}.ticket-head{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
/* BOARDING PASS TICKET */

/* BOARDING PASS TICKET */
.boarding-page{margin:0;min-height:100vh;background:#eef0ee;font-family:Arial,Helvetica,sans-serif;color:#172033}
.ticket-toolbar{width:min(1120px,calc(100% - 30px));margin:20px auto 0;display:flex;justify-content:space-between;align-items:center}
.ticket-back{color:#254f91;text-decoration:none;font-weight:700;font-size:13px}
.print-btn{border:0;border-radius:8px;background:#153f88;color:#fff;padding:11px 16px;font-weight:700;cursor:pointer}
.boarding-wrap{width:min(1050px,calc(100% - 30px));margin:25px auto 60px}
.airline-mini{display:flex;justify-content:space-between;align-items:center;margin:0 0 16px;color:#6e7681;font-size:12px;font-weight:800;letter-spacing:.7px}
.airline-mini small{font-weight:500;letter-spacing:0}
.sky-logo{font-size:22px;font-weight:900;color:#111}.sky-logo span{color:#1970b7}
.boarding-pass{display:grid;grid-template-columns:minmax(0,1fr) 22px 315px;min-height:345px;background:#f8f8f3;border:1px solid #b8bdc2;box-shadow:0 12px 35px rgba(0,0,0,.18)}
.main-pass{min-width:0}
.pass-top{height:66px;background:#294a99;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 22px 0 16px}
.pass-brand{display:flex;align-items:center;gap:13px}.plane-symbol{font-size:40px;transform:rotate(-25deg);opacity:.95}.pass-brand strong{display:block;font-size:17px;letter-spacing:.5px}.pass-brand small{display:block;font-size:9px;margin-top:3px;letter-spacing:1px;opacity:.8}
.class-label{font-size:13px;font-weight:800;letter-spacing:1px}
.pass-content{padding:22px 26px 16px}
.pass-grid{display:grid;grid-template-columns:2fr 1.1fr 1fr .8fr;gap:22px}
.pass-grid label,.route-row label,.details-row label,.stub label{display:block;font-size:9px;color:#515a65;font-weight:800;letter-spacing:.5px;margin-bottom:4px}.pass-grid strong{font-size:15px}.flight-big{font-size:23px!important}.seat-big{font-size:23px!important}
.route-row{display:grid;grid-template-columns:1fr 75px 1fr;align-items:center;text-align:left;margin:25px 0 22px}.route-row>div:nth-child(3){text-align:right}.route-row strong{display:block;font-size:32px;letter-spacing:.5px}.route-row small{font-size:10px;color:#596473}.route-arrow{text-align:center;font-size:28px;color:#294a99;transform:rotate(-8deg)}
.details-row{display:grid;grid-template-columns:.7fr 1fr 1.3fr 1fr;gap:15px;border-top:1px solid #cdd1d5;border-bottom:1px solid #cdd1d5;padding:13px 0}.details-row strong{font-size:18px}.boarding-time strong{color:#c52e32;font-size:23px}
.pass-footer{display:flex;justify-content:space-between;gap:15px;font-size:8px;color:#6b737c;padding-top:12px}.pass-footer b{color:#c52e32}
.tear-line{position:relative;border-left:1px dashed #9da4ab;border-right:1px dashed #9da4ab;background:#f8f8f3}.tear-line:before,.tear-line:after{content:"";position:absolute;width:20px;height:20px;background:#eef0ee;border-radius:50%;left:50%;transform:translateX(-50%)}.tear-line:before{top:-10px}.tear-line:after{bottom:-10px}.tear-line span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(90deg);font-size:13px;color:#9ba2aa}
.stub{background:#f8f8f3;min-width:0}.stub-head{height:66px;background:#294a99;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 16px;font-size:13px}.stub-head span{font-size:11px}.stub-body{padding:18px 18px 12px}.stub-person strong{font-size:13px}.stub-route{display:grid;grid-template-columns:1fr 25px 1fr;align-items:end;gap:8px;margin:20px 0}.stub-route span{text-align:center;color:#294a99;font-size:18px}.stub-route strong{font-size:21px}.stub-line{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}.stub-line strong{font-size:13px}.stub-seat{border:1px solid #6e7782;padding:6px 9px;display:inline-block}
.barcode{height:58px;display:flex;align-items:center;gap:2px;margin:15px 0 5px;overflow:hidden}.barcode i{display:block;width:2px;background:#111}.barcode i:nth-child(3n){width:4px}.trip-note{display:block;text-align:center;font-size:10px;font-weight:800;color:#31518f;letter-spacing:.5px}
.demo-notice{text-align:center;margin:15px auto;color:#8b9299;font-size:10px;letter-spacing:.2px}
.not-found{background:#fff;padding:35px;border-radius:12px;width:min(500px,calc(100% - 30px));margin:80px auto;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.08)}.not-found a{display:inline-block;margin-top:15px;background:#153f88;color:#fff;padding:10px 15px;border-radius:7px;text-decoration:none}
@media(max-width:850px){.boarding-pass{grid-template-columns:1fr}.tear-line{display:none}.stub{border-top:1px dashed #9da4ab}.pass-grid{grid-template-columns:1.5fr 1fr 1fr 1fr}.ticket-toolbar{margin-top:12px}}
@media(max-width:600px){.ticket-toolbar{align-items:stretch;gap:8px;flex-direction:column}.boarding-wrap{width:calc(100% - 20px);margin-top:18px}.pass-top{padding:0 13px}.pass-content{padding:18px 15px}.pass-grid{grid-template-columns:1fr 1fr;gap:15px}.route-row{grid-template-columns:1fr 45px 1fr}.route-row strong{font-size:27px}.details-row{grid-template-columns:1fr 1fr}.pass-footer{flex-direction:column}.stub{padding-bottom:8px}}
@media print{.boarding-page{background:#fff}.ticket-toolbar,.airline-mini,.demo-notice{display:none!important}.boarding-wrap{width:100%;margin:0}.boarding-pass{box-shadow:none;border:1px solid #777;min-height:auto}.pass-top,.stub-head{-webkit-print-color-adjust:exact;print-color-adjust:exact}.pass-footer b,.boarding-time strong{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
