/* =========================================================================
   Create Your Own Madeira Tour - estilos específicos da página
   Complementa o tema (Tailwind CDN + main.css). Não altera o resto do site.
   ========================================================================= */

.cyot-hero { position: relative; min-height: 72vh; display: flex; align-items: center; overflow: hidden; }
.cyot-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.03); z-index: 0; }
.cyot-hero__overlay { position: absolute; inset: 0; background: linear-gradient(115deg, rgba(10,13,20,.95) 0%, rgba(10,13,20,.82) 45%, rgba(10,13,20,.5) 100%); z-index: 1; }
.cyot-hero__inner { position: relative; z-index: 2; }

.cyot-benefit {
	display: inline-flex; align-items: center; gap: .4rem;
	background: rgba(17,22,34,.6); border: 1px solid rgba(148,163,184,.25);
	color: #e5e7eb; padding: .45rem .8rem; border-radius: 9999px;
	font-size: .72rem; font-weight: 600;
}

/* Step layout */
.cyot-step { margin-bottom: 1.75rem; }
.cyot-step__num {
	width: 1.9rem; height: 1.9rem; border-radius: 9999px;
	background: #eab308; color: #0a0d14; font-weight: 800;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: .9rem; flex: 0 0 auto;
}

/* Form controls */
.cyot-label { display:block; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:#94a3b8; font-weight:700; margin-bottom:.35rem; }
.cyot-input, .cyot-select {
	width:100%; background:#0a0d14; border:1px solid rgba(148,163,184,.25); color:#fff;
	border-radius:.75rem; padding:.7rem .9rem; font-size:.9rem;
	transition:border-color .2s ease, box-shadow .2s ease;
}
.cyot-input:focus, .cyot-select:focus { outline:none; border-color:#eab308; box-shadow:0 0 0 3px rgba(234,179,8,.15); }
.cyot-input::placeholder { color:#64748b; }

/* Place selectable cards */
.cyot-places { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
@media (min-width:640px){ .cyot-places{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:1024px){ .cyot-places{ grid-template-columns:repeat(4,minmax(0,1fr)); } }

.cyot-place { position:relative; cursor:pointer; user-select:none; }
.cyot-place input { position:absolute; opacity:0; pointer-events:none; }
.cyot-place__box {
	display:flex; align-items:center; gap:.5rem;
	background:rgba(17,22,34,.55); border:1px solid rgba(148,163,184,.18);
	border-radius:.8rem; padding:.7rem .8rem; height:100%;
	transition:border-color .2s ease, background .2s ease, transform .15s ease;
}
.cyot-place__box:hover { border-color:rgba(234,179,8,.4); transform:translateY(-1px); }
.cyot-place__tick {
	width:1.1rem; height:1.1rem; border-radius:.35rem; border:1.5px solid #475569;
	flex:0 0 auto; display:flex; align-items:center; justify-content:center;
	color:#0a0d14; font-size:.7rem; font-weight:900;
}
.cyot-place__name { font-size:.78rem; color:#cbd5e1; line-height:1.2; }
.cyot-place input:checked + .cyot-place__box { border-color:#eab308; background:rgba(234,179,8,.12); }
.cyot-place input:checked + .cyot-place__box .cyot-place__tick { background:#eab308; border-color:#eab308; }
.cyot-place input:checked + .cyot-place__box .cyot-place__tick::after { content:"✓"; }
.cyot-place input:checked + .cyot-place__box .cyot-place__name { color:#fff; font-weight:600; }
.cyot-place input:focus-visible + .cyot-place__box { box-shadow:0 0 0 3px rgba(234,179,8,.25); }

/* Time per place rows */
.cyot-time-row {
	display:flex; align-items:center; justify-content:space-between; gap:1rem;
	background:rgba(17,22,34,.5); border:1px solid rgba(148,163,184,.12);
	border-radius:.65rem; padding:.55rem .8rem;
}
.cyot-time-row select { max-width:140px; }
.cyot-empty { color:#64748b; font-size:.85rem; font-style:italic; }

/* Vehicle selector */
.cyot-vehicle { cursor:pointer; }
.cyot-vehicle input { position:absolute; opacity:0; pointer-events:none; }
.cyot-vehicle__box {
	border:1px solid rgba(148,163,184,.2); border-radius:1rem; padding:1rem;
	display:flex; align-items:center; gap:.75rem; transition:border-color .2s ease, background .2s ease;
	background:rgba(17,22,34,.5);
}
.cyot-vehicle input:checked + .cyot-vehicle__box { border-color:#eab308; background:rgba(234,179,8,.1); }

/* Summary sticky */
@media (min-width:1280px){ .cyot-summary { position:sticky; top:6rem; } }

/* Example tour cards */
.cyot-example { display:flex; flex-direction:column; height:100%; }

/* Price badge (usado nos cards de exemplo) */
.tlt-price-badge,
.cyot-price-badge {
	background: rgba(234,179,8,.12); border: 1px solid rgba(234,179,8,.3);
	color: #facc15; font-weight: 700; padding: .15rem .6rem;
	border-radius: 9999px; font-size: .8rem; white-space: nowrap;
}

/* Over-limit warning */
.cyot-warning {
	background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.4);
	color:#fecaca; border-radius:.9rem; padding:1rem 1.1rem; font-size:.88rem;
}
.cyot-hidden { display:none !important; }