/*
 * Ubicación: /assets/styles.css
 * Versión: 1.0.6
 * Autor: woomey
 * Fecha: 21/05/2026
 */
:root{
  --bg:#eef6f5;
  --phone:#f8fbfb;
  --card:#ffffff;
  --text:#263447;
  --muted:#6b7788;
  --accent:#0f9f9a;
  --accent-dark:#087d7a;
  --border:#d7e2e6;
  --danger:#d64545;
  --ok:#15905f;
  --shadow:0 10px 30px rgba(28,48,65,.10);
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{
  min-height:100vh;
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:linear-gradient(180deg,#dff1ef 0%,var(--bg) 45%,#f4f8f8 100%);
  color:var(--text);
}
a{color:inherit;text-decoration:none}
body::before{
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(15,159,154,.16),transparent 36%);
}
.topbar{
  position:sticky;
  top:0;
  z-index:10;
  width:min(100%,460px);
  margin:0 auto;
  padding:10px 12px 12px;
  background:rgba(255,255,255,.94);
  border:1px solid var(--border);
  border-top:0;
  border-radius:0 0 22px 22px;
  box-shadow:0 8px 24px rgba(28,48,65,.08);
  backdrop-filter:blur(10px);
}
.topbar-line{
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:34px;
  padding:0 4px 8px;
}
.brand{font-weight:850;letter-spacing:.2px}.toplink{font-size:14px;color:var(--accent);font-weight:800}
.main-menu{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}
.main-menu.guest{grid-template-columns:1fr}
.main-menu a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 4px;
  border:1px solid var(--border);
  border-radius:14px;
  background:#fff;
  color:var(--text);
  font-size:13px;
  font-weight:850;
  text-align:center;
}
.main-menu a.active{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}
.container{
  position:relative;
  width:min(100%,460px);
  min-height:calc(100vh - 104px);
  margin:0 auto;
  padding:18px 14px 34px;
}
.hero{text-align:center;padding:34px 8px 18px}.hero h1,h1{margin:0 0 14px;font-size:25px;line-height:1.18;text-align:center}.hero p{color:var(--muted);margin:0 auto 16px;max-width:330px}.actions{display:flex;gap:10px;margin:14px 0}.vertical{flex-direction:column}.grid4{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:46px;
  padding:11px 15px;
  border-radius:16px;
  background:#fff;
  border:1px solid var(--border);
  font-weight:800;
  text-align:center;
  box-shadow:0 5px 14px rgba(28,48,65,.05);
}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:active{background:var(--accent-dark)}.btn.ghost{background:transparent;box-shadow:none}.btn.small{min-height:38px;padding:8px 12px;font-size:14px;border-radius:13px}.card{
  display:block;
  width:100%;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:22px;
  padding:16px;
  margin:12px 0;
  box-shadow:var(--shadow);
}
.form{display:flex;flex-direction:column;gap:13px;max-width:420px;margin-left:auto;margin-right:auto}label{display:flex;flex-direction:column;gap:7px;font-weight:800;font-size:14px;color:var(--text)}input,select,textarea{width:100%;min-height:46px;border:1px solid var(--border);border-radius:15px;padding:11px 12px;font:inherit;background:#fff;color:var(--text)}textarea{min-height:104px;resize:vertical}input:focus,select:focus,textarea:focus{outline:2px solid rgba(15,159,154,.22);border-color:var(--accent)}.notice{padding:13px 14px;border-radius:17px;background:#e8f7f6;border:1px solid #b9e7e4;margin:12px 0;color:#0b6865}.notice.error{background:#fff2f2;border-color:#f3c5c5;color:#9b2525}.title-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.title-row h1{text-align:left;margin-bottom:0}.trip-card strong,.item-card strong{display:block;font-size:17px;margin-bottom:7px}.trip-card span,.item-card span,.trip-card em,.item-card em{display:block;color:var(--muted);font-size:14px;margin-top:4px;line-height:1.35}.detail p{margin:9px 0;line-height:1.45}.copy-field{cursor:pointer;color:var(--accent);font-weight:700}.trip-context{margin:2px 0 16px}.trip-name{display:block;text-align:center;font-size:20px;font-weight:900;line-height:1.2;margin:4px 0 12px;color:var(--text)}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 14px}.tabs a{text-align:center;background:#fff;border:1px solid var(--border);border-radius:16px;padding:12px 6px;font-weight:850;font-size:14px;box-shadow:0 5px 14px rgba(28,48,65,.05)}.tabs a.active{background:var(--text);color:#fff;border-color:var(--text)}.item-card.seen{opacity:.62;border-color:#9be2bf}.item-card.seen:after{content:'Visto';display:inline-block;margin-top:9px;color:var(--ok);font-weight:850}.swipe-wrap{touch-action:pan-y;position:relative}.swipe-wrap.editable:before{content:'← visto · editar →';display:block;text-align:center;color:var(--muted);font-size:12px;margin:2px 0 -2px}.empty{text-align:center;color:var(--muted);padding:26px 10px}.actions .btn{flex:1}@media(min-width:700px){body{padding:18px 0}.topbar{border-radius:22px}.container{padding:22px 16px 40px}.grid4{grid-template-columns:repeat(4,1fr)}}

@media(max-width:360px){.main-menu a{font-size:12px;padding-left:2px;padding-right:2px}.tabs a{font-size:13px}}

.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.card-with-actions{position:relative;padding:0;overflow:hidden}
.card-main{display:block;padding:16px 74px 16px 16px;min-height:86px}
.icon-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.icon-actions.floating{position:absolute;right:12px;top:50%;transform:translateY(-50%);flex-direction:column;gap:7px}
.icon-btn{width:38px;height:38px;border-radius:13px;border:1px solid var(--border);background:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 5px 14px rgba(28,48,65,.06)}
.icon-btn:active{transform:scale(.97)}
.danger-icon{background:#fff5f5;border-color:#f0caca}
.item-card{padding-right:68px}
.item-card.seen{order:2;background:#f7faf9}

/* v1.0.5 */
.card-content{display:block}
.card-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.inline-link{display:inline-flex;margin-top:8px;color:var(--accent);font-weight:850;text-decoration:underline;text-underline-offset:3px}
.check-row{flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;background:#f7fbfb;border:1px solid var(--border);border-radius:15px;padding:12px;font-weight:850}
.check-row input{width:22px;min-height:22px;height:22px;accent-color:var(--accent)}
.fab{position:fixed;right:calc(50% - min(230px,50vw) + 18px);bottom:18px;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--accent);color:#fff;font-size:34px;font-weight:800;box-shadow:0 12px 28px rgba(28,48,65,.22);z-index:20;border:1px solid rgba(255,255,255,.55)}
.fab:active{transform:scale(.97);background:var(--accent-dark)}
.item-card{padding-right:16px}
.swipe-wrap.editable:before{display:none}


/* v1.0.5 */
.card{position:relative}
.card.has-actions{padding-top:48px}
.card .card-actions.top-right,
.card-actions.top-right{
  position:absolute;
  right:12px;
  top:10px;
  margin-top:0;
  display:flex;
  gap:8px;
  justify-content:flex-end;
}
.card.has-actions .card-content{padding-right:0}
.fab{
  width:auto;
  min-width:0;
  height:50px;
  border-radius:18px;
  padding:0 18px;
  font-size:15px;
  line-height:1;
  gap:7px;
  font-weight:900;
  white-space:nowrap;
}
.fab::before{content:'+';font-size:24px;line-height:1;margin-top:-2px}
@media(max-width:360px){.fab{right:12px;bottom:12px;font-size:14px;padding:0 14px}}


/* v1.0.6 */
.fab{
  position:fixed !important;
  right:18px !important;
  bottom:18px !important;
  left:auto !important;
  top:auto !important;
  transform:none !important;
  width:auto !important;
  min-width:0 !important;
  height:52px !important;
  border-radius:999px !important;
  padding:0 18px !important;
  background:var(--ok) !important;
  border:1px solid rgba(255,255,255,.65) !important;
  color:#fff !important;
  box-shadow:0 14px 30px rgba(21,144,95,.32) !important;
  z-index:999 !important;
}
.fab:active{background:#0f724b !important;transform:scale(.97) !important}
@media(min-width:540px){.fab{right:calc((100vw - 460px)/2 + 18px) !important}}
@media(max-width:360px){.fab{right:12px !important;bottom:12px !important;font-size:14px !important;padding:0 14px !important}}
.small-link{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:13px;font-weight:700;color:var(--accent-dark);text-decoration:none}
.small-link:hover{text-decoration:underline}
