/* Adventure Travel — estilo premium global basado en el dashboard */
:root{
  --navy:#082a50;
  --navy2:#0c3f76;
  --blue:#1769aa;
  --blue2:#2e82c8;
  --green:#0b9868;
  --green2:#19b57c;
  --red:#c92d3f;
  --amber:#d58a00;
  --ink:#0b2b50;
  --muted:#687b92;
  --line:#dce6f0;
  --soft:#f4f8fc;
  --card:#ffffff;
}

html{background:#eef4f9}
body{background:linear-gradient(180deg,#f7fbff 0,#eef4f9 100%);color:var(--ink);font-family:Inter,Segoe UI,Arial,sans-serif}

/* Header igual al dashboard moderno */
.app-header{
  position:sticky!important;top:0!important;z-index:50!important;
  padding:0!important;gap:0!important;background:#fff!important;
  color:var(--ink)!important;box-shadow:0 3px 16px rgba(8,42,80,.10)!important;
  border-bottom:1px solid #dbe6f1!important;
}
.header-top{
  padding:12px 30px!important;background:#fff!important;min-height:86px!important;
  max-width:1600px!important;margin:0 auto!important;
}
.brand-with-logo{color:var(--ink)!important;font-size:28px!important;letter-spacing:-.4px!important}
.brand-with-logo small{color:#5f738b!important;opacity:1!important;font-size:13px!important;margin-top:5px!important}
.header-logo-frame{
  width:66px;height:66px;display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid #dfe8f1;border-radius:14px;
  box-shadow:0 4px 14px rgba(8,42,80,.09);overflow:hidden;padding:4px;
}
img.header-logo{width:58px!important;height:58px!important;max-width:58px!important;max-height:58px!important}
.app-header .search{max-width:620px!important;box-shadow:0 3px 12px rgba(8,42,80,.06);border-radius:12px;overflow:hidden;border:1px solid #d6e2ee}
.app-header .search input{border:0!important;background:#fff!important;color:var(--ink);font-size:14px!important;outline:none}
.app-header .search button{background:linear-gradient(135deg,#0c4e8d,#1769aa)!important;border-radius:0!important;box-shadow:none!important}
.main-nav{
  margin:0!important;padding:8px 26px!important;width:100%!important;
  background:linear-gradient(90deg,#062d54,#0a467c)!important;
  border:0!important;gap:5px 10px!important;justify-content:center!important;
}
.main-nav a,.main-nav .linkbtn{
  color:#fff!important;text-decoration:none!important;border-radius:10px!important;
  padding:10px 14px!important;font-size:14px!important;font-weight:700!important;
  transition:.18s ease!important;
}
.main-nav a:hover,.main-nav .linkbtn:hover{background:rgba(255,255,255,.13)!important;color:#fff!important;text-decoration:none!important;transform:translateY(-1px)}
.menu-toggle{background:var(--navy)!important;color:#fff!important;border:0!important;border-radius:10px!important;padding:10px 14px!important;font-weight:800!important}

/* Contenedor general */
main{max-width:1450px!important;margin:28px auto!important;padding:0 28px 42px!important}
.pagehead{margin-bottom:18px!important;padding:4px 2px!important}
.pagehead h1{font-size:34px!important;letter-spacing:-.8px!important;margin:0 0 5px!important;color:var(--ink)!important}
.pagehead p{font-size:15px!important;color:var(--muted)!important;margin:0!important}

/* Tarjetas y paneles */
.panel,.cards>div,.document,.login-card,.mobile-record,.welcome-card{
  background:rgba(255,255,255,.98)!important;border:1px solid var(--line)!important;
  border-radius:18px!important;box-shadow:0 7px 24px rgba(8,42,80,.07)!important;
}
.panel{padding:20px!important;margin-top:16px!important}
.panel h2{color:var(--ink)!important;font-size:23px!important;letter-spacing:-.3px!important}
.cards{gap:15px!important}
.cards>div{padding:20px!important;position:relative!important;overflow:hidden!important}
.cards>div:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#1769aa,#43a6dc)}
.cards span{color:var(--muted)!important;font-weight:600!important;font-size:13px!important}
.cards b{color:var(--ink)!important;font-size:27px!important;margin-top:4px!important;display:block}

/* Tablas premium */
table{border-collapse:separate!important;border-spacing:0!important;width:100%!important}
thead th,table tr:first-child th{
  background:linear-gradient(180deg,#f7faff,#edf4fa)!important;
  color:#294765!important;font-size:12px!important;text-transform:uppercase!important;
  letter-spacing:.45px!important;font-weight:800!important;border-bottom:1px solid #dce6f0!important;
}
th,td{padding:14px 13px!important;border-bottom:1px solid #e7edf4!important;vertical-align:middle!important}
tbody tr{transition:.15s ease}
tbody tr:hover{background:#f6faff!important}
tbody tr:last-child td{border-bottom:0!important}
td a{font-weight:700!important;color:#075faf!important;text-decoration:none!important}
td a:hover{text-decoration:underline!important}

/* Botones */
.btn,.search button,.filter button{
  border-radius:10px!important;font-weight:800!important;box-shadow:0 3px 9px rgba(8,42,80,.08)!important;
  transition:.16s ease!important;
}
.btn:hover,.search button:hover,.filter button:hover{transform:translateY(-1px);filter:brightness(1.03)}
.btn.primary{background:linear-gradient(135deg,#09845d,#13a574)!important;color:#fff!important}
.btn.secondary{background:linear-gradient(135deg,#60758e,#7489a1)!important;color:#fff!important}
.btn.danger{background:linear-gradient(135deg,#b9202f,#d63a49)!important;color:#fff!important}
.btn.mini{padding:8px 12px!important}

/* Formularios */
.formgrid{gap:18px!important}
.formgrid label{font-size:13px!important;color:#173b61!important;font-weight:800!important}
.formgrid input,.formgrid select,.formgrid textarea,.filter input,input,select,textarea{
  border:1px solid #cad8e6!important;border-radius:10px!important;background:#fff!important;
  color:#102f50!important;transition:.17s ease!important;
}
.formgrid input,.formgrid select,.formgrid textarea{padding:12px 13px!important}
.formgrid input:focus,.formgrid select:focus,.formgrid textarea:focus,input:focus,select:focus,textarea:focus{
  outline:none!important;border-color:#4c94ce!important;box-shadow:0 0 0 3px rgba(46,130,200,.12)!important
}
textarea{line-height:1.45!important}

/* Mensajes */
.messages{max-width:100%!important}
.msg{border-radius:12px!important;padding:13px 16px!important;border:1px solid #dbe6f1!important;box-shadow:0 3px 10px rgba(8,42,80,.04)!important}
.msg.success{background:#e9f8f1!important;border-color:#c3ead8!important;color:#08734f!important}
.msg.error{background:#fff0f1!important;border-color:#f3c8ce!important;color:#a61d2c!important}
.acceptance{background:#eef6ff!important;border-left:4px solid #2e82c8!important;border-radius:10px!important}

/* Listados móviles */
.mobile-record{padding:17px!important}
.mobile-record-title{border-bottom-color:#e5edf5!important}
.mobile-record-title span{background:#edf5fd!important;color:#245b8e!important}

/* Documento / recibos */
.document{box-shadow:0 12px 36px rgba(8,42,80,.09)!important}
.receipt-card,.receipt-box,.receipt-summary div{border-radius:11px!important;border-color:#dbe5ef!important}

/* Viajes: más visual incluso sin cambiar plantilla */
body:has(a[href="/trips/new/"]) .panel.desktop-only{padding:10px 18px 18px!important}
body:has(a[href="/trips/new/"]) table tbody td:first-child a{font-size:15px!important}
body:has(a[href="/trips/new/"]) table tbody td:nth-child(5){font-weight:800!important;color:#0a5c95!important}

/* Cotizaciones / Facturas / Reservas */
.quote-totals{border-radius:14px!important;box-shadow:0 4px 14px rgba(8,42,80,.05)!important}
.quote-totals .grand{background:linear-gradient(90deg,#e8f7f0,#f3fbf7)!important}
.invoice-total{color:#0a6b4a!important;background:#eef8f3!important;border-radius:12px!important}

/* Responsive */
@media(max-width:1050px){
  .header-top{padding:12px 18px!important;flex-wrap:wrap!important}
  .app-header .search{max-width:none!important;width:100%!important}
  main{padding:0 18px 36px!important}
}
@media(max-width:700px){
  .app-header{position:relative!important}
  .header-top{padding:10px 14px!important;min-height:auto!important;gap:10px!important}
  .brand-with-logo{font-size:20px!important;gap:9px!important}
  .brand-with-logo small{font-size:10px!important}
  .header-logo-frame{width:52px;height:52px;border-radius:11px}
  img.header-logo{width:46px!important;height:46px!important;max-width:46px!important;max-height:46px!important}
  .main-nav{display:none!important;padding:8px 12px 12px!important;justify-content:flex-start!important}
  .main-nav.open{display:flex!important;flex-direction:column!important;align-items:stretch!important}
  .main-nav a,.main-nav .linkbtn{width:100%!important;text-align:left!important;padding:11px 13px!important}
  .menu-toggle{display:block!important;margin:0 14px 10px!important;align-self:flex-start!important}
  main{margin-top:18px!important;padding:0 13px 30px!important}
  .pagehead{flex-direction:column!important;align-items:stretch!important}
  .pagehead h1{font-size:29px!important}
  .pagehead .btn{width:100%!important;text-align:center!important}
  .panel{padding:14px!important;border-radius:15px!important}
  .cards{grid-template-columns:1fr 1fr!important}
  .cards>div{padding:16px!important}
  .cards b{font-size:21px!important}
}
@media(max-width:460px){.cards{grid-template-columns:1fr!important}}

@media print{
  .app-header,.menu-toggle{display:none!important}
  main{max-width:none!important;margin:0!important;padding:0!important}
  .panel,.document{box-shadow:none!important}
}
