:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:#1a2e43;background:#f3f6fb;--ink:#172c43;--muted:#77869a;--blue:#245b94;--navy:#11375d;--line:#e1e8f0;--bg:#f3f6fb;--surface:#fff;--green:#16856c;--amber:#bb7d2f;--red:#ba5260;--shadow:0 9px 28px rgba(18,53,91,.045)}*{box-sizing:border-box}html,body{margin:0;min-width:320px}body{min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}a{color:inherit;text-decoration:none}.hidden{display:none!important}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #8dc0f2;outline-offset:2px}
.app-shell{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#113a60;color:white;display:flex;flex-direction:column;padding:25px 16px 18px;overflow:auto}.logo-row{display:flex;align-items:center;gap:12px;padding:0 9px 30px}.logo-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#fff;color:var(--navy);font-weight:950;font-size:14px;letter-spacing:-.07em}.logo-row strong{display:block;font-size:14px;letter-spacing:-.03em}.logo-row small{display:block;color:#a4c0da;font-size:10px;letter-spacing:.15em;margin-top:3px}.side-label{font-size:10px;color:#8aabc9;letter-spacing:.15em;margin:0 12px 9px;font-weight:800}.nav-links{display:grid;gap:4px}.nav-btn{border:0;width:100%;border-radius:11px;background:none;color:#bcd0e3;text-align:left;display:flex;gap:12px;align-items:center;font-size:12px;font-weight:690;padding:12px}.nav-btn:hover{background:#1c4a74;color:white}.nav-btn.active{background:#2b5c85;color:white}.nav-btn .svg-icon{width:19px;height:19px}.side-spacer{flex:1}.sidebar-foot{border-top:1px solid #326083;padding:17px 8px 1px;color:#bcd0e3;font-size:11px;line-height:1.6}.sidebar-foot strong{color:white;display:block}.main{min-width:0}.topbar{height:80px;padding:0 clamp(20px,3vw,50px);display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;border-bottom:1px solid var(--line)}.topbar-left{display:flex;gap:13px;align-items:center}.topbar-title{font-size:13px;font-weight:850;color:var(--navy)}.topbar-sub{font-size:11px;color:#93a0ae;margin-top:3px}.topbar-right{display:flex;align-items:center;gap:12px}.icon-btn{border:1px solid #e4eaf2;border-radius:11px;background:#fff;width:39px;height:39px;display:grid;place-items:center;color:var(--navy)}.top-profile{display:flex;gap:10px;align-items:center}.avatar{width:35px;height:35px;display:grid;place-items:center;background:#e7f1ff;color:#215895;border-radius:12px;font-size:12px;font-weight:850}.profile-txt{line-height:1.4}.profile-txt strong{font-size:11px;display:block}.profile-txt small{font-size:10px;color:var(--muted)}.content{max-width:1600px;margin:0 auto;padding:34px clamp(18px,3vw,50px) 60px}.page-intro{display:flex;gap:20px;justify-content:space-between;align-items:flex-end;margin:0 0 25px}.eyebrow{font-size:10px;color:#5581a9;font-weight:900;letter-spacing:.16em;text-transform:uppercase;margin:0 0 9px}.page-intro h1{margin:0;font-size:clamp(24px,2.9vw,33px);letter-spacing:-.055em;color:#15395d;line-height:1.16}.page-intro p:not(.eyebrow){font-size:12px;color:#8290a0;margin:9px 0 0;line-height:1.6}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.btn{height:40px;border-radius:10px;padding:0 15px;display:inline-flex;align-items:center;gap:8px;justify-content:center;border:1px solid #dce5ef;background:white;color:#254669;font-size:11px;font-weight:800;white-space:nowrap}.btn:hover{border-color:#a8bfd7;background:#f9fbff}.btn.primary{background:#215b97;color:#fff;border-color:#215b97;box-shadow:0 8px 16px #1b579222}.btn.primary:hover{background:#174e85}.btn.danger{color:#a83d54;background:#fff3f4;border-color:#f3d5d8}.btn.tiny{height:31px;padding:0 10px;font-size:10px}.btn .svg-icon{width:16px;height:16px}.svg-icon{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.demo-banner{border:1px solid #d5e6f9;background:#eaf3ff;color:#2e6093;border-radius:12px;padding:13px 16px;display:flex;align-items:center;gap:12px;font-size:11px;line-height:1.6;margin-bottom:20px}.demo-banner strong{color:#204e7e}.demo-banner .svg-icon{flex-shrink:0}.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:20px}.metric{background:#fff;border:1px solid #e3eaf1;border-radius:15px;min-width:0;box-shadow:var(--shadow);padding:21px}.metric-top{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#697d90;font-size:11px;font-weight:650}.metric-symbol{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#edf5fd;color:#3974a9}.metric-symbol.green{background:#ebf8f3;color:#138567}.metric-symbol.amber{background:#fcf3e7;color:#ba7833}.metric-symbol.red{background:#fff0f1;color:#bb5461}.metric h2{margin:12px 0 5px;color:var(--navy);font-size:29px;line-height:1.1;letter-spacing:-.055em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric p{margin:0;color:#91a0af;font-size:10px}.cols{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(270px,.85fr);gap:19px;align-items:start}.stack{display:grid;gap:19px}.panel{background:#fff;border:1px solid #e1e9f1;border-radius:15px;box-shadow:var(--shadow);min-width:0;overflow:hidden}.panel-head{min-height:69px;padding:20px 22px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-head h3{margin:0;color:#1d3c5a;font-size:13px;letter-spacing:-.012em}.panel-head p{color:#8898a7;font-size:10px;margin:5px 0 0}.panel-body{padding:0 22px 22px}.panel-tag{color:#3a79ad;font-size:10px;font-weight:800}.trip-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0;border-bottom:1px solid #f0f3f7}.trip-row:last-child{border-bottom:0}.trip-time{width:57px;flex-shrink:0;text-align:center}.trip-time b{display:block;font-size:15px;color:#173d65}.trip-time small{display:block;color:#91a0af;font-size:9px;margin-top:3px}.trip-detail{flex:1;min-width:0}.trip-detail strong{font-size:11px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trip-detail span{color:#8494a3;font-size:10px;display:block;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pill{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;font-size:9px;font-weight:850;border-radius:99px;padding:6px 9px;color:#51728d;background:#eef3f8}.pill.green{color:#168269;background:#e6f6ee}.pill.amber{color:#a87028;background:#fff5e6}.pill.red{color:#b3495e;background:#fff0f3}.pill.blue{color:#2e6caa;background:#eaf3ff}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.75}.hotel-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #eef2f6}.hotel-row:last-child{border:0}.hotel-color{width:9px;height:32px;border-radius:8px;flex-shrink:0;background:var(--hotel-color,#3772b5)}.hotel-row-main{min-width:0;flex:1}.hotel-row strong{display:block;font-size:11px;color:#253d56}.hotel-row small{display:block;margin-top:4px;color:#8999a8;font-size:9px}.hotel-row-num{font-size:12px;color:#235e9d;font-weight:850}.quick-links{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.quick-link{border:1px solid #e7edf3;border-radius:11px;background:#fbfdff;padding:17px;text-align:left;min-height:101px}.quick-link:hover{border-color:#b4d1ed;background:#f1f8ff}.quick-link .svg-icon{color:#2e6b9f}.quick-link strong{display:block;color:#234260;font-size:11px;margin-top:13px}.quick-link small{display:block;color:#91a0af;font-size:9px;margin-top:4px}.toolbar{display:flex;flex-wrap:wrap;align-items:end;gap:11px;margin-bottom:17px}.field{min-width:0;display:grid;gap:6px;flex:1 1 155px}.field label{font-size:10px;color:#637990;font-weight:850}.input{height:42px;width:100%;min-width:0;border:1px solid #dce6ef;border-radius:10px;background:#fff;padding:0 12px;color:#263e55;font-size:12px}.input:focus{border-color:#7da8cf;outline:3px solid #d9eaff}.textarea{height:auto;min-height:90px;padding:10px 12px;resize:vertical}.search-box{min-width:230px;flex:2 1 230px}.table-scroll{width:100%;overflow-x:auto}table{border-collapse:collapse;width:100%}th{background:#f8fafc;padding:14px 15px;color:#718499;font-size:10px;white-space:nowrap;text-align:left;font-weight:900;border-top:1px solid #edf1f6;border-bottom:1px solid #edf1f6}td{padding:14px 15px;border-bottom:1px solid #eff2f5;color:#3b4f64;font-size:11px;vertical-align:middle;line-height:1.5}tbody tr:hover{background:#fbfdff}.td-strong{font-weight:850;color:#1c3e60}.td-muted{color:#9aa6b3;font-size:10px}.td-actions{white-space:nowrap}.td-actions .btn{margin-right:5px}.empty{padding:38px 24px;text-align:center;color:#8192a3;font-size:12px;line-height:1.8}.empty strong{display:block;color:#213f5c;font-size:14px;margin-bottom:5px}.split-section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px}.driver-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.driver-card{background:#fff;border:1px solid #e2eaf2;border-radius:14px;padding:18px;min-width:0;box-shadow:var(--shadow)}.driver-head{display:flex;gap:11px;align-items:center}.driver-icon{width:40px;height:40px;border-radius:12px;background:#eaf2fc;display:grid;place-items:center;font-weight:900;color:#285d91}.driver-card h3{margin:0;font-size:13px;color:#20405e}.driver-card p{color:#96a4b0;font-size:10px;margin:5px 0 0}.driver-meta{margin:18px 0;color:#8294a3;font-size:10px;line-height:2}.driver-actions{display:flex;justify-content:space-between;align-items:center}.report-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.7fr);gap:19px}.bar-row{display:grid;grid-template-columns:130px minmax(0,1fr) 44px;gap:10px;align-items:center;margin:18px 0}.bar-row label{font-size:10px;color:#61768c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar-track{height:9px;background:#eef3f8;border-radius:10px;overflow:hidden}.bar-fill{height:100%;background:#3472ad;border-radius:10px}.bar-row strong{text-align:right;font-size:11px;color:#244d76}.activity-item{display:flex;gap:11px;padding:14px 0;border-bottom:1px solid #edf1f5}.activity-item:last-child{border:0}.activity-ic{width:28px;height:28px;display:grid;place-items:center;background:#f0f5fa;border-radius:9px;color:#2f679b;flex-shrink:0}.activity-item strong{font-size:11px;color:#28425d}.activity-item p{font-size:10px;color:#8292a3;margin:4px 0}.activity-item time{font-size:9px;color:#a5b0bd}.modal-layer{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:16px;background:#102840a8;backdrop-filter:blur(4px)}.modal{background:#fff;border:1px solid #dce6f1;width:min(570px,100%);max-height:calc(100dvh - 32px);overflow:auto;border-radius:18px;box-shadow:0 35px 100px #061e364d}.modal-header{display:flex;justify-content:space-between;gap:14px;align-items:start;padding:25px 25px 18px;border-bottom:1px solid #edf1f5}.modal-header h2{margin:0;color:#173a5e;font-size:19px}.modal-header p{margin:6px 0 0;font-size:11px;color:#8292a3}.modal-form{padding:22px 25px 25px;display:grid;gap:14px}.modal-form .field{width:100%}.modal-form .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-actions{display:flex;gap:9px;justify-content:flex-end;margin-top:8px}.dialog-x{width:33px;height:33px;border:1px solid #e4eaf0;border-radius:9px;background:#fff;font-size:21px;color:#7590a8}.notice{font-size:11px;color:#69839b;background:#eff6fc;border:1px solid #dcebf7;padding:12px;border-radius:10px;line-height:1.6}.toast-wrap{position:fixed;z-index:2000;right:18px;bottom:24px;display:grid;gap:8px;max-width:min(410px,calc(100vw - 36px))}.toast{background:#153c60;color:#fff;border-radius:11px;padding:14px 17px;box-shadow:0 15px 35px #163c6055;font-size:12px;line-height:1.6}.toast.error{background:#a33b4e}.mobile-nav{display:none}.mobile-more{display:none}.login-bg{min-height:100vh;background:#eef3f9;display:grid;place-items:center;padding:18px}.login-card{width:min(410px,100%);border:1px solid #e0e8f0;background:white;border-radius:21px;padding:35px;box-shadow:0 20px 55px #123d6720}.login-card .logo-mark{background:#174a78;color:#fff;margin-bottom:27px}.login-card h1{font-size:26px;letter-spacing:-.045em;color:#153d63}.login-card p{color:#8293a4;line-height:1.6;font-size:12px}.login-card form{display:grid;gap:15px;margin-top:22px}.login-card .btn{width:100%}.confirm-screen{min-height:100vh;display:grid;place-items:center;padding:20px}.confirm-card{background:white;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:36px;max-width:470px;text-align:center}.confirm-card h1{font-size:22px;color:#173e62}.confirm-card p{font-size:13px;line-height:1.7;color:#73879b}.confirm-check{background:#eaf8ef;color:#16836b;padding:15px;border-radius:12px;font-weight:bold}.muted{color:var(--muted)}.caption{font-size:10px;color:#8c9bad}.wrap{white-space:normal}.text-right{text-align:right}
@media(max-width:1230px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cols{grid-template-columns:minmax(0,1fr)}.driver-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:920px){.app-shell{grid-template-columns:76px minmax(0,1fr)}.sidebar{padding:18px 11px}.logo-row{padding:0 0 30px;justify-content:center}.logo-row>div:nth-child(2),.side-label,.nav-btn span,.sidebar-foot{display:none}.nav-btn{justify-content:center;padding:12px}.nav-btn .svg-icon{width:21px;height:21px}.topbar{padding:0 23px}}
@media(max-width:640px){.app-shell{display:block}.sidebar{display:none}.topbar{height:64px;padding:0 16px}.topbar-title{font-size:12px}.topbar-sub,.profile-txt{display:none}.topbar-right{gap:7px}.content{padding:23px 15px 108px}.page-intro{align-items:start;flex-direction:column;gap:14px;margin-bottom:19px}.page-intro h1{font-size:26px}.page-intro .actions{width:100%}.grid-4{gap:10px}.metric{padding:15px 14px;border-radius:13px}.metric h2{font-size:23px}.metric-symbol{width:30px;height:30px}.metric-top{font-size:10px}.metric p{font-size:9px}.panel-head{padding:17px 16px}.panel-body{padding:0 16px 17px}.cols,.split-section,.report-grid{gap:13px}.split-section,.driver-grid{grid-template-columns:1fr}.trip-row{gap:8px}.trip-time{width:48px}.trip-detail strong{font-size:11px}.trip-row>.btn{height:32px;padding:0 9px;font-size:9px}.quick-link{min-height:91px}.toolbar{gap:9px}.field{flex:1 1 100%}.toolbar>.btn{flex:1 1 100%}.table-scroll{overflow:auto}.desktop-table{display:none}.mobile-list{display:grid;gap:10px;padding:13px}.mobile-trip{border:1px solid #e6edf4;border-radius:12px;padding:14px;background:#fff}.mobile-trip-top{display:flex;justify-content:space-between;gap:10px}.mobile-trip strong{font-size:11px;color:#173d63}.mobile-trip p{font-size:10px;color:#8a98a7;line-height:1.6;margin:7px 0}.mobile-trip-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:11px}.driver-grid{gap:12px}.mobile-nav{position:fixed;z-index:50;bottom:0;left:0;right:0;background:#fff;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid #e5ebf2;padding:7px 5px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -7px 25px #1d416512}.mobile-nav button{display:grid;place-items:center;gap:4px;border:0;border-radius:10px;background:none;color:#8294a6;padding:6px 0;font-size:9px;font-weight:700}.mobile-nav button.active{background:#edf5ff;color:#2365a1}.mobile-nav .svg-icon{width:21px;height:21px}.mobile-more{display:block;position:fixed;z-index:55;bottom:calc(73px + env(safe-area-inset-bottom));right:12px;width:min(286px,calc(100vw - 24px));padding:8px;background:#fff;border-radius:14px;box-shadow:0 12px 50px #0b2f4c32;border:1px solid #dce7f2}.mobile-more button{width:100%;display:flex;gap:9px;align-items:center;text-align:left;background:transparent;border:0;padding:12px;border-radius:9px;color:#274968;font-weight:720;font-size:12px}.mobile-more button:hover{background:#f0f6fd}.toast-wrap{bottom:calc(86px + env(safe-area-inset-bottom))}.modal-form .two{grid-template-columns:1fr}.modal-header{padding:20px}.modal-form{padding:18px 20px 20px}.bar-row{grid-template-columns:96px 1fr 32px}.demo-banner{align-items:flex-start}.page-intro .actions .btn{flex:1 1 auto}}@media(min-width:641px){.mobile-list{display:none}}@media print{.sidebar,.mobile-nav,.topbar,.page-intro .actions,.toolbar,.btn,.demo-banner{display:none!important}.app-shell{display:block}.content{padding:0}.panel,.metric{box-shadow:none}.grid-4{grid-template-columns:repeat(4,1fr)}}

/* V5.2 · Alta de hoteles clara en teléfono y PC */
.source-status{min-height:19px;margin-top:6px;color:#6c7f94;font-size:11px;line-height:1.6;overflow-wrap:anywhere}
.source-status.source-ok{color:#137550}
.source-status.source-error{color:#ad3447}
.source-help{line-height:1.75}
#hotelSourceInput{font-size:13px}
@media(max-width:540px){.source-help{font-size:11px}.modal-form .field{min-width:0}}

/* V5.3: estado de conexión persistente, sin ocultar errores en avisos temporales */
.integration-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid #cfdeed;background:#eef5fc;padding:15px 17px;border-radius:14px;margin-bottom:17px;color:#153c62}
.integration-banner>div{min-width:0;flex:1}.integration-banner strong{display:block;font-size:13px;margin-bottom:5px}.integration-banner small{display:block;color:#506b84;font-size:11px;line-height:1.55}
.integration-feedback{padding:10px 12px;background:#fff;border:1px solid #dce8f3;border-radius:9px;line-height:1.5;font-size:12px;margin:9px 0 0;overflow-wrap:anywhere}
@media(max-width:640px){.integration-banner{flex-direction:column;align-items:stretch}.integration-banner .btn{width:100%}}

/* V5.4 · PC y celular comparten proporciones, no columnas innecesariamente anchas. */
.content{max-width:1400px;margin-inline:auto;width:100%}
.app-shell{transition:grid-template-columns .22s ease}
.sidebar{min-width:0}
.side-collapse{display:flex;align-items:center;gap:10px;min-height:36px;width:100%;padding:8px 12px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.13);border-radius:10px;color:#e1efff;font-size:11px;cursor:pointer;margin:0 0 18px;text-align:left}
.side-collapse .svg-icon{width:17px;height:17px;flex-shrink:0}
.sidebar-collapsed.app-shell{grid-template-columns:76px minmax(0,1fr)}
.sidebar-collapsed .sidebar{padding-inline:10px}
.sidebar-collapsed .logo-row{justify-content:center;padding:0 0 20px}
.sidebar-collapsed .logo-row>div:nth-child(2),.sidebar-collapsed .side-label,.sidebar-collapsed .nav-btn span,.sidebar-collapsed .sidebar-foot,.sidebar-collapsed .side-collapse span{display:none}
.sidebar-collapsed .nav-btn,.sidebar-collapsed .side-collapse{justify-content:center;padding:11px}
.sidebar-collapsed .nav-btn .svg-icon{width:21px;height:21px}
.freshness-indicator{color:#658199;font-size:10px;white-space:nowrap}
.top-profile.profile-open{cursor:pointer;border:0;background:transparent;color:inherit;display:flex;align-items:center;gap:9px;text-align:left;border-radius:11px;padding:5px 9px}
.top-profile.profile-open:hover{background:#eef4fa}
.account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.account-form{display:grid;gap:15px}
.account-form .btn{justify-self:start}
.account-grid .trip-row{overflow-wrap:anywhere}
.account-grid .trip-row strong{font-size:12px;text-align:right}
.team-list{display:grid;gap:8px}
.team-person{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid #e8eef5;padding:13px 0}
.team-person strong,.team-person small{display:block;overflow-wrap:anywhere}
.team-person strong{color:#173a60;font-size:12px}.team-person small{margin-top:4px;color:#7790a7;font-size:10px;line-height:1.5}
/* En PC, el centro de operaciones conserva legibilidad similar a las tarjetas móviles. */
@media(min-width:921px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cols{grid-template-columns:repeat(2,minmax(0,1fr))}.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{min-height:122px}.content{padding:26px clamp(20px,3vw,44px) 48px}.page-intro h1{font-size:clamp(24px,2.3vw,32px)}}
@media(max-width:1150px){.account-grid{grid-template-columns:1fr}.freshness-indicator{display:none}}
@media(min-width:641px) and (max-width:920px){.side-collapse{justify-content:center;padding:9px}.side-collapse span{display:none}}
@media(max-width:640px){.sidebar-collapsed.app-shell{display:block}.account-grid{grid-template-columns:1fr}.account-form .btn{width:100%}.team-person{align-items:flex-start}.content{max-width:100%}}

.integration-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}@media(max-width:640px){.integration-actions{width:100%}.integration-actions .btn{flex:1}}


/* ===========================================================
   MASTER V5.5 · Corrección del desbordamiento en iOS Safari
   - Evita que controles de fecha (intrínsecamente anchos en iOS)
     desborden los formularios o la pantalla.
   - En pantalla pequeña los filtros ocupan una columna estable.
   - Afecta solo la presentación; no modifica registros ni permisos.
   =========================================================== */
#app, .app-shell, .main, .content, .page-intro, .panel,
.panel-body, .toolbar, .field, .modal-form, .modal-form .two,
.account-grid, .split-section, .report-grid, .driver-grid {
  min-inline-size: 0;
  max-inline-size: 100%;
}
.field { min-width: 0; }
.input, input.input, select.input, textarea.input {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  box-sizing: border-box;
}
/* Un control nativo date puede pintar más ancho que la columna en Safari iOS.
   Se fuerza su caja a los límites y se contiene el texto interno. */
input.input[type="date"], input.input[type="time"], input.input[type="datetime-local"],
input.input[type="month"], input.input[type="week"] {
  width: 100%;
  min-width: 0 !important;
  max-width: 100% !important;
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  overflow: hidden;
  text-overflow: ellipsis;
}
input[type="date"]::-webkit-date-and-time-value,
input[type="time"]::-webkit-date-and-time-value {
  min-width: 0;
  max-width: 100%;
  text-align: left;
}
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit {
  min-width: 0;
  max-width: 100%;
}
/* Filtros en tablet: los elementos pueden encogerse sin forzar el viewport. */
.toolbar > .field, .toolbar > .btn { min-width: 0; max-width: 100%; }
.modal-form .two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 640px) {
  html, body, #app { width: 100%; max-width: 100%; }
  .main, .content { width: 100%; min-width: 0; max-width: 100%; }
  .content { padding-left: max(15px, env(safe-area-inset-left)); padding-right: max(15px, env(safe-area-inset-right)); }
  /* Antes era flex: 1 1 100%: Safari imponía tamaño intrínseco a date. */
  .toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    gap: 10px;
  }
  .toolbar > .field,
  .toolbar > .field.search-box {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    flex: none;
  }
  .toolbar > .btn {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    height: auto;
    padding: 11px 14px;
    white-space: normal;
  }
  .modal-form .two { grid-template-columns: minmax(0, 1fr); }
  .page-intro .actions, .panel-head, .topbar, .modal-actions { min-width: 0; max-width: 100%; }
  .page-intro .actions > .btn { min-width: 0; max-width: 100%; white-space: normal; }
  .mobile-nav {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    box-sizing: border-box;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .mobile-nav button { min-width: 0; max-width: 100%; overflow: hidden; }
  .mobile-more { max-width: calc(100vw - 24px); }
}
@media (max-width: 360px) {
  .content { padding-left: 12px; padding-right: 12px; }
  .topbar { padding-left: 12px; padding-right: 12px; }
  .topbar-left, .topbar-right { min-width: 0; }
  .topbar-title { font-size: 11px; }
  .topbar-right { gap: 5px; }
  .icon-btn { width: 36px; height: 36px; }
}


/* ===========================================================
   MASTER V5.6 · Flechas y controles alineados en celular y PC
   - Se separan visualmente las flechas del borde derecho.
   - Selects usan un indicador consistente y centrado.
   - Date / time / number conservan padding interno más limpio.
   =========================================================== */
.input,
input.input,
select.input,
textarea.input {
  padding-inline: 14px;
}

select.input {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 42px;
  background-color: #fff;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23667990' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 8l5 5 5-5'/></svg>");
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-position: right 14px center;
}

input.input[type="date"],
input.input[type="time"],
input.input[type="datetime-local"],
input.input[type="month"],
input.input[type="week"],
input.input[type="number"] {
  padding-right: 40px;
}

input.input[type="date"]::-webkit-calendar-picker-indicator,
input.input[type="time"]::-webkit-calendar-picker-indicator,
input.input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input.input[type="month"]::-webkit-calendar-picker-indicator,
input.input[type="week"]::-webkit-calendar-picker-indicator {
  opacity: .78;
  margin-right: 6px;
  padding-left: 8px;
  cursor: pointer;
}

input.input[type="number"]::-webkit-outer-spin-button,
input.input[type="number"]::-webkit-inner-spin-button {
  margin-right: 4px;
}

/* Hace que los campos se sientan centrados y alineados en bloques apretados */
.field .input {
  line-height: 1.2;
}

@media (max-width: 640px) {
  .input,
  input.input,
  select.input,
  textarea.input {
    padding-left: 14px;
    padding-right: 42px;
  }
  select.input {
    background-position: right 13px center;
  }
  input.input[type="date"]::-webkit-calendar-picker-indicator,
  input.input[type="time"]::-webkit-calendar-picker-indicator,
  input.input[type="datetime-local"]::-webkit-calendar-picker-indicator,
  input.input[type="month"]::-webkit-calendar-picker-indicator,
  input.input[type="week"]::-webkit-calendar-picker-indicator {
    margin-right: 4px;
  }
}

@media (min-width: 641px) {
  .toolbar .field .input,
  .modal-form .field .input,
  .account-form .field .input {
    padding-left: 14px;
  }
  select.input {
    background-position: right 15px center;
  }
}

/* Mi Tour Chile V5.7 · Controles y acciones con alineación consistente */
.hotel-row-actions{display:flex;align-items:center;justify-content:flex-start;gap:7px;flex-wrap:wrap;min-width:235px}
.hotel-row-actions .btn{min-height:35px;height:auto;padding:8px 12px;margin:0;line-height:1.1;flex:0 0 auto}
.hotel-web-link{color:#165789;border-color:#b9d2e9;background:#f1f7fe}
.avatar-person{display:grid;place-items:center;flex:0 0 36px;height:36px;width:36px}
.avatar-person .svg-icon{height:20px;width:20px}
.profile-hero{display:flex;align-items:center;gap:14px;padding:12px 0 18px;border-bottom:1px solid var(--line);margin-bottom:10px}
.profile-hero-icon{width:54px;height:54px;background:#eaf2fd;color:#215b95;display:grid;place-items:center;border-radius:16px;flex:0 0 auto}
.profile-hero-icon svg{width:27px;height:27px}
.profile-hero strong{display:block;color:var(--navy);font-size:17px}
.profile-hero span{display:block;color:var(--muted);margin-top:4px;font-size:11px;text-transform:capitalize}
.team-person>.avatar-person{flex:0 0 36px}
.account-grid .panel-body .trip-row{gap:12px;min-width:0}
.account-grid .panel-body .trip-row strong{min-width:0;max-width:65%;overflow-wrap:anywhere}
.input:not([type='color']){line-height:normal}
input.input[type='color']{padding:4px 7px;max-width:100%}
@media(max-width:640px){
  .hotel-row-actions{min-width:0;flex-wrap:wrap;gap:6px}
  .hotel-row-actions .btn{min-height:38px;padding:9px 10px}
  .profile-hero strong{font-size:15px}
  .account-grid .panel-body .trip-row{align-items:flex-start}
  .account-grid .panel-body .trip-row strong{max-width:62%;text-align:right;overflow-wrap:anywhere}
  .modal-form .field input,.modal-form .field select{min-width:0;width:100%;max-width:100%}
}