:root{
  --bg:#F7F5F0;--card:#fff;--ink:#2C2C2C;--mut:#666a7a;--line:#e4e2da;--pt:#1F2B55;--gold:#C9A84C;--cyan:#00B4D8;--ink0:#0A0F1E;
  --pri:#1F2B55;--pri-d:#141C3A;--acc:#00B4D8;--ok:#2e9e5b;--bad:#d64545;--info:#3b6fd4;
  --r:12px;--sh:0 2px 10px rgba(20,40,60,.07);
}
@media (prefers-color-scheme:dark){:root{--bg:#0A0F1E;--card:#141C3A;--ink:#eef1f8;--mut:#9aa6c4;--pt:#7fd8ec;--line:#27325f;--sh:0 2px 10px rgba(0,0,0,.4)}}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 Raleway,system-ui,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink)}
button,input,select,textarea{font:inherit;color:inherit}
.app{--sw:230px;display:grid;grid-template-columns:var(--sw) 1fr;min-height:100vh;transition:grid-template-columns .22s ease}
.side{background:#141C3A;color:#e6e9f4;padding:18px 12px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px}
.logo{font-weight:700;font-size:18px;padding:6px 10px 16px;color:#fff}
.logo span{color:var(--acc)}
.side a{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:9px;color:inherit;text-decoration:none;cursor:pointer}
.side a:hover{background:rgba(255,255,255,.08)}
.side a.on{background:var(--pri);color:#fff}
.side .foot{margin-top:auto;font-size:12px;opacity:.7;padding:8px 10px}
main{padding:24px 28px;max-width:1300px;width:100%}
h1{margin:0 0 4px;font-size:24px}
.sub{color:var(--mut);margin:0 0 20px}
.bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.bar .sp{flex:1}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:16px}
.grid{display:grid;gap:14px}
.g4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.g3{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.stat b{display:block;font-size:26px}
.stat span{color:var(--mut);font-size:13px}
.btn{border:1px solid var(--line);background:var(--card);padding:8px 14px;border-radius:9px;cursor:pointer}
.btn:hover{border-color:var(--pt)}
.btn.pri{background:var(--pri);border-color:var(--pt);color:#fff}
.btn.pri:hover{background:var(--pri-d)}
.btn.acc{background:var(--acc);border-color:var(--acc);color:#fff}
.btn.sm{padding:4px 9px;font-size:13px}
.btn.del{color:var(--bad)}
input,select,textarea{border:1px solid var(--line);background:var(--card);border-radius:8px;padding:8px 10px;width:100%}
label{display:block;font-size:12px;color:var(--mut);margin-bottom:3px}
.f{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tab{padding:6px 13px;border-radius:99px;border:1px solid var(--line);background:var(--card);cursor:pointer;font-size:14px}
.tab.on{background:var(--pri);color:#fff;border-color:var(--pt)}
.tag{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;background:var(--line);color:var(--ink)}
.tag.borrador{background:#e8ecf0;color:#456}.tag.enviado{background:#dce8ff;color:#264a9e}.tag.confirmado{background:#d8f3e3;color:#1c6e3f}
.svc{display:flex;flex-direction:column;gap:6px}
.svc .ic{font-size:26px}
.svc .pr{font-weight:700;color:var(--pt)}
.svc small{color:var(--mut)}
.builder{display:grid;grid-template-columns:1fr 330px;gap:16px;align-items:start}
.sum{position:sticky;top:16px}
.day{border:1px solid var(--line);border-radius:var(--r);background:var(--card);margin-bottom:12px;overflow:hidden}
.day>header{display:flex;align-items:center;gap:8px;padding:10px 14px;background:linear-gradient(90deg,var(--pri),#34478f);color:#fff}
.day>header input{background:rgba(255,255,255,.18);border:0;color:#fff;font-weight:600;flex:1}
.day>header input::placeholder{color:#e0f3f5}
.day .body{padding:8px 14px}
.item{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line)}
.item:last-child{border:0}
.item .nm{flex:1}
.item .nm small{display:block;color:var(--mut)}
.item input{width:60px;padding:4px 6px}
.row{display:flex;justify-content:space-between;padding:4px 0}
.row.tot{border-top:2px solid var(--line);margin-top:6px;padding-top:8px;font-size:18px;font-weight:700;color:var(--pt)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);font-size:14px}
th{color:var(--mut);font-weight:600;font-size:12px;text-transform:uppercase}
.modal{position:fixed;inset:0;background:rgba(10,20,30,.55);display:none;align-items:center;justify-content:center;padding:16px;z-index:50}
.modal.open{display:flex}
.modal .box{background:var(--card);border-radius:var(--r);padding:20px;width:min(640px,100%);max-height:90vh;overflow:auto}
.pick{display:grid;gap:8px;margin-top:10px}
.pick .opt{display:flex;gap:10px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:9px;cursor:pointer}
.pick .opt:hover{border-color:var(--pt);background:rgba(31,43,85,.07)}
.toast{position:fixed;bottom:20px;right:20px;background:#222;color:#fff;padding:11px 18px;border-radius:9px;opacity:0;transition:.3s;pointer-events:none;z-index:99}
.toast.show{opacity:1}
.empty{text-align:center;color:var(--mut);padding:30px}
/* propuesta */
.prop{background:#fff;color:#1c2733;max-width:860px;margin:0 auto;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh)}
.prop .hero{padding:40px 32px;color:#fff;background:linear-gradient(135deg,#1F2B55,#00B4D8)}
.prop .hero h2{margin:0 0 6px;font-size:30px}
.prop .sec{padding:20px 32px}
.prop .dd{border-left:3px solid #1F2B55;padding:2px 0 2px 14px;margin-bottom:16px}
.prop .dd h4{margin:0 0 4px;color:#1F2B55}
.prop .price{background:#F7F5F0;border-radius:12px;padding:18px;text-align:center}
.prop .price b{font-size:34px;color:#1F2B55;display:block}
.prop ul{margin:6px 0;padding-left:20px}
@media (max-width:900px){
  .app{grid-template-columns:1fr}
  .side{position:static;height:auto;flex-direction:row;flex-wrap:wrap}
  .side .foot,.logo{display:none}
  .builder{grid-template-columns:1fr}.sum{position:static}
  main{padding:16px}
}
@media print{
  .side,.bar,.toast{display:none!important}
  .app{display:block}main{padding:0;max-width:none}
  .prop{box-shadow:none}
}

/* iconos propios */
.i{width:1.2em;height:1.2em;vertical-align:-.22em;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.side a i,.logo i{display:inline-flex}
.side a .i{width:20px;height:20px}
.logo .i{color:var(--acc)}
.btn .i{margin-right:2px}
.btn.sm .i{vertical-align:-.2em}
.tab .i{vertical-align:-.25em}
.tile{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;background:rgba(31,43,85,.12);color:var(--pt);flex:none}
.tile .i{width:22px;height:22px}
.svc .ic{display:none}
.stat .i{color:var(--pt);float:right;opacity:.85}
.day>header .btn{background:rgba(255,255,255,.18);border:0;color:#fff;padding:5px 8px}
.pick .opt .tile{width:36px;height:36px}
.svc>.tile{width:46px;height:46px}
.svc>.tile .i{width:26px;height:26px}
.prop .dd li .i{color:#1F2B55}
.hero .i{vertical-align:-.25em}

/* ruta / paradas / ubicación */
.stop{display:grid;grid-template-columns:30px 1fr 84px auto;gap:10px;align-items:end;padding:10px 0;border-bottom:1px dashed var(--line)}
.stop:last-of-type{border-bottom:0}
.stop .num{width:26px;height:26px;border-radius:50%;background:var(--pri);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;margin-bottom:4px}
.stop .mv{display:flex;gap:4px;margin-bottom:2px}
.loc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.route-info{margin-top:8px;padding:8px 12px;border-radius:9px;background:rgba(31,43,85,.1);color:var(--pri-d)}
@media (prefers-color-scheme:dark){.route-info{color:#7fd8ec}}
.tag.kind{background:#e8ecf0;color:#456}
.tag.kind.nac{background:#d8f3e3;color:#1c6e3f}
.tag.kind.int{background:#dce8ff;color:#264a9e}
.tag.kind.multi{background:#fde8cf;color:#8a4b08}
.ctag{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.22);padding:2px 9px;border-radius:99px;font-size:13px;white-space:nowrap}
.locbox{margin-top:14px;padding:12px;border:1px solid var(--line);border-radius:10px}
.locbox h4{margin:10px 0 6px;font-size:13px;color:var(--mut)}
.locbox .loc{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
label.chk{display:flex;gap:8px;align-items:center;font-size:14px;color:var(--ink);cursor:pointer;margin:0}
input[type=checkbox]{width:auto}
.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chip{background:#F7F5F0;border:1px solid #d5dbee;border-radius:10px;padding:6px 12px}
.chip b{display:block;color:#1F2B55}.chip small{color:#6b7a8a}
.chips .arrow{color:#1F2B55;font-weight:700}
@media (max-width:900px){.stop{grid-template-columns:30px 1fr}.stop .mv,.stop>div:nth-child(3){grid-column:2}.loc{grid-template-columns:1fr}}

/* constructor con pestañas, bloques por hora, hoteles, cargos, cotizador */
.builder section[hidden]{display:none}
.bt{margin-bottom:14px}
.h3{margin:0 0 10px;font-size:16px}
.hint{display:block;color:var(--mut);font-size:12.5px;margin-top:6px}
.sect{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);font-weight:700;margin:4px 0 6px}
.sect small{text-transform:none;letter-spacing:0;font-weight:400}
.blk{display:flex;gap:8px;margin-bottom:6px}.blk input.t{width:84px;flex:none}.blk input{flex:1}
.lo{border:1px solid var(--line);border-radius:10px;padding:10px;margin-top:10px}
.lohead{display:flex;gap:8px;margin-bottom:8px}
.lorow{display:grid;grid-template-columns:150px 1fr auto;gap:8px;align-items:center;margin-top:6px;font-size:14px}
.chg{display:grid;grid-template-columns:1.4fr 1.1fr 90px auto auto auto;gap:8px;align-items:center;margin-top:8px}
.chg input,.chg select{min-width:0}
tr.cur td{background:rgba(31,43,85,.1)}
.btn.sm.acc{padding:4px 9px}
@media (max-width:900px){.lorow{grid-template-columns:1fr}.chg{grid-template-columns:1fr 1fr}}
@media print{.w-site .w-side{display:none}.w-panel[hidden]{display:block!important}}
.lnk{color:var(--pt);cursor:pointer;text-decoration:underline}
table.calc{margin-top:12px;max-width:520px;margin-left:auto}
table.calc td:last-child{text-align:right;white-space:nowrap}
table.calc tr.b td{font-weight:700;border-top:2px solid var(--line)}
table.calc tr.t td{font-weight:700;font-size:17px;color:var(--pt);border-top:2px solid var(--pri)}

/* ===== Identidad Peru Leisure Travel ===== */
body,button,input,select,textarea{font-family:Raleway,system-ui,Segoe UI,Roboto,sans-serif}
h1,h2,h3,h4{color:var(--pt);letter-spacing:-.01em}
h1{font-weight:800;font-size:28px}
h2,h3{font-weight:700}
main>h1::before{content:'Peru Leisure Travel';display:block;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--cyan);font-weight:700;margin-bottom:4px}
.card{border-radius:16px;box-shadow:0 6px 24px rgba(10,15,30,.09);border-color:transparent}
.btn{border-radius:10px;font-weight:600}
.btn.pri{background:var(--pri);border-color:var(--pri)}
.btn.acc{background:var(--cyan);border-color:var(--cyan);color:var(--ink0);font-weight:700}
.btn.acc:hover{background:#1cc5e6;border-color:#1cc5e6}
.btn:hover{border-color:var(--cyan)}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(0,180,216,.45);outline-offset:0;border-color:var(--cyan)}
.side{background:linear-gradient(180deg,#141C3A 0%,#0A0F1E 100%);color:#e6e9f4}
.logo{padding:6px 8px 18px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.1)}
.logo img{display:block;width:100%;max-width:176px;height:auto}
.side a{border-radius:10px;font-weight:600}
.side a.on{background:rgba(0,180,216,.16);box-shadow:inset 3px 0 0 var(--cyan);color:#fff}
.side a.on .i{color:var(--cyan)}
.side .foot{opacity:.65}
.tab.on{background:var(--pri);border-color:var(--pri)}
.day>header{background:linear-gradient(90deg,#1F2B55,#34478f)}
.sect{color:var(--cyan)}
.tile{background:rgba(31,43,85,.09);color:var(--pt)}
.row.tot,table.calc tr.t td{color:var(--pt)}
.prop{border-radius:16px}
.prop .hero{background:linear-gradient(135deg,#141C3A 0%,#1F2B55 62%,#2d3d7a 100%);position:relative}
.prop .hero small{color:var(--cyan);letter-spacing:3px;font-weight:700}
.prop .hero img.plogo{height:46px;width:auto;display:block;margin-bottom:18px}
.prop .hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--cyan),var(--gold))}
.prop h3{color:#1F2B55}
.prop .price{background:#F7F5F0;border:1px solid #e4e2da}
.prop .brandfoot{padding:16px 32px;text-align:center;font-size:12px;color:#666a7a;border-top:1px solid #e4e2da}
.prop .brandfoot b{color:#1F2B55}
.route-info{background:rgba(31,43,85,.08);color:var(--pt)}
.chip b{color:#1F2B55}
@media print{.side{display:none}.prop .hero{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
body,.w-site{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.prop .hero h2{color:#fff;font-weight:800;font-size:32px}

.g2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.hb{display:flex;gap:10px;align-items:center;padding:5px 0;font-size:14px}
.hb>span{flex:1.2}.hb .hbt{flex:2;height:10px;background:var(--line);border-radius:99px;overflow:hidden}.hb .hbt i{display:block;height:100%;border-radius:99px}
.hb b{min-width:22px;text-align:right}.hb small{min-width:96px;text-align:right;color:var(--mut)}
.code{display:inline-block;background:rgba(0,180,216,.14);color:var(--pt);border-radius:6px;padding:1px 7px;font-weight:700;font-size:11.5px;letter-spacing:.04em}
.tag.st-borrador{background:#e8ebf3;color:#4a5578}.tag.st-enviada{background:#d9f3fa;color:#066a82}.tag.st-aceptada{background:#d8f3e3;color:#1c6e3f}.tag.st-rechazada{background:#fbdcdc;color:#9a2a2a}.tag.st-vencida{background:#f6ecd0;color:#7a5f10}

/* imágenes de la ficha web */
.drop{border:2px dashed var(--line);border-radius:14px;padding:18px;text-align:center;color:var(--mut);margin-top:6px}
.drop.over{border-color:var(--cyan);background:rgba(0,180,216,.08)}
.drop .btn{margin:0 4px}
.imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-top:14px}
.im{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card);display:flex;flex-direction:column;gap:6px;padding-bottom:8px}
.im .ph{height:115px;background:#cfd6ea center/cover;position:relative}
.im .cv{position:absolute;left:8px;top:8px;background:var(--cyan);color:var(--ink0);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 9px;border-radius:99px}
.im input{margin:0 8px;width:calc(100% - 16px);font-size:12.5px;padding:6px 8px}
.im .ims{display:flex;gap:4px;padding:0 8px}.im .ims .btn{flex:1;padding:4px 0}
.im .ims .btn[disabled]{opacity:.35;cursor:default}

.modal .box.wide{width:min(1000px,100%)}

/* catálogo agrupado por tipo */
.csec{margin-top:6px}
.chead{display:flex;align-items:center;gap:10px;cursor:pointer;margin:20px 0 10px;padding:4px 2px 8px;border-bottom:2px solid var(--line);user-select:none}
.chead:hover{border-color:var(--cyan)}
.chead h2{margin:0;font-size:19px}
.chead .tile{width:34px;height:34px}.chead .tile .i{width:19px;height:19px}
.ccount{background:var(--cyan);color:var(--ink0);border-radius:99px;padding:1px 10px;font-size:12px;font-weight:800}
.cg{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.cg .svc{padding:12px 14px;gap:4px}.cg .svc>.tile{width:34px;height:34px}.cg .svc>.tile .i{width:19px;height:19px}
.cg .svc b{font-size:14.5px;line-height:1.3}.cg .svc small{font-size:12px}
.cmore{margin:10px 0 0}
.stat.pub strong{color:var(--pt);font-size:15px;font-weight:800}
.stat.pub b{color:var(--pt)}
.stat .pbar{height:8px;background:var(--line);border-radius:99px;overflow:hidden;margin:8px 0 4px}
.stat .pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),#2d8fd9);border-radius:99px}
.stat.pub small{color:var(--mut);font-size:12.5px}
.stat.pub:hover{box-shadow:0 8px 28px rgba(10,15,30,.16)}
.stat .pbar.ok i{background:linear-gradient(90deg,#2e9e5b,#5bc489)}
.stat.pub b{font-size:34px;line-height:1.1}
.stat.pub b em{font-style:normal;font-size:24px;font-weight:700;color:var(--mut);margin-left:6px}
.stat.pub small b{font-size:inherit;color:var(--pt)}

/* tarjeta de dinero del panel */
.stat.money{grid-column:span 2}
.stat.money .mh{display:flex;gap:10px;align-items:flex-start;margin-bottom:4px}.stat.money .mh .i{color:var(--pt);margin-top:2px}
.stat.money .mh strong{display:block;font-size:15px;color:var(--pt);font-weight:800}.stat.money .mh small{display:block;color:var(--mut);font-size:12px;line-height:1.35}
.stat.money b.mt{font-size:34px;line-height:1.15;color:var(--pt);display:block}
.stat.money .stack{display:flex;height:12px;border-radius:99px;overflow:hidden;background:var(--line);margin:10px 0 10px}
.stat.money .stack i{display:block;height:100%}.stat.money .stack .a,.stat.money .dot.a{background:#2e9e5b}.stat.money .stack .p,.stat.money .dot.p{background:var(--cyan)}
.stat.money .legend{display:grid;gap:5px}.stat.money .legend div{display:flex;align-items:center;gap:8px;font-size:14px}
.stat.money .legend span:nth-child(2){flex:1}.stat.money .legend strong{font-size:15px;font-weight:800}.stat.money .legend em{font-style:normal;color:var(--mut);min-width:38px;text-align:right}
.stat.money .dot{width:10px;height:10px;border-radius:50%;flex:none}
.stat.money small.gain{display:block;margin-top:10px;padding-top:8px;border-top:1px solid var(--line);color:var(--mut);font-size:12.5px}.stat.money small.gain strong{color:var(--pt)}
.stat.money:hover{box-shadow:0 8px 28px rgba(10,15,30,.16)}
@media (max-width:700px){.stat.money{grid-column:auto}}

/* panel: 2 x 2 */
.dgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.stat.money{grid-column:auto}
@media (max-width:760px){.dgrid{grid-template-columns:1fr}}
/* iconos de las tarjetas de dinero: al final (derecha), igual que en las de arriba */
.stat.money .mh{flex-direction:row-reverse;justify-content:space-between;align-items:flex-start}
.stat.money .mh>span{flex:1;min-width:0}
.stat.money .mh .i{margin-top:0;flex:none;width:22px;height:22px;color:var(--pt)}

/* ===================== Laptop y pantallas medianas ===================== */
td.acts{white-space:nowrap}
.ell{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ubicación (país / región / ciudad) y cargos: se acomodan en varias filas en vez de aplastarse */
.loc{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.chg{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chg input:not([type=checkbox]):not([type=number]){flex:1 1 170px;min-width:120px}
.chg select{flex:0 1 190px;min-width:130px}
.chg input[type=number]{flex:0 0 96px}
.lorow{grid-template-columns:minmax(110px,170px) minmax(0,1fr) auto}
#qcmp,#qbrk{overflow-x:auto}
#qbrk table:first-of-type{min-width:560px}
.stop{grid-template-columns:30px minmax(0,1fr) 84px auto}

/* iconos solos en los botones de las tablas */
@media (max-width:1500px){
  td.acts .bl{display:none}
  td.acts .btn.sm{padding:6px 9px}
  .sol{display:none}
}
@media (max-width:1400px){ .c-seg{display:none} }
@media (max-width:1280px){ .c-ph{display:none} .c-date{display:none} }
@media (max-width:1150px){ .c-pk{display:none} }

/* barra lateral y márgenes más compactos */
@media (min-width:1101px) and (max-width:1400px){
  .app{--sw:204px}
  .side{padding:16px 10px}
  main{padding:22px 22px}
  .builder{grid-template-columns:minmax(0,1fr) 310px}
}
@media (min-width:901px) and (max-width:1100px){
  main{padding:20px 18px}
  .builder{grid-template-columns:minmax(0,1fr) 290px}
  .dgrid{grid-template-columns:1fr}
}
@media (max-width:1100px){ .stat.pub b,.stat.money b.mt{font-size:30px} .w-cols{grid-template-columns:1fr 250px} }

/* ===== Barra lateral: se encoge a iconos (sola a los 15 s o con el botón) ===== */
.side{z-index:100}
.side a{position:relative}
.side-ctl{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1)}
.side .foot{margin-top:4px}
.side-toggle{position:relative;display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;border-radius:10px;background:rgba(255,255,255,.07);color:inherit;cursor:pointer;font-weight:600;font-size:13px}
.side-toggle:hover{background:rgba(255,255,255,.15)}
.side-toggle .ico{display:inline-flex}.side-toggle .i{width:19px;height:19px}
.side-auto{display:flex;gap:8px;align-items:center;margin:0;font-size:12px;color:inherit;opacity:.8;cursor:pointer;padding:0 4px}
.side-auto input{width:auto;accent-color:#00B4D8}
@media (min-width:901px){
  .app.mini{--sw:72px}
  .app.mini .side{padding:14px 8px;align-items:center}
  .app.mini .side a{justify-content:center;padding:11px 0;width:100%}
  .app.mini .side a span,.app.mini .side .foot,.app.mini .side-auto,.app.mini .side-toggle .txt{display:none}
  .app.mini .logo{width:52px;height:42px;overflow:hidden;padding:0;margin:0 0 12px;border-bottom:0}
  .app.mini .logo img{width:136px;max-width:none}
  .app.mini .side-toggle{justify-content:center;padding:10px 0}
  .app.mini .side-ctl{width:100%;align-items:stretch}
  /* rótulo al pasar el cursor por cada icono */
  .app.mini .side a:hover::after,.app.mini .side-toggle:hover::after{content:attr(data-tip);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);background:#0A0F1E;color:#fff;padding:7px 12px;border-radius:9px;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:0 8px 22px rgba(0,0,0,.4);z-index:300;pointer-events:none}
  .app.mini .side a:hover::before,.app.mini .side-toggle:hover::before{content:'';position:absolute;left:calc(100% + 6px);top:50%;transform:translateY(-50%);border:6px solid transparent;border-right-color:#0A0F1E;z-index:300;pointer-events:none}
}
@media (max-width:900px){.side-ctl{display:none}}
.app:not(.mini) .side{overflow:hidden}
.side a span,.side-toggle .txt,.side-auto span{white-space:nowrap}

/* ======================================================================
   TELÉFONO Y TABLET VERTICAL: diseño propio (no se achica el de escritorio)
   ====================================================================== */
.topbar,.scrim{display:none}
@media (max-width:900px){
  html{-webkit-text-size-adjust:100%}
  body{font-size:16px}
  .app{display:block}
  /* barra superior + cajón de navegación */
  .topbar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:120;height:58px;padding:0 14px;background:linear-gradient(90deg,#141C3A,#0A0F1E);color:#fff}
  .topbar button{width:44px;height:44px;border:0;border-radius:12px;background:rgba(255,255,255,.1);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
  .topbar button .i{width:24px;height:24px}
  .topbar img{height:34px;width:auto}
  #topTitle{margin-left:auto;font-weight:700;font-size:15px;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}
  .side{position:fixed;left:0;top:0;bottom:0;height:100vh;height:100dvh;width:290px;max-width:86vw;z-index:210;transform:translateX(-105%);transition:transform .25s ease;overflow-y:auto;flex-direction:column;flex-wrap:nowrap;padding:18px 14px;align-items:stretch;gap:4px}
  .side.open{transform:none;box-shadow:14px 0 44px rgba(0,0,0,.45)}
  .side .logo{display:block;width:auto;height:auto;overflow:visible;padding:6px 8px 18px;margin:0 0 6px;border-bottom:1px solid rgba(255,255,255,.1)}
  .side .logo img{width:100%;max-width:176px}
  .side a{padding:14px 12px;font-size:16px;width:auto;justify-content:flex-start}
  .side a span{display:inline}
  .side .foot{display:block}
  .scrim{display:block;position:fixed;inset:0;z-index:200;background:rgba(10,15,30,.55);opacity:0;pointer-events:none;transition:opacity .2s}
  .scrim.show{opacity:1;pointer-events:auto}
  main{padding:16px 14px 48px;max-width:100%}
  h1{font-size:26px}h2{font-size:20px}
  /* controles cómodos para el dedo (16 px evita el zoom automático de iPhone) */
  .btn{min-height:44px;padding:10px 16px;font-size:15px}.btn.sm{min-height:40px;padding:8px 12px;font-size:14px}
  input,select,textarea{font-size:16px;padding:11px 12px}
  label{font-size:13px}
  .bar{gap:10px}
  .bar>input,.bar>select,.bar>label,.bar>.tabs{flex:1 1 100%;width:100%!important;min-width:0}
  .bar>.sp{display:none}
  .bar>.btn{flex:1 1 auto}
  .tabs{gap:8px}
  #btabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .tab{white-space:nowrap;padding:9px 15px;font-size:15px}
  .toast{left:14px;right:14px;bottom:14px;text-align:center}
  .card{padding:16px;border-radius:16px}
  /* constructor y cotizador: una sola columna, resumen debajo */
  .builder{grid-template-columns:1fr}
  .sum{position:static}
  .stop{grid-template-columns:1fr;gap:8px}
  .stop .num{margin:0}
  .stop .mv{justify-content:flex-end}
  .day>header{flex-wrap:wrap}
  .day>header input{flex:1 1 100%;order:5}
  .item{flex-wrap:wrap}.item .nm{flex:1 1 100%}
  .lo .lohead{flex-wrap:wrap}.lorow{grid-template-columns:1fr}
  .blk{flex-wrap:wrap}.blk input.t{width:100px;flex:none}.blk input{flex:1 1 160px}
  .imgs{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  /* ventanas emergentes: hoja desde abajo */
  .modal{padding:0;align-items:flex-end}
  .modal .box,.modal .box.wide{width:100%!important;max-width:none;max-height:94vh;max-height:94dvh;border-radius:20px 20px 0 0;padding:18px 16px 22px}
  .pick .opt{padding:12px}
  /* propuesta, ficha y listado del sitio */
  .prop{overflow-x:auto}
  .prop .hero{padding:26px 18px}.prop .sec{padding:16px 18px}
  .prop .sec[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .w-head{padding:20px 18px 24px}.w-head h1{font-size:26px}
  .w-cols{grid-template-columns:1fr;padding:16px 18px}
  .w-tabs{overflow-x:auto;flex-wrap:nowrap}.w-tabs span{white-space:nowrap}
  .w-filters{padding:14px 18px 0}.w-filters input,.w-filters select{flex:1 1 100%;width:100%}
  .w-grid{grid-template-columns:1fr;padding:16px 18px 24px}
  .w-card{padding:16px}
  .g2,.dgrid{grid-template-columns:1fr}
  .stat.pub b,.stat.money b.mt{font-size:30px}
  .cg{grid-template-columns:1fr}
  .csec .chead h2{font-size:18px}
}
@media (max-width:600px){
  .f{grid-template-columns:1fr}
  .loc{grid-template-columns:1fr}
  .info{grid-template-columns:1fr 1fr}
}
/* tablas -> tarjetas apiladas (una por paquete, cotización, cliente...) */
@media (max-width:800px){
  .card.tbl{background:none;border:0;box-shadow:none;padding:0;overflow:visible!important}
  table.rt,table.rt tbody{display:block;width:100%}
  table.rt tr.th-row{display:none}
  table.rt tr{display:flex;flex-direction:column;gap:2px;background:var(--card);border-radius:16px;box-shadow:0 6px 24px rgba(10,15,30,.09);padding:14px 16px;margin:0 0 12px}
  .card table.rt tr{box-shadow:none;border:1px solid var(--line);margin:0 0 10px}
  table.rt td{display:flex;justify-content:space-between;align-items:center;gap:14px;border:0;padding:6px 0;text-align:right;font-size:15px;max-width:none}
  table.rt td::before{content:attr(data-label);color:var(--mut);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;text-align:left;flex:none}
  table.rt td[data-label=""]::before{display:none}
  table.rt td.mt{display:block;text-align:left;font-size:17px;line-height:1.35;padding:2px 0 8px}
  table.rt td.ms{display:block;text-align:left;font-size:12px;color:var(--mut);letter-spacing:.06em;padding:0}
  table.rt td.acts{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;border-top:1px solid var(--line);margin-top:8px;padding-top:12px}
  table.rt td.acts .bl{display:inline}
  table.rt td.c-seg,table.rt td.c-pk,table.rt td.c-date,table.rt td.c-ph{display:flex}
  table.rt .sol{display:inline}
  table.rt td.ell{white-space:normal;word-break:break-all}
  table.rt td select{width:auto;max-width:62%}
  table.rt tr.cur{outline:2px solid var(--cyan)}
  table.rt td small{font-size:12.5px}
  #qbrk table.rt{min-width:0!important}
}

@media (max-width:800px){table.rt td.c-seg .sg{display:none}}
@media (max-width:900px){
  .builder{grid-template-columns:minmax(0,1fr)}
  .builder>*,.card,.day,.stop,.f>div,.loc>div{min-width:0}
  .w-btn{min-height:42px}
  .im input{min-height:40px}
  .w-seg{font-size:11.5px}
}
@media (max-width:800px){table.rt td .v{display:block;text-align:right}table.rt td.mt{font-weight:700}table.rt td.mt small,table.rt td.mt .tag{font-weight:600}}
@media (max-width:900px){
  .stop{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:14px 0}
  .stop .num{align-self:flex-start}
  .stop .loc{grid-template-columns:1fr}
  .stop .mv{align-self:flex-end}
}