/* ============================================================
   NTRA - Viaggi pubblicati: card, vetrina, scheda "biglietto",
   dettagli, roadmap verticale, countdown, Ad personam.
   Colori, bordi e testi: variabili di style.css. Bottoni: .bottone.
   ============================================================ */

/* ------------------------------------------------------------
   Catalogo e griglia (condivisa con vetrina, Ad personam e blog)
   ------------------------------------------------------------ */
.ntra-trips-catalog {width: 100%; max-width: var(--nta-container-width); margin: 0 auto; box-sizing: border-box;}
.ntra-trips-catalog-header {margin: 32px 0 16px;}
.ntra-trips-catalog-header h2 {margin: 0; font-size: var(--nta-fs-h1); text-align: left;} /* aspetto di prima, ma h2: l'h1 è il titolo della pagina */
.ntra-trips-empty {padding: 32px 0; color: var(--nta-text-muted);}

.ntra-trips-grid {display: flex; flex-wrap: wrap; justify-content: center; gap: 19px; max-width: 890px; margin: 16px auto 40px;}
.ntra-trips-grid > .ntra-trip-card {flex: 0 1 208px; min-width: min(283px, 100%); max-width: 283px;}

/* ------------------------------------------------------------
   Card viaggio (come nel design: locandina, titolo e info sotto).
   È una .ntra-card: qui si tolgono riquadro e testo centrato pensati
   per le card della home.
   ------------------------------------------------------------ */
.ntra-trip-card.ntra-card {display: flex; flex-direction: column; padding: 0; overflow: visible; text-align: center; background: #fff; border: var(--nta-border); border-radius: var(--nta-field-radius);}
.ntra-trip-card.ntra-card img {width: 100%; height: 100%; margin: 0;}
.ntra-trip-card.ntra-card p {min-height: 0;}

.ntra-trip-card-media {position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden;  }
.ntra-trip-card-media img {display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease;}
.ntra-trip-card-media:hover img {transform: scale(1.04);}

.ntra-trip-card-badge {position: absolute; top: 10px; right: 10px; padding: 4px 8px; color: var(--nta-white); background: var(--nta-black); border-radius: 799px; font-size: var(--nta-fs-xs); font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;}
.ntra-trip-card-badge--warning {background: var(--nta-coral-dark);}

.ntra-trip-card-body {display: flex; flex-direction: column; gap: 3px; padding: 11px 3px 10px 3px;}
.ntra-trip-card-title {margin: 0; font-family: var(--nta-font-text); font-size: var(--nta-fs-h4); font-weight: 600; text-transform: none;}
.ntra-trip-card-title a {color: var(--nta-black);}
.ntra-trip-card-title a:hover {color: var(--nta-coral-dark);}
.ntra-trip-card-dates {margin: 0; color: var(--nta-text-muted); font-size: var(--nta-fs-small);}
.ntra-trip-card-footer {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 3px 10px;}
.ntra-trip-card-price {font-size: var(--nta-fs-body); font-weight: 700;}
.ntra-trip-card-seats {color: var(--nta-text-muted); font-size: var(--nta-fs-xs);}
.ntra-trip-card.is-sold-out .ntra-trip-card-seats {color: var(--nta-coral-dark); font-weight: 700;}
.ntra-trip-card.is-past .ntra-trip-card-media img {filter: grayscale(0.5); opacity: 0.85;}
.ntra-trip-card-cta {align-self: center; margin-top: 8px;}

/* ------------------------------------------------------------
   Vetrina "in evidenza"
   ------------------------------------------------------------ */
.ntra-trips-featured {width: 100%; max-width: var(--nta-container-width); margin: 24px auto 8px; padding: 24px 0 8px; box-sizing: border-box;}
.ntra-trips-featured-header {max-width: 512px; margin: 0 auto 8px; text-align: center;}
.ntra-trips-featured-headline {margin: 0 0 6px;}
.ntra-trips-featured-subtitle {margin: 0; color: var(--nta-text-muted);}

/* ------------------------------------------------------------
   Scheda viaggio come un biglietto aereo (single-ntra_viaggio.php)
   ------------------------------------------------------------ */
.ntra-trip-single-content {line-height: 1.7;}
.ntra-trip-ticket {position: relative; margin: 32px auto; overflow: hidden;}
.ntra-trip-ticket-header {display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 22px; text-align: center;}
.ntra-trip-ticket-header h1 {margin: 0;}
.ntra-trip-ticket-eyebrow {margin: 0; color: var(--nta-teal-dark); font-size: var(--nta-fs-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;}
.ntra-trip-ticket-header .ntra-trip-card-badge {position: static; flex: 0 0 auto;}
.ntra-trip-ticket-top {align-items: center;}

/* Foto: polaroid leggermente inclinata, si raddrizza al passaggio del mouse */
.ntra-trip-ticket-media {position: relative; min-width: 0; padding: 10px 10px 0; box-sizing: border-box;}
.ntra-trip-ticket-photo {padding: 10px 10px 35px; background: var(--nta-white); border: var(--nta-border); border-radius: var(--nta-field-radius); transform: rotate(-2deg); transition: transform 0.3s ease;}
.ntra-trip-ticket-media:hover .ntra-trip-ticket-photo {transform: rotate(0deg);}
.ntra-trip-ticket-photo img {display: block; width: 100%; height: auto; margin: 0; aspect-ratio: 4 / 3; object-fit: cover; border: var(--nta-border); border-radius: 2.4px;}
/* Timbro con la data di partenza */
.ntra-trip-ticket-stamp {position: absolute; top: -5px; right: -3px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 74px; height: 74px; color: var(--nta-black); background: var(--nta-pink); border: var(--nta-border); border-radius: 50%; outline: 2px dashed var(--nta-white); outline-offset: -7px; transform: rotate(12deg); line-height: 1; text-align: center;}
.ntra-trip-ticket-stamp strong {color: var(--nta-black); font-family: var(--nta-font-accent); font-size: var(--nta-fs-h3); font-weight: 700;}
.ntra-trip-ticket-stamp small {margin-top: 2px; font-size: var(--nta-fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;}

/* Informazioni: "targhette" con icona tonda */
.ntra-trip-ticket-info {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 11px; min-width: 0; text-align: left;}
.ntra-trip-ticket-field {display: flex; align-items: center; gap: 11px; width: 100%; max-width: 304px; padding: 8px 13px 8px 8px; box-sizing: border-box; background: var(--nta-white); border: var(--nta-border); border-radius: var(--nta-field-radius);}
.ntra-trip-ticket-icon {display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 37px; height: 37px; background: var(--nta-teal); border: var(--nta-border); border-radius: 50%; font-size: 18px; line-height: 1;}
.ntra-trip-ticket-text {display: flex; flex-direction: column; gap: 2px; min-width: 0;}
.ntra-trip-ticket-label {color: var(--nta-text-muted); font-size: var(--nta-fs-xs); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;}
.ntra-trip-ticket-value {color: var(--nta-black); font-size: var(--nta-fs-body); font-weight: 700;}
.ntra-trip-ticket-field--price {background: var(--nta-gold);}
.ntra-trip-ticket-field--price .ntra-trip-ticket-icon {background: var(--nta-white);}
.ntra-trip-ticket-field--price .ntra-trip-ticket-label {color: var(--nta-black);}
.ntra-trip-ticket-field--price .ntra-trip-ticket-value {font-family: var(--nta-font-accent); font-size: var(--nta-fs-h3); font-weight: 700; line-height: 1;}
.ntra-trip-ticket-field--price .ntra-trip-ticket-value small {font-family: var(--nta-font-text);}
.ntra-trip-ticket-cta {margin-top: 6px; text-align: center;}

/* Linea tratteggiata "strappabile" con tacche ai lati */
.ntra-trip-ticket-divider {position: relative; height: 0; margin: 64px -22px; border-top: 2px dashed var(--nta-black);}
.ntra-trip-ticket-divider::before, .ntra-trip-ticket-divider::after {content: ""; position: absolute; top: -12px; width: 24px; height: 24px; background: var(--nta-cream); border: var(--nta-border); border-radius: 50%; box-sizing: border-box;}
.ntra-trip-ticket-divider::before {left: -12px;}
.ntra-trip-ticket-divider::after {right: -12px;}
.ntra-trip-sold-out-notice {padding: 16px; color: var(--nta-coral-dark); font-weight: 700; text-align: center;}

/* ------------------------------------------------------------
   Pagina di prenotazione separata (?prenota=1)
   ------------------------------------------------------------ */
.ntra-trip-booking-page {max-width: 576px; margin: 0 auto; padding: 24px 16px 48px;}
.ntra-trip-booking-back {margin: 0 0 16px;}
.ntra-trip-booking-back a {color: var(--nta-text-muted); font-size: var(--nta-fs-small);}
.ntra-trip-booking-back a:hover {color: var(--nta-black);}
.ntra-trip-booking-card.ntra-card {height: auto; padding: 26px;}

/* ------------------------------------------------------------
   Dettagli viaggio: incluso / non incluso / documenti / itinerario
   (ntra_render_trip_extra_details())
   ------------------------------------------------------------ */
.ntra-trip-extra-details {display: flex; flex-direction: column; gap: 24px; margin: 24px 0;}
.ntra-trip-detail-section h2 {margin: 0 0 11px; text-align: left;}
.ntra-trip-detail-section--comprende, .ntra-trip-detail-section--non-comprende, .ntra-trip-detail-section--documenti {padding: 18px 19px; border: var(--nta-border); border-radius: var(--nta-block-radius);}
.ntra-trip-detail-section--documenti {background: var(--nta-white);}
.ntra-trip-detail-section--comprende {background: #FFF7D6;}
.ntra-trip-detail-section--non-comprende {background: #FBE4E4;}

.ntra-trip-inclusions {display: flex; flex-wrap: wrap; gap: 8px 19px; margin: 0 0 11px; padding: 0; list-style: none;}
.ntra-trip-inclusion {display: flex; align-items: center; gap: 6px; margin: 0; font-weight: 600;}
.ntra-trip-inclusion-icon {font-size: 13px; line-height: 1;}
.ntra-trip-documents {margin: 0;}
.ntra-trip-bullet-list {display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none;}
.ntra-trip-bullet-list li {position: relative; margin: 0; padding-left: 21px;}

/* Pallino con spunta (incluso) o croce (escluso) */
.ntra-trip-inclusion::before, .ntra-trip-bullet-list li::before {content: ""; flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%; background-position: center; background-repeat: no-repeat; background-size: 9px;}
.ntra-trip-bullet-list li::before {position: absolute; top: 3px; left: 0; width: 13px; height: 13px; background-size: 7px;}
.ntra-trip-inclusion.is-included {color: #1d6b2b;}
.ntra-trip-inclusion.is-excluded {color: var(--nta-coral-dark);}
.ntra-trip-inclusion.is-included::before, .ntra-trip-bullet-list--included li::before {background-color: #e7f7e8; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231d6b2b' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2,9 6,13 14,3'/%3E%3C/svg%3E");}
.ntra-trip-inclusion.is-excluded::before, .ntra-trip-bullet-list--excluded li::before {background-color: #fbe9e9; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%239E3F3E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='3' y1='3' x2='13' y2='13'/%3E%3Cline x1='13' y1='3' x2='3' y2='13'/%3E%3C/svg%3E");}

/* Itinerario: roadmap verticale (ntra_render_vertical_roadmap() in inc/core/ntra-roadmap.php) */
.ntra-vertical-roadmap {position: relative; display: grid; gap: 14px;}
.ntra-vertical-roadmap::before {content: ""; position: absolute; top: 19px; bottom: 19px; left: 18px; width: 2px; background: var(--nta-black);}
.ntra-vertical-roadmap-item {position: relative; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 13px;}
.ntra-vertical-roadmap-marker {position: relative; z-index: 1; display: flex; justify-content: center;}
.ntra-vertical-roadmap-marker span {display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; box-sizing: border-box; overflow: hidden; color: var(--nta-black); background: var(--nta-teal); border: var(--nta-border); border-radius: 50%; font-size: var(--nta-fs-body); font-weight: 800;}
.ntra-vertical-roadmap-marker img {width: 100%; height: 100%; object-fit: cover;}
.ntra-vertical-roadmap-content {padding: 13px 16px; background: var(--nta-white); border: var(--nta-border); border-radius: var(--nta-block-radius);}
.ntra-vertical-roadmap-content h3 {margin: 0 0 5px;}
.ntra-vertical-roadmap-content p {margin: 0;}

/* ------------------------------------------------------------
   Conto alla rovescia apertura prenotazioni (ntra_render_countdown())
   ------------------------------------------------------------ */
.ntra-countdown {text-align: center;}
.ntra-countdown-label {margin: 0 0 6px; color: var(--nta-text-muted); font-size: var(--nta-fs-small); font-weight: 700;}
.ntra-countdown-timer {display: flex; justify-content: center; gap: 6px;}
.ntra-countdown-unit {display: flex; flex-direction: column; align-items: center; min-width: 37px; padding: 6px 5px; color: var(--nta-white); background: var(--nta-black); border-radius: var(--nta-field-radius);}
.ntra-countdown-unit span {font-size: var(--nta-fs-h4); font-weight: 800; line-height: 1;}
.ntra-countdown-unit small {margin-top: 2.4px; font-size: var(--nta-fs-xs); letter-spacing: 0.05em; text-transform: uppercase; opacity: 0.75;}
.ntra-countdown-date {margin: 8px 0 0; color: var(--nta-text-muted); font-size: var(--nta-fs-xs);}
/* Nella card il countdown prende il posto del bottone: più compatto */
.ntra-countdown--card {margin-top: 8px;}
.ntra-countdown--card .ntra-countdown-unit {min-width: 30px; padding: 5px 3px;}
.ntra-countdown--card .ntra-countdown-date {display: none;}
.ntra-trip-booking-not-open {margin-bottom: 13px; font-weight: 600; text-align: center;}

/* Bottone "Avvisami prima" dentro il countdown (ntra_render_trip_reminder()) */
.ntra-reminder {margin-top: 10px;}
.ntra-reminder .bottone[disabled] {cursor: wait;}
.ntra-reminder .ntra-field-label {text-align: left;}
.ntra-reminder .ntra-field-help {margin-bottom: 3px;}

/* ------------------------------------------------------------
   Ad personam: viaggi per il Travel DNA dell'utente
   ------------------------------------------------------------ */
.ntra-ad-personam-header {max-width: 512px; margin: 0 auto 8px; text-align: center;}
.ntra-ad-personam-dna {display: inline-flex; align-items: center; gap: 8px; margin: 5px 0 0; padding: 5px 13px 5px 5px; background: var(--nta-white); border: var(--nta-border); border-radius: 24px;}
.ntra-ad-personam-dna-icon {display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: var(--ntra-shield-color, var(--nta-teal)); border: var(--nta-border); border-radius: 50%; font-size: 16px;}
.ntra-ad-personam .ntra-trips-empty {text-align: center;}
/* Nel pannello utente .ntra-dashboard .ntra-card rimette padding e testo a sinistra: la card viaggio resta com'è */
.ntra-dashboard .ntra-trip-card.ntra-card {padding: 0; text-align: center;}
.ntra-dashboard .ntra-trip-card.ntra-card img {width: 100%; height: 100%;}

@media (max-width: 980px) {
    .ntra-trip-ticket-media {max-width: 368px; margin: 0 auto;}
    .ntra-trip-ticket-stamp {width: 61px; height: 61px;}
}
@media (max-width: 640px) {
    .ntra-trip-ticket-divider {margin: 19px -16px;}
}

/* =====================================================================
   Feedback dei viaggiatori (inc/trips/ntra-trip-feedback.php)
   ===================================================================== */
.ntra-trip-card-rating {margin: 4px 0 0; font-size: var(--nta-fs-small); font-weight: 700;}

.ntra-trip-feedback {margin: 32px 0 8px; padding-top: 24px; border-top: var(--nta-border);}
.ntra-trip-feedback h2 {margin-bottom: 16px;}
.ntra-trip-feedback-summary {display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px 40px; margin-bottom: 24px;}
.ntra-trip-feedback-score {display: grid; justify-items: center; gap: 4px; text-align: center;}
.ntra-trip-feedback-score strong {font-family: var(--nta-font-title); font-size: var(--nta-fs-h1); line-height: 1;}
.ntra-trip-feedback-score .ntra-stars {font-size: 1.4em;}
.ntra-trip-feedback-score > span:last-child {color: var(--nta-text-muted); font-size: var(--nta-fs-small);}
.ntra-trip-feedback-bars {display: grid; gap: 8px; margin: 0; max-width: 420px;}
.ntra-trip-feedback-bars div {display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 12px;}
.ntra-trip-feedback-bars dt {font-weight: 700; font-size: var(--nta-fs-small);}
.ntra-trip-feedback-bars dd {display: flex; align-items: center; gap: 8px; margin: 0; font-size: var(--nta-fs-small);}
.ntra-trip-feedback-bars dd > span:last-child {min-width: 2.2em;}
.ntra-trip-feedback-bar {flex: 1; height: 10px; overflow: hidden; background: var(--nta-white); border: var(--nta-border); border-radius: 6px;}
.ntra-trip-feedback-bar span {display: block; height: 100%; background: var(--nta-star);}
.ntra-trip-feedback-list {display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px;}
.ntra-trip-feedback-card {padding: 16px; text-align: left; background: var(--nta-white); border: var(--nta-border); border-radius: var(--nta-block-radius);}
.ntra-trip-feedback-card header {display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-bottom: 8px;}
.ntra-trip-feedback-card header > span:last-child:not(.ntra-stars) {color: var(--nta-text-muted); font-size: var(--nta-fs-xs);}
.ntra-trip-feedback-card p {margin: 0 0 8px; font-style: italic;}
.ntra-trip-feedback-detail {display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0; padding: 0; color: var(--nta-text-muted); font-size: var(--nta-fs-xs); list-style: none;}
.ntra-trip-feedback-detail li {margin: 0;}
.ntra-trip-feedback-more {margin-top: 16px;}
.ntra-trip-feedback-more summary {display: inline-block; margin-bottom: 16px; list-style: none; cursor: pointer;}
.ntra-trip-feedback-more summary::-webkit-details-marker {display: none;}
.ntra-trip-feedback-more[open] summary {display: none;}

@media (max-width: 640px) {
	.ntra-trip-feedback-summary {grid-template-columns: 1fr;}
	.ntra-trip-feedback-bars {max-width: none;}
}