/* ============================================================
   Workshop Madeira de Lei – CSS v4.0 – Mobile-First
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@400;500;600&display=swap');

/* ── VARIÁVEIS ──────────────────────────────────────────── */
:root {
  --noite:   #0D1B2A;
  --noite2:  #14263A;
  --noite3:  #1C3450;
  --ouro:    #C9A84C;
  --ouro-cl: #E8C96A;
  --areia:   #E8D5A3;
  --branco:  #F5F0E8;
  --cinza:   #8A9BAD;
  --nav-h:   64px;
  --hdr-h:   52px;
  --r:       14px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }

/* ── BODY / WRAPPER ─────────────────────────────────────── */
body {
  background:#060e18;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  justify-content:center;
  /* Remove qualquer margin/padding de temas WP */
  margin:0 !important;
  padding:0 !important;
}

/* O plugin pode ser inserido dentro de uma página WP com padding */
#mdl-app {
  width:100%;
  max-width:480px;
  min-height:100vh;
  min-height:100dvh;
  background:var(--noite);
  display:flex;
  flex-direction:column;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16px;
  color:var(--branco);
  position:relative;
  overflow-x:hidden;
}

/* Neutraliza padding de temas que envolve o conteúdo */
.entry-content #mdl-app,
.post-content #mdl-app,
article #mdl-app,
.page-content #mdl-app {
  margin-left:-20px;
  margin-right:-20px;
  width:calc(100% + 40px);
  max-width:none;
}

/* ── HEADER ──────────────────────────────────────────────── */
#mdl-header {
  position:sticky;
  top:0;
  z-index:200;
  height:var(--hdr-h);
  background:var(--noite);
  border-bottom:1px solid rgba(201,168,76,.2);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  flex-shrink:0;
  /* Garante visibilidade mesmo em temas com header fixo */
  margin-top:0;
}

.logo-text {
  font-family:'Playfair Display',serif;
  font-size:14px;
  font-weight:700;
  color:var(--ouro);
  line-height:1.2;
}
.logo-sub {
  font-size:9px;
  color:var(--areia);
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* ── SELETOR DE IDIOMA ───────────────────────────────────── */
.lang-switcher { display:flex; gap:4px; }
.lang-switcher button {
  background:none;
  border:1px solid rgba(201,168,76,.3);
  color:var(--cinza);
  font-size:11px;
  font-weight:600;
  padding:5px 8px;
  border-radius:6px;
  cursor:pointer;
  font-family:'Inter',sans-serif;
  min-height:36px;
  min-width:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  -webkit-tap-highlight-color:transparent;
  transition:all .2s;
  letter-spacing:.02em;
}
.lang-switcher button.active {
  background:var(--ouro);
  border-color:var(--ouro);
  color:var(--noite);
  font-weight:700;
}

/* ── ÁREA DE CONTEÚDO ────────────────────────────────────── */
#mdl-content {
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  /* espaço para a nav bar fixa */
  padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom, 0px) + 8px);
  scroll-behavior:smooth;
}
#mdl-content::-webkit-scrollbar { width:2px; }
#mdl-content::-webkit-scrollbar-thumb { background:rgba(201,168,76,.2); border-radius:1px; }

/* ── SEÇÕES ──────────────────────────────────────────────── */
.mdl-section { display:none; padding:16px 15px 8px; }
.mdl-section.active { display:block; }

/* ── BARRA DE NAVEGAÇÃO INFERIOR ─────────────────────────── */
#mdl-nav {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 480px;
  height: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background: rgba(10,22,36,.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid rgba(201,168,76,.18);
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  z-index: 200;
  box-shadow: 0 -4px 24px rgba(0,0,0,.4);
}

.nav-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  background: none;
  border: none;
  color: var(--cinza);
  font-size: 0px; /* label hidden by default on very small screens */
  font-weight: 600;
  cursor: pointer;
  flex: 1;
  min-width: 0;
  padding: 6px 1px 4px;
  -webkit-tap-highlight-color: transparent;
  font-family: 'Inter', sans-serif;
  transition: color .2s;
  position: relative;
  overflow: hidden;
}

/* Icon wrapper — pill on active */
.nav-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 26px;
  border-radius: 13px;
  transition: background .2s, transform .15s;
  flex-shrink: 0;
}
.nav-btn svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  transition: transform .2s;
}
.nav-btn.active {
  color: var(--ouro);
}
.nav-btn.active .nav-icon-wrap {
  background: rgba(201,168,76,.15);
}
.nav-btn.active svg {
  transform: scale(1.1);
}

/* Label — auto-sizing to fit */
.nav-label {
  font-size: 7.5px;
  line-height: 1;
  letter-spacing: .02em;
  text-transform: uppercase;
  text-align: center;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 2px;
  max-width: 52px;
  display: block;
  font-weight: 600;
}

/* Active label highlight */
.nav-btn.active .nav-label {
  color: var(--ouro);
}

/* ── TÍTULOS DE PÁGINA ───────────────────────────────────── */
.page-title {
  font-family:'Playfair Display',serif;
  font-size:20px;
  color:var(--branco);
  margin-bottom:3px;
  line-height:1.2;
}
.page-subtitle { font-size:12px; color:var(--cinza); margin-bottom:16px; }

/* ── CARDS GENÉRICOS ─────────────────────────────────────── */
.info-card {
  background:var(--noite2);
  border-radius:var(--r);
  padding:14px;
  border:1px solid rgba(201,168,76,.1);
  margin-bottom:10px;
}
.info-card h3 {
  font-family:'Playfair Display',serif;
  color:var(--ouro);
  font-size:14px;
  margin-bottom:7px;
}
.info-card p {
  color:var(--areia);
  font-size:13px;
  line-height:1.65;
  white-space:pre-wrap;
}

.divider {
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,168,76,.3),transparent);
  margin:14px 0;
}

/* ── HOME ────────────────────────────────────────────────── */
.home-banner-wrap {
  width: 100%;
  cursor: zoom-in;
  border-radius: var(--r);
  overflow: hidden;
  display: block;
  background: var(--noite2);
  -webkit-tap-highlight-color: transparent;
}
.home-banner {
  width: 100%;
  height: auto;         /* altura natural — sem corte */
  display: block;
  object-fit: contain;
  border-radius: var(--r);
  transition: opacity .2s;
}
.home-banner-wrap:active .home-banner { opacity: .9; }

/* Tela cheia do banner */
.banner-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 800;
  background: rgba(0,0,0,.96);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: zoom-out;
  -webkit-tap-highlight-color: transparent;
}
.banner-fullscreen.open { display: flex; }
.banner-fullscreen img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}
.banner-fs-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  background: rgba(255,255,255,.15);
  border: none;
  border-radius: 50%;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.banner-fs-hint {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,.4);
  font-size: 11px;
  letter-spacing: .06em;
  pointer-events: none;
  white-space: nowrap;
}

.home-banner-placeholder {
  width:100%;
  height:220px;
  background:linear-gradient(150deg,#0a2040 0%,#1a3a60 60%,#0d2535 100%);
  border-radius:var(--r);
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px dashed rgba(201,168,76,.2);
  position:relative;
  overflow:hidden;
}
.home-banner-wave {
  position:absolute; bottom:0; left:0; right:0; opacity:.2; pointer-events:none;
}
.home-banner-inner { position:relative; z-index:1; text-align:center; padding:0 16px; }
.home-banner-inner .bi { font-size:40px; margin-bottom:8px; }
.home-banner-inner h2 {
  font-family:'Playfair Display',serif;
  font-size:20px; font-weight:900; color:var(--branco); line-height:1.1;
}
.home-banner-inner p { font-size:10px; color:var(--ouro); letter-spacing:.08em; text-transform:uppercase; margin-top:5px; }

.evento-title {
  font-family:'Playfair Display',serif;
  font-size:22px; font-weight:900; color:var(--branco);
  margin-top:14px; line-height:1.15;
}
.evento-subtitle {
  font-size:11px; color:var(--ouro);
  letter-spacing:.07em; text-transform:uppercase; margin-top:3px;
}
.evento-data {
  margin-top:10px; display:flex; align-items:center;
  gap:7px; color:var(--areia); font-size:13px;
}

/* ── CONVIDADOS ──────────────────────────────────────────── */
.guests-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.guest-card {
  background:var(--noite2);
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(201,168,76,.1);
  -webkit-tap-highlight-color:transparent;
}
.guest-card img {
  width:100%; aspect-ratio:3/4; object-fit:cover; display:block;
}
.guest-card-ph {
  width:100%; aspect-ratio:3/4;
  background:var(--noite3);
  display:flex; align-items:center; justify-content:center; font-size:36px;
}
.guest-info { padding:10px; }
.guest-info h3 {
  font-family:'Playfair Display',serif;
  font-size:13px; color:var(--branco);
  margin-bottom:3px; line-height:1.3;
}
.guest-info p { font-size:11px; color:var(--cinza); line-height:1.4; }

/* ── CRONOGRAMA ──────────────────────────────────────────── */
.cron-dia-header {
  font-family:'Playfair Display',serif;
  font-size:12px; color:var(--ouro);
  text-transform:uppercase; letter-spacing:.06em;
  margin-bottom:8px; margin-top:18px;
  padding-bottom:5px;
  border-bottom:1px solid rgba(201,168,76,.2);
}
.cron-dia-header:first-child { margin-top:0; }
.cron-slot {
  display:flex; gap:10px;
  padding:11px 12px;
  background:var(--noite2);
  border-radius:11px;
  margin-bottom:7px;
  border-left:3px solid var(--ouro);
  align-items:flex-start;
}
.cron-hora {
  font-size:13px; font-weight:700; color:var(--ouro-cl);
  min-width:46px; flex-shrink:0; padding-top:1px;
}
.cron-info h4 { font-size:14px; color:var(--branco); font-weight:600; line-height:1.3; }
.cron-info p  { font-size:11px; color:var(--cinza); margin-top:3px; line-height:1.4; }
.cron-addr    { font-size:10px !important; }

/* ── FORMULÁRIO / INSCRIÇÃO ──────────────────────────────── */
.form-group { margin-bottom:13px; }
.form-group label {
  display:block;
  font-size:10px; font-weight:700; color:var(--ouro);
  text-transform:uppercase; letter-spacing:.06em; margin-bottom:5px;
}
.form-group input,
.form-group select,
.form-group textarea {
  width:100%;
  background:var(--noite2);
  border:1px solid rgba(201,168,76,.2);
  border-radius:10px;
  padding:13px 14px;
  color:var(--branco);
  font-size:16px; /* evita zoom no iOS */
  font-family:'Inter',sans-serif;
  outline:none;
  -webkit-appearance:none;
  appearance:none;
  transition:border-color .2s;
}
.form-group textarea { resize:vertical; min-height:80px; line-height:1.5; }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color:var(--ouro); }
.form-group select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238A9BAD' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:40px;
}
.form-group select option { background:#14263A; }
.form-group input::placeholder,
.form-group textarea::placeholder { color:rgba(138,155,173,.5); }

/* Badge adulto/criança */
.cat-badge { margin-top:6px; min-height:20px; }
.cat-pill {
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 12px; border-radius:20px;
  font-size:12px; font-weight:600;
}
.cat-pill.adult { background:rgba(201,168,76,.15); color:var(--ouro-cl); border:1px solid rgba(201,168,76,.3); }
.cat-pill.child { background:rgba(52,152,219,.12); color:#7ec8f7; border:1px solid rgba(52,152,219,.3); }

/* Botão principal */
.btn-primary {
  width:100%;
  background:linear-gradient(135deg,var(--ouro) 0%,var(--ouro-cl) 100%);
  color:var(--noite);
  border:none; border-radius:12px;
  padding:16px; font-size:15px; font-weight:700;
  cursor:pointer; font-family:'Inter',sans-serif;
  text-transform:uppercase; letter-spacing:.06em;
  margin-top:6px;
  min-height:52px;
  -webkit-tap-highlight-color:transparent;
  transition:opacity .2s, transform .1s;
}
.btn-primary:active { opacity:.85; transform:scale(.99); }
.btn-primary:disabled { opacity:.5; cursor:not-allowed; }

/* Mensagem de erro */
.form-error {
  display:none; color:#e74c3c; font-size:12px;
  margin-top:8px; padding:8px 12px;
  background:rgba(231,76,60,.1); border-radius:8px;
  border:1px solid rgba(231,76,60,.2);
}

/* ── LOCAIS ──────────────────────────────────────────────── */
.local-card {
  background:var(--noite2);
  border-radius:var(--r); overflow:hidden;
  border:1px solid rgba(201,168,76,.1); margin-bottom:14px;
}
.local-foto { width:100%; height:150px; object-fit:cover; display:block; }
.local-foto-ph {
  width:100%; height:130px;
  background:var(--noite3);
  display:flex; align-items:center; justify-content:center; font-size:44px;
}
.local-body { padding:13px; }
.local-nome {
  font-family:'Playfair Display',serif;
  font-size:16px; color:var(--branco); margin-bottom:10px;
}
.local-row {
  display:flex; align-items:flex-start;
  gap:9px; padding:8px 0;
  border-bottom:1px solid rgba(201,168,76,.08);
}
.local-row:last-child { border:none; padding-bottom:0; }
.local-row .ic { font-size:16px; min-width:20px; flex-shrink:0; margin-top:1px; }
.local-row .tx h4 { font-size:13px; font-weight:600; color:var(--branco); }
.local-row .tx p  { font-size:11px; color:var(--cinza); margin-top:1px; }
.local-desc { font-size:12px; color:var(--cinza); line-height:1.5; padding-top:6px; white-space:pre-wrap; }
.maps-iframe { width:100%; height:200px; border:none; display:block; }

/* ── GALERIA ─────────────────────────────────────────────── */
.galeria-upload-box {
  background:var(--noite2); border-radius:var(--r);
  padding:14px; border:1px dashed rgba(201,168,76,.3); margin-bottom:14px;
}
.galeria-upload-box h3 { font-size:13px; color:var(--ouro); font-weight:600; margin-bottom:4px; }
.galeria-notice {
  font-size:11px; color:var(--cinza); line-height:1.5;
  margin-bottom:12px; padding:8px 10px;
  background:rgba(201,168,76,.06);
  border-radius:8px; border-left:3px solid rgba(201,168,76,.4);
}
.upload-nome-input {
  width:100%; background:var(--noite3);
  border:1px solid rgba(201,168,76,.2); border-radius:9px;
  padding:11px 13px; color:var(--branco); font-size:16px;
  font-family:'Inter',sans-serif; outline:none; margin-bottom:10px;
  -webkit-appearance:none;
}
.upload-area {
  border:2px dashed rgba(201,168,76,.3); border-radius:10px;
  padding:18px; text-align:center; cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .2s;
}
.upload-area:active { border-color:var(--ouro); }
.upload-area input[type=file] { display:none; }
.ua-icon { font-size:28px; margin-bottom:5px; }
.upload-area p { font-size:12px; color:var(--cinza); }
.upload-status { margin-top:8px; font-size:12px; color:var(--ouro-cl); display:none; }

.thumbs-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:2px; border-radius:12px; overflow:hidden;
}
.thumb-item {
  aspect-ratio:1; overflow:hidden; cursor:pointer;
  background:var(--noite2);
  -webkit-tap-highlight-color:transparent;
}
.thumb-item img { width:100%; height:100%; object-fit:cover; display:block; }
.thumb-item:active img { opacity:.85; }

/* ── STORIES ─────────────────────────────────────────────── */
.stories-viewer {
  position:fixed; inset:0; background:#000; z-index:500;
  display:none; flex-direction:column; touch-action:none;
}
.stories-viewer.open { display:flex; }
.stories-progress { display:flex; gap:3px; padding:12px 12px 0; }
.story-bar { flex:1; height:2px; background:rgba(255,255,255,.3); border-radius:2px; overflow:hidden; }
.story-bar-fill { height:100%; background:#fff; width:0%; }
.stories-top {
  display:flex; align-items:center;
  justify-content:space-between; padding:8px 12px;
}
.story-uploader { display:flex; align-items:center; gap:8px; }
.story-avatar {
  width:30px; height:30px; border-radius:50%;
  background:var(--ouro);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; color:var(--noite); flex-shrink:0;
}
.story-name { font-size:13px; color:#fff; font-weight:500; }
.btn-close-story {
  background:none; border:none; color:#fff; font-size:22px; cursor:pointer;
  min-height:44px; min-width:44px;
  display:flex; align-items:center; justify-content:center;
  -webkit-tap-highlight-color:transparent;
}
.story-img-wrap {
  flex:1; position:relative;
  display:flex; align-items:center; justify-content:center;
}
.story-img-wrap img {
  max-width:100%; max-height:100%; object-fit:contain;
  user-select:none; -webkit-user-drag:none; pointer-events:none;
}
.story-tap {
  position:absolute; top:0; bottom:0; width:40%;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.story-tap-prev { left:0; }
.story-tap-next { right:0; }

/* ── CONTATO ─────────────────────────────────────────────── */
.contato-card {
  background:var(--noite2);
  border-radius:var(--r); padding:18px;
  border:1px solid rgba(201,168,76,.1);
}
.contato-av {
  width:60px; height:60px; border-radius:50%;
  background:linear-gradient(135deg,var(--noite3),var(--ouro));
  display:flex; align-items:center; justify-content:center;
  font-size:26px; margin:0 auto 12px;
}
.contato-nome {
  font-family:'Playfair Display',serif;
  font-size:17px; color:var(--branco);
  text-align:center; margin-bottom:14px;
}
.contato-link, .bank-row {
  display:flex; align-items:flex-start; gap:10px;
  padding:11px 12px;
  background:var(--noite3); border-radius:10px;
  text-decoration:none; color:var(--branco);
  margin-bottom:7px; min-height:50px;
  -webkit-tap-highlight-color:transparent;
  transition:background .15s;
}
.contato-link:active { background:rgba(201,168,76,.15); }
.cl-ic { font-size:20px; flex-shrink:0; margin-top:1px; }
.cl-lbl { font-size:10px; color:var(--cinza); display:block; margin-bottom:2px; }
.cl-val { font-size:13px; font-weight:600; display:block; }

/* Dados bancários */
.bank-card {
  background:var(--noite2); border-radius:var(--r);
  padding:14px; border:1px solid rgba(201,168,76,.15); margin-top:12px;
}
.bank-card h3 {
  font-family:'Playfair Display',serif;
  font-size:14px; color:var(--ouro); margin-bottom:10px;
}
.bank-row {
  background:var(--noite3);
  border-bottom:none; margin-bottom:8px;
}
.bank-row:last-child { margin-bottom:0; }
.bank-val { font-size:11px; font-weight:600; font-family:monospace; word-break:break-all; display:block; }

/* ── MODAL ───────────────────────────────────────────────── */
.mdl-modal-overlay {
  position:fixed; inset:0;
  background:rgba(0,0,0,.8); z-index:600;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  opacity:0; pointer-events:none; transition:opacity .25s;
}
.mdl-modal-overlay.open { opacity:1; pointer-events:all; }
.mdl-modal {
  background:var(--noite2); border-radius:20px;
  padding:26px 20px; max-width:340px; width:100%;
  border:1px solid rgba(201,168,76,.3);
  transform:scale(.9); transition:transform .25s; text-align:center;
}
.mdl-modal-overlay.open .mdl-modal { transform:scale(1); }
.modal-icon { font-size:48px; margin-bottom:10px; }
.mdl-modal h2 {
  font-family:'Playfair Display',serif;
  font-size:18px; color:var(--ouro); margin-bottom:10px;
}
.mdl-modal p { font-size:13px; color:var(--areia); line-height:1.6; margin-bottom:18px; white-space:pre-wrap; }
.modal-close-btn {
  background:var(--ouro); color:var(--noite);
  border:none; border-radius:10px;
  padding:13px 28px; font-size:14px; font-weight:700;
  cursor:pointer; font-family:'Inter',sans-serif; min-height:48px;
  -webkit-tap-highlight-color:transparent;
}

/* ── EMPTY STATE / LOADING ───────────────────────────────── */
.empty-state { text-align:center; padding:40px 16px; color:var(--cinza); }
.empty-state .empty-icon { font-size:42px; margin-bottom:10px; }
.empty-state p { font-size:13px; line-height:1.5; }

.mdl-loading {
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  min-height:180px; gap:12px; color:var(--cinza); font-size:13px;
}
.spin {
  width:28px; height:28px;
  border:3px solid rgba(201,168,76,.2);
  border-top-color:var(--ouro);
  border-radius:50%; animation:spin .8s linear infinite;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* ── RESPONSIVO ──────────────────────────────────────────── */
/* Desktop: centraliza com bordas sutis */
@media (min-width:520px) {
  #mdl-app {
    border-left:1px solid rgba(201,168,76,.1);
    border-right:1px solid rgba(201,168,76,.1);
  }
  .entry-content #mdl-app,
  .post-content #mdl-app,
  article #mdl-app { margin-left:0; margin-right:0; width:100%; max-width:480px; }
}

/* Telas muito pequenas — reduz ícone */
@media (max-width:360px) {
  .nav-btn svg { width:17px; height:17px; }
  .nav-label { font-size:6.5px; max-width:42px; }
  .nav-icon-wrap { width:30px; height:22px; }
  .page-title { font-size:18px; }
  .evento-title { font-size:20px; }
}

/* iOS notch / safe areas */
@supports (padding: env(safe-area-inset-bottom)) {
  #mdl-nav {
    height:calc(var(--nav-h) + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
  }
  #mdl-content {
    padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 8px);
  }
}

/* Remove comportamento de zoom de temas que fazem scroll no header */
@media (max-width:480px) {
  #mdl-header { position:sticky; top:0; }
}

/* ══════════════════════════════════════════════════════════
   EXTRAS v5 — Timeline, Galeria por dia, Stories touch
══════════════════════════════════════════════════════════ */

/* ── CRONOGRAMA: seletor de dias ───────────────────────── */
.cron-day-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.cron-day-tabs::-webkit-scrollbar { display: none; }
.cron-day-tab {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  background: var(--noite2);
  border: 1px solid rgba(201,168,76,.15);
  border-radius: 12px;
  padding: 10px 16px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  -webkit-tap-highlight-color: transparent;
  transition: all .2s;
  min-width: 64px;
}
.cron-day-tab.active {
  background: var(--ouro);
  border-color: var(--ouro);
}
.cdt-day {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--cinza);
}
.cron-day-tab.active .cdt-day { color: var(--noite); }
.cdt-date {
  font-family: 'Playfair Display', serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--branco);
}
.cron-day-tab.active .cdt-date { color: var(--noite); }

/* ── CRONOGRAMA: timeline visual ───────────────────────── */
.cron-timeline {
  position: relative;
  padding-left: 0;
}
.tl-item {
  display: flex;
  gap: 0;
  position: relative;
  margin-bottom: 0;
}
.tl-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 58px;
  flex-shrink: 0;
}
.tl-hora {
  font-size: 12px;
  font-weight: 700;
  color: var(--ouro-cl);
  padding-top: 14px;
  text-align: center;
  line-height: 1;
  white-space: nowrap;
}
.tl-line {
  width: 2px;
  background: linear-gradient(to bottom, rgba(201,168,76,.4), rgba(201,168,76,.1));
  flex: 1;
  min-height: 20px;
  margin-top: 6px;
}
.tl-item.last .tl-line { display: none; }
.tl-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--ouro);
  border: 2px solid var(--noite);
  flex-shrink: 0;
  margin-top: 16px;
  box-shadow: 0 0 0 3px rgba(201,168,76,.2);
  z-index: 1;
}
.tl-card {
  flex: 1;
  background: var(--noite2);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 8px 0 12px 10px;
  border: 1px solid rgba(201,168,76,.1);
  border-left: 3px solid var(--ouro);
}
.tl-card h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--branco);
  line-height: 1.3;
  margin-bottom: 4px;
}
.tl-resp { font-size: 11px; color: var(--cinza); margin-top: 3px; }
.tl-addr { font-size: 10px; color: var(--cinza); margin-top: 2px; }
.tl-loc  { font-size: 11px; color: rgba(201,168,76,.7); margin-top: 2px; }

/* ── GALERIA: header de dia ─────────────────────────────── */
.gal-dia-header {
  font-family: 'Playfair Display', serif;
  font-size: 12px;
  color: var(--ouro);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 16px 0 8px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(201,168,76,.15);
}
.gal-dia-header:first-child { margin-top: 0; }

/* ── STORIES: melhorias ────────────────────────────────── */
.st-day-badge {
  background: rgba(201,168,76,.25);
  color: var(--ouro-cl);
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 10px;
  margin-left: 6px;
  border: 1px solid rgba(201,168,76,.4);
  flex-shrink: 0;
}
#st-img {
  /* Transição de fade entre fotos */
  transition: opacity .2s ease;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
  /* previne seleção durante swipe */
  -webkit-user-select: none;
}
/* Área de swipe ocupa tudo (sem botões laterais visíveis) */
.story-tap {
  /* mantemos para fallback desktop mas invisíveis */
  opacity: 0;
}
/* Indicador swipe na abertura */
.stories-viewer.open::after {
  content: '← swipe →';
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,.3);
  font-size: 11px;
  letter-spacing: .1em;
  pointer-events: none;
  animation: fadeHint 3s ease forwards;
}
@keyframes fadeHint {
  0%  { opacity: 1; }
  60% { opacity: 1; }
  100%{ opacity: 0; }
}

/* ── LOCAIS: botões e mapa ───────────────────────────────── */
.local-btns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 14px;
}
.local-btn-route,
.local-btn-open {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 11px 8px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  line-height: 1.3;
  -webkit-tap-highlight-color: transparent;
  transition: opacity .15s;
}
.local-btn-route:active,
.local-btn-open:active { opacity: .8; }
.local-btn-route {
  background: linear-gradient(135deg, var(--ouro) 0%, var(--ouro-cl) 100%);
  color: var(--noite);
}
.local-btn-open {
  background: var(--noite3);
  color: var(--branco);
  border: 1px solid rgba(201,168,76,.2);
}

/* Mapa: container lazy */
.maps-lazy {
  margin-top: 0;
  border-radius: 0 0 var(--r) var(--r);
  overflow: hidden;
}

/* Botão "ver mapa" */
.maps-lazy-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 16px;
  background: var(--noite3);
  border: none;
  border-top: 1px solid rgba(201,168,76,.15);
  color: var(--ouro);
  font-size: 13px;
  font-weight: 700;
  font-family: 'Inter', sans-serif;
  cursor: pointer;
  letter-spacing: .03em;
  -webkit-tap-highlight-color: transparent;
  transition: background .2s;
  min-height: 50px;
}
.maps-lazy-btn:active { background: rgba(201,168,76,.1); }

/* Iframe após clique */
.maps-lazy iframe {
  width: 100%;
  height: 240px;
  border: none;
  display: block;
}

/* Remove estilos antigos que não são mais usados */
.maps-wrap { display: none; }
.maps-overlay { display: none; }
.maps-iframe { width: 100%; height: 240px; border: none; display: block; }

/* ── LOCAIS: galeria de fotos ───────────────────────────── */
.local-fotos-strip {
  width: 100%;
  background: var(--noite3);
}

/* Foto principal */
.lfs-main {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  cursor: pointer;
}
.lfs-main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity .2s;
}

/* Contador ex: "1 / 3" */
.lfs-count {
  position: absolute;
  bottom: 8px;
  right: 10px;
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  pointer-events: none;
}

/* Miniaturas */
.lfs-thumbs {
  display: flex;
  gap: 3px;
  padding: 3px;
  background: var(--noite);
  overflow-x: auto;
  scrollbar-width: none;
}
.lfs-thumbs::-webkit-scrollbar { display: none; }

.lfs-thumb {
  flex-shrink: 0;
  width: 56px;
  height: 42px;
  border-radius: 4px;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color .15s;
  -webkit-tap-highlight-color: transparent;
}
.lfs-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lfs-thumb.active {
  border-color: var(--ouro);
}
.lfs-thumb:active { opacity: .8; }

/* Legenda */
.lfs-leg {
  font-size: 11px;
  color: var(--cinza);
  padding: 5px 12px 6px;
  min-height: 22px;
  font-style: italic;
  background: var(--noite3);
}

/* ── Banner: hint de zoom ───────────────────────────────── */
.banner-zoom-hint {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0,0,0,.55);
  color: rgba(255,255,255,.85);
  font-size: 10px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 10px;
  pointer-events: none;
  letter-spacing: .04em;
}
.home-banner-wrap { position: relative; }

/* ── BUFFET FORM ─────────────────────────────────────────── */
.buffet-form-card {
  background: var(--noite2);
  border-radius: var(--r);
  padding: 18px;
  border: 1px solid rgba(201,168,76,.25);
  margin-top: 20px;
}
.buffet-form-card h3 {
  font-family: 'Playfair Display', serif;
  font-size: 16px;
  color: var(--ouro);
  margin-bottom: 4px;
}

/* ── BUFFET ──────────────────────────────────────────────── */
.buffet-nbc-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,168,76,.12);
  border: 1px solid rgba(201,168,76,.3);
  color: var(--ouro-cl);
  font-size: 12px;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 20px;
  margin-bottom: 18px;
  letter-spacing: .03em;
}

.buffet-ok-card {
  text-align: center;
  padding: 44px 20px;
  background: var(--noite2);
  border-radius: var(--r);
  border: 1px solid rgba(201,168,76,.2);
  margin-top: 16px;
}
.buffet-ok-card p {
  color: var(--ouro-cl);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
}

.buffet-form-card {
  background: var(--noite2);
  border-radius: var(--r);
  padding: 18px;
  border: 1px solid rgba(201,168,76,.25);
  margin-top: 20px;
}
.buffet-form-card h3 {
  font-family: 'Playfair Display', serif;
  font-size: 16px;
  color: var(--ouro);
  margin-bottom: 4px;
}

/* ── CONVIDADOS: zoom na foto ───────────────────────────── */
.guest-foto-wrap {
  position: relative;
  cursor: zoom-in;
  overflow: hidden;
  border-radius: var(--r) var(--r) 0 0;
  -webkit-tap-highlight-color: transparent;
  display: block;
}
.guest-foto-wrap img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
  display: block;
  transition: transform .3s ease;
}
.guest-foto-wrap:active img { transform: scale(1.03); }

/* Ícone de zoom no canto */
.guest-zoom-hint {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(0,0,0,.5);
  color: #fff;
  font-size: 14px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  pointer-events: none;
  opacity: .85;
}

/* Caption no overlay de tela cheia */
.banner-fs-cap {
  position: absolute;
  bottom: 56px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.6);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  font-family: 'Playfair Display', serif;
  padding: 6px 20px;
  border-radius: 20px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  pointer-events: none;
  white-space: nowrap;
  max-width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── MODAL: QR Code ─────────────────────────────────────── */
#m-qr-wrap {
  margin: 14px auto 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
#m-qr {
  background: #fff;
  padding: 12px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,.25);
  display: inline-block;
  line-height: 0;
}
#m-qr canvas {
  display: block !important;
  border-radius: 4px;
}
.m-qr-label {
  font-family: 'Courier New', monospace;
  font-size: 15px;
  font-weight: 700;
  color: var(--ouro);
  letter-spacing: .14em;
  background: rgba(201,168,76,.1);
  padding: 6px 16px;
  border-radius: 20px;
  border: 1px solid rgba(201,168,76,.3);
}
.m-qr-hint {
  font-size: 12px;
  color: var(--cinza);
  text-align: center;
  line-height: 1.5;
  max-width: 240px;
}
.m-qr-hint strong { color: var(--areia); }
.m-qr-sub {
  font-size: 11px;
  color: var(--cinza);
  display: block;
  margin-top: 3px;
}

/* Modal com scroll quando tem QR */
.mdl-modal-overlay.open .mdl-modal {
  max-height: 94vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.mdl-modal-overlay.open .mdl-modal::-webkit-scrollbar { display: none; }