/* Neutralise le plein écran (100vh) hérité de .heading-content sur les sous-pages, tout en conservant le même cadrage que le hero de l'accueil : 70px en haut (sous le header fixe) + 30px de marges latérales. */ .heading-content.subpage-banner { height: auto; min-height: 0; margin: 0; padding: 70px 30px 0; } .subpage-banner .banner-content { position: relative; width: 100%; height: 380px; margin: 0; display: flex; align-items: center; overflow: hidden; /* Bords arrondis identiques au bloc image de l'accueil */ border-radius: var(--border-radius-max); } .subpage-banner .banner-content .background { position: absolute; inset: 0; z-index: 1; } .subpage-banner .banner-content .filter { position: absolute; inset: 0; z-index: 2; background: linear-gradient(0deg, rgba(0,0,0,.65), rgba(0,0,0,.45)); } .subpage-banner .banner-content .container { width: 100%; } .subpage-banner h1 { color: #fff; } /* Barre de réservation fixée en bas de l'écran sur les sous-pages */ .booking-form-content.booking-sticky { position: fixed !important; left: 0; right: 0; bottom: 0; width: 100%; transform: none !important; z-index: 1100; /* au-dessus des cartes Leaflet (contrôles à 1000) */ padding: 8px 0; background: var(--color-dark); border-top: 1px solid #333; } .booking-form-content.booking-sticky .booking-form { background: transparent; padding: 0 15px; } .booking-form-content.booking-sticky .booking-form::before, .booking-form-content.booking-sticky .booking-form::after { display: none; } .booking-form-content.booking-sticky .booking-form .inner { border: 0; padding: 14px 20px; } /* (l'espace réservé à la barre est géré dans le partial booking-bar) */ /* ============================================================================= The River — styles spécifiques des pages front Ce fichier regroupe les anciens blocs @section('page-styles') des vues front. Il est chargé EN DERNIER dans le afin que ses règles priment. ============================================================================= */ /* ============================================================================= PAGE : Espaces (front/room.blade.php) ============================================================================= */ /* Zigzag : inverse les colonnes en desktop */ @media (min-width: 992px) { .room-reverse { flex-direction: row-reverse; } } /* Pages espace : l'image ne déborde plus vers le bas (évite le chevauchement avec la section suivante) */ .about-content .img-1 { height: 100% !important; min-height: 380px; } /* Zigzag : arrondi inversé vers le haut (miroir de l'arrondi par défaut) */ .room-reverse .img-1 { border-radius: 400px 400px var(--border-radius-max) var(--border-radius-max) !important; } /* Bandeau « chiffres clés » */ .room-stats { display:flex; flex-wrap:wrap; justify-content:center; gap:2.2rem 3rem; margin:1.5rem 0; } .room-stat { text-align:center; min-width:120px; } .room-stat .num { font-size:2.7rem; color:var(--color-primary); line-height:1; } .room-stat .lbl { color:rgba(255,255,255,.55); font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; margin-top:.55rem; } /* Galerie photos */ .room-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; } @media (max-width:1199.98px) { .room-gallery { grid-template-columns:repeat(3,1fr); } } @media (max-width:767.98px) { .room-gallery { grid-template-columns:repeat(2,1fr); } } .room-gallery .cell { display:block; border-radius:18px; overflow:hidden; aspect-ratio:4/3; cursor:pointer; } .room-gallery img { width:100%; height:100%; object-fit:cover; transition:.5s; } .room-gallery .cell:hover img { transform:scale(1.07); } /* Lightbox */ .lightbox { position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,.93); display:none; align-items:center; justify-content:center; } .lightbox.open { display:flex; } .lightbox img { max-width:90vw; max-height:84vh; border-radius:12px; box-shadow:0 10px 50px rgba(0,0,0,.7); } .lightbox button { position:absolute; background:rgba(255,255,255,.07); border:1px solid rgba(234,170,117,.4); color:#fff; width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.2s; } .lightbox button:hover { background:var(--color-primary,#caa06a); border-color:var(--color-primary,#caa06a); color:#0d0b09; } .lightbox .lb-close { top:24px; right:24px; } .lightbox .lb-prev { left:24px; top:50%; transform:translateY(-50%); } .lightbox .lb-next { right:24px; top:50%; transform:translateY(-50%); } .lightbox .lb-counter { position:absolute; bottom:22px; left:0; right:0; text-align:center; color:rgba(255,255,255,.7); font-size:.9rem; } @media (max-width:575.98px){ .lightbox .lb-prev{left:10px} .lightbox .lb-next{right:10px} .lightbox button{width:42px;height:42px} } /* Bandeau immersif (image pleine largeur + citation) */ .room-immersive { position:relative; min-height:360px; border-radius:var(--border-radius-max,30px); overflow:hidden; display:flex; align-items:center; justify-content:center; text-align:center; } .room-immersive > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; } .room-immersive::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.26)); } .room-immersive .inner { position:relative; z-index:2; max-width:720px; padding:2rem; } .room-immersive .inner h2 { color:#fff; font-size:2.1rem; margin-bottom:.6rem; } .room-immersive .inner p { color:rgba(255,255,255,.85); font-size:1.05rem; margin:0; } /* Checklist « inclus » */ .room-checklist { display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem 2.5rem; max-width:820px; margin:0 auto; } @media (max-width:575.98px) { .room-checklist { grid-template-columns:1fr; } } .room-check { display:flex; align-items:center; gap:.7rem; color:rgba(255,255,255,.82); } .room-check .material-symbols-outlined { color:var(--color-primary); font-size:1.4rem; } /* Bandeau CTA doré */ .room-cta { background:linear-gradient(135deg, var(--color-secondary), var(--color-primary)); border-radius:var(--border-radius-max,30px); padding:3rem 2rem; text-align:center; } .room-cta h3 { color:#1a1208; font-size:1.85rem; margin-bottom:.5rem; } .room-cta p { color:rgba(26,18,8,.8); margin-bottom:1.6rem; } .room-cta .room-cta-btn { display:inline-flex; align-items:center; gap:.5rem; background:#1a1208; color:var(--color-secondary); font-weight:600; padding:.9rem 2.2rem; border-radius:50px; transition:.3s; } .room-cta .room-cta-btn:hover { filter:brightness(1.25); color:#fff; } /* Bandeau « espace fermé aux réservations » */ .room-closed-notice { display:flex; align-items:center; justify-content:center; gap:.6rem; margin-top:3.5rem; background:rgba(224,120,95,.12); border:1px solid rgba(224,120,95,.55); color:var(--color-secondary); border-radius:16px; padding:1rem 1.3rem; font-weight:600; } .room-closed-notice .material-symbols-outlined { font-size:1.3rem; } /* ============================================================================= Grille tarifaire (partagée : front/room.blade.php + front/tarifs.blade.php) ============================================================================= */ .price-card { background:linear-gradient(180deg,#161310 0%,#0d0b09 100%); border:1px solid rgba(234,170,117,.22); border-radius:var(--border-radius-max,30px); padding:1.6rem 1.6rem 1.2rem; height:100%; } .price-card h4 { color:#fff; text-align:center; margin-bottom:1.1rem; font-size:1.2rem; } .price-col { margin-bottom:3.5rem; } .price-col:last-child { margin-bottom:0; } .price-grid-table { width:100%; border-collapse:collapse; color:#fff; min-width:560px; } .price-grid-table th, .price-grid-table td { border:1px solid rgba(234,170,117,.18); padding:.65rem .6rem; text-align:center; } .price-grid-table thead th { background:rgba(234,170,117,.12); color:var(--color-secondary); text-transform:uppercase; font-size:.74rem; letter-spacing:.04em; } .price-grid-table thead .grp-head { font-size:.82rem; color:#fff; } .price-grid-table tbody td:first-child, .price-grid-table thead th:first-child { color:var(--color-primary); font-weight:700; } .price-grid-table tbody tr:hover td { background:rgba(255,255,255,.03); } /* Séparateur entre les blocs « Avant » et « Après » */ .price-grid-table .sep { border-left:2px solid rgba(234,170,117,.45); } .price-note { color:rgba(255,255,255,.55); margin-top:3rem; } /* ============================================================================= PAGE : Panier (front/cart.blade.php) ============================================================================= */ .cart-wrap { color: #fff; } .cart-panel { background: linear-gradient(180deg,#161310 0%,#0d0b09 100%); border:1px solid rgba(234,170,117,.22); border-radius: var(--border-radius-max,30px); padding: 2.5rem; } .cart-panel-head { display:flex; align-items:center; gap:1rem; margin-bottom:1.6rem; } .cart-panel-head h3 { margin:0; color:#fff; font-size:1.2rem; } .cart-medallion { width:54px; height:54px; border-radius:50%; flex:none; display:inline-flex; align-items:center; justify-content:center; background: radial-gradient(circle at 32% 28%, rgba(234,170,117,.20), rgba(234,170,117,.04)); border:1px solid rgba(234,170,117,.38); box-shadow: inset 0 0 18px rgba(234,170,117,.08); } .cart-medallion i { font-size:1.5rem; color: var(--color-primary); } /* Espacement vertical des champs (les gouttières gy de Bootstrap ne s'appliquent pas dans ce thème) */ .cart-form .row.g-3 > [class*="col-"] { margin-bottom: 1.35rem; } .cart-form .row.g-3 { margin-bottom: -1.35rem; } .cart-form label { color: rgba(255,255,255,.65); font-size:.76rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:.45rem; display:block; } .cart-form .form-control, .cart-form .form-select { background: rgba(255,255,255,.04); border:1px solid rgba(234,170,117,.22); color:#fff; border-radius:12px; padding:.7rem 1rem; width:100%; height:auto; line-height:1.5; } .cart-form .form-control:focus, .cart-form .form-select:focus { border-color: var(--color-primary); outline:none; background: rgba(255,255,255,.06); color:#fff; } .cart-form .form-control::placeholder { color: rgba(255,255,255,.3); } .cart-form .form-select option { background:#161310; color:#fff; } .cart-check { display:flex; align-items:flex-start; gap:.6rem; color: rgba(255,255,255,.8); cursor:pointer; } .cart-check input { margin-top:.2rem; accent-color: var(--color-primary); width:18px; height:18px; flex:none; } .cart-subsep { border:0; border-top:1px solid rgba(255,255,255,.08); margin:2.25rem 0; } /* Récapitulatif (colonne droite, collant) */ .cart-summary-panel { background: linear-gradient(180deg,#1a1510 0%,#0d0b09 100%); border:1px solid rgba(234,170,117,.4); } @media (min-width: 992px) { .cart-summary { position: sticky; top: 95px; } } .cart-row { display:flex; justify-content:space-between; gap:1rem; padding:.5rem 0; color: rgba(255,255,255,.82); } .cart-sep { border:0; border-top:1px solid rgba(255,255,255,.12); margin:1.5rem 0; } .cart-total-amount { font-size: 2.3rem; font-weight:700; color: var(--color-primary); line-height:1; } .cart-recap-empty { color: rgba(255,255,255,.4); font-style:italic; } .cart-block-label { color: rgba(255,255,255,.55); font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:.7rem; display:block; } .pay-option { display:flex !important; align-items:center !important; gap:.7rem; padding:.75rem .9rem; border:1px solid rgba(234,170,117,.25); border-radius:14px; cursor:pointer; margin-bottom:.7rem; transition:.2s; } .pay-option:hover { border-color: rgba(234,170,117,.55); } .pay-option.active { border-color: var(--color-primary); background: rgba(234,170,117,.08); } .pay-option input { accent-color: var(--color-primary); width:18px; height:18px; flex:none; margin:0; align-self:center; } .pay-option > span:not(.po-icons) { display:flex; flex-direction:column; justify-content:center; flex:1 1 auto; min-width:0; } .pay-option .po-title { color:#fff; font-weight:600; line-height:1.2; } .pay-option .po-sub { color: rgba(255,255,255,.5); font-size:.76rem; } .pay-option .po-icons { flex:none; display:flex; align-items:center; gap:6px; margin-left:auto; } .pay-option .po-icons img { height:22px; width:auto; display:block; } /* Extras (suppléments) */ .cart-extras-hint { color: rgba(255,255,255,.45); font-size:.78rem; font-style:italic; margin:-.2rem 0 .7rem; } .cart-extras { display:flex; flex-direction:column; gap:.4rem; } .cart-extra { display:flex !important; align-items:center !important; gap:.65rem; padding:.5rem .7rem; text-transform:none; border:1px solid rgba(234,170,117,.18); border-radius:11px; cursor:pointer; transition:.18s; } .cart-extra:hover { border-color: rgba(234,170,117,.45); } .cart-extra input { display:none; } .cart-extra .ce-check { flex:none; align-self:center; width:20px; height:20px; border-radius:6px; border:1px solid rgba(255,255,255,.3); display:flex; align-items:center; justify-content:center; transition:.18s; } .cart-extra .ce-check i { font-size:15px; color:#1a1208; opacity:0; transition:.15s; } .cart-extra.checked { border-color: var(--color-primary); background: rgba(234,170,117,.1); } .cart-extra.checked .ce-check { background: var(--color-primary); border-color: var(--color-primary); } .cart-extra.checked .ce-check i { opacity:1; } .cart-extra .ce-body { flex:1; min-width:0; display:flex; flex-direction:column; justify-content:center; line-height:1.25; } .cart-extra .ce-name { color:#fff; font-weight:600; font-size:.86rem; } .cart-extra .ce-meta { color: rgba(255,255,255,.45); font-size:.72rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .cart-extra .ce-lead { color: var(--color-secondary); } .cart-extra .ce-price { color: var(--color-primary); font-weight:700; font-size:.9rem; white-space:nowrap; } .cart-extra.disabled { opacity:.4; cursor:not-allowed; filter: grayscale(.4); } .cart-extra.disabled .ce-lead { color: #e0785f; } .slots-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap:.6rem; } .slots-grid .cart-recap-empty { grid-column: 1 / -1; } .slot-btn { display:flex; flex-direction:column; align-items:center; gap:2px; min-width:0; width:100%; border:1px solid rgba(234,170,117,.4); color:#fff; padding:.55rem .6rem; border-radius:12px; cursor:pointer; transition:.2s; background:transparent; } .slot-btn small { color: var(--color-secondary); font-size:.78rem; } .slot-btn:hover { border-color: var(--color-primary); } .slot-btn.selected { background: var(--color-primary); color:#1a1208; border-color: var(--color-primary); } .slot-btn.selected small { color:#1a1208; } .slot-btn.unavailable { opacity:.3; cursor:not-allowed; text-decoration: line-through; } .cart-btn { display:inline-flex; align-items:center; gap:.5rem; background: linear-gradient(135deg, var(--color-secondary), var(--color-primary)); color:#1a1208 !important; font-weight:600; padding:.9rem 2rem; border-radius:50px; border:0; transition:.3s; width:100%; justify-content:center; } .cart-btn:hover { filter:brightness(1.08); color:#1a1208; } .cart-btn:disabled { opacity:.5; cursor:not-allowed; } /* Champ code intelligent (code cadeau / code promo) */ .cart-code-bar { margin-top: 2.5rem; margin-bottom: 1.75rem; } @media (max-width: 575.98px) { .cart-code-bar { margin-top: 1.5rem; } } /* Espacement vertical entre les blocs en mobile/tablette (les gouttières gy ne s'appliquent pas) */ @media (max-width: 991.98px) { .cart-wrap .row.g-4 > [class*="col-"], .cart-wrap .row.g-xl-5 > [class*="col-"] { margin-bottom: 2rem; } .cart-wrap .row.g-4 > [class*="col-"]:last-child, .cart-wrap .row.g-xl-5 > [class*="col-"]:last-child { margin-bottom: 0; } } .cart-code-form { display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; background: rgba(255,255,255,.04); border:1px solid rgba(234,170,117,.22); border-radius:14px; padding:.6rem .6rem .6rem 1rem; max-width:520px; } .cart-code-form > i { color: var(--color-primary); } .cart-code-form input { flex:1 1 200px; min-width:160px; background:transparent; border:0; color:#fff; padding:.4rem .2rem; outline:none; text-transform:uppercase; letter-spacing:.04em; } .cart-code-form input::placeholder { color: rgba(255,255,255,.35); text-transform:none; letter-spacing:normal; } .cart-code-form button { background: rgba(234,170,117,.16); border:1px solid rgba(234,170,117,.4); color: var(--color-secondary); font-weight:600; padding:.5rem 1.4rem; border-radius:10px; cursor:pointer; transition:.2s; } .cart-code-form button:hover { background: var(--color-primary); color:#1a1208; } .cart-code-applied { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; background: rgba(234,170,117,.1); border:1px solid rgba(234,170,117,.45); border-radius:14px; padding:.85rem 1.2rem; max-width:520px; color:#fff; } .cart-code-applied i { color: var(--color-primary); vertical-align:-4px; margin-right:.3rem; } .cart-code-applied form { margin:0; } .cart-code-remove { background:transparent; border:0; color: rgba(255,255,255,.55); text-decoration:underline; cursor:pointer; font-size:.85rem; } .cart-code-remove:hover { color:#fff; } /* Écran de choix (panier vide) */ .cart-choice { display:flex; flex-direction:column; height:100%; text-align:center; align-items:center; padding:3rem 2.2rem; } .cart-choice .cart-medallion { width:72px; height:72px; margin-bottom:1.4rem; } .cart-choice .cart-medallion i { font-size:2rem; } .cart-choice h3 { color:#fff; font-size:1.4rem; margin:0 0 .6rem; } .cart-choice p { color: rgba(255,255,255,.55); font-size:.92rem; margin-bottom:1.8rem; } .cart-choice form { width:100%; } .cart-choice .choice-fields { text-align:left; margin-bottom:2rem; } .cart-choice .cf-field { margin-bottom:1.1rem; } .cart-choice .cf-field:last-child { margin-bottom:0; } .cart-choice form .cart-btn { margin-top:.4rem; } .cart-choice > .cart-btn { margin-top:auto; } /* Bannière « carte forfait » (redemption) */ .redeem-banner { display:flex; align-items:center; gap:1rem; margin-bottom:1.6rem; padding:1rem 1.2rem; background: rgba(234,170,117,.1); border:1px solid rgba(234,170,117,.45); border-radius:16px; } .redeem-banner-title { color:#fff; font-weight:600; font-size:1.05rem; } .redeem-banner-sub { color: rgba(255,255,255,.6); font-size:.85rem; margin-top:.15rem; } /* ============================================================================= PAGE : Contact (front/contact.blade.php) ============================================================================= */ :root { --river-gold: #c8a06a; } /* Intro */ .contact-section { padding: 80px 0; } .contact-section .intro { max-width: 680px; margin: 0 auto 50px; } /* Cartes coordonnées */ .contact-info-card { display: flex; align-items: flex-start; gap: 18px; padding: 26px; margin-bottom: 20px; border: 1px solid rgba(200, 160, 106, .25); border-radius: 14px; background: rgba(255, 255, 255, .02); transition: border-color .3s, transform .3s; } .contact-info-card:last-child { margin-bottom: 0; } .contact-info-card:hover { border-color: var(--river-gold); transform: translateY(-4px); } .contact-info-card .ci-icon { flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #d8b483, #b07d44); color: #fff; } .contact-info-card .ci-icon .material-symbols-outlined { font-size: 26px; } .contact-info-card h5 { margin: 0 0 4px; font-size: 1.05rem; } .contact-info-card p, .contact-info-card a { margin: 0; color: inherit; opacity: .85; text-decoration: none; line-height: 1.5; } .contact-info-card a:hover { color: var(--river-gold); opacity: 1; } /* Formulaire */ .contact-form-wrap { padding: 40px; border-radius: 16px; background: rgba(255, 255, 255, .03); border: 1px solid rgba(200, 160, 106, .2); } .contact-form .form-field { margin-bottom: 20px; } .contact-form label { display: block; margin-bottom: 8px; font-size: .9rem; letter-spacing: .3px; } .contact-form input, .contact-form textarea { width: 100%; padding: 14px 16px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .15); background: rgba(0, 0, 0, .25); color: #fff; font-family: inherit; font-size: .95rem; transition: border-color .3s, box-shadow .3s; } .contact-form input::placeholder, .contact-form textarea::placeholder { color: rgba(255, 255, 255, .4); } .contact-form input:focus, .contact-form textarea:focus { outline: none; border-color: var(--river-gold); box-shadow: 0 0 0 3px rgba(200, 160, 106, .15); } .contact-form textarea { resize: vertical; min-height: 150px; } /* Map */ .contact-map { padding-bottom: 0; } .contact-map #map { height: 460px; width: 100%; } /* ============================================================================= PAGE : Cartes cadeaux (front/gift-card.blade.php) ============================================================================= */ .gift-section { background: var(--color-black); } .gift-intro p { max-width: 720px; margin-left: auto; margin-right: auto; } .gift-lead { color: var(--color-primary); font-size: 1.35rem; font-style: italic; } .gift-grid { margin-top: 1.5rem; } .gift-grid > [class*="col-"] { margin-bottom: 2.5rem; } .gift-card { position: relative; height: 100%; background: linear-gradient(180deg, #161310 0%, #0d0b09 100%); border: 1px solid rgba(234,170,117,.22); border-radius: var(--border-radius-max, 30px); padding: 2.5rem 2rem; display: flex; flex-direction: column; transition: transform .4s ease, border-color .4s ease, box-shadow .4s ease; overflow: hidden; } .gift-card::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(120% 80% at 50% 0%, rgba(234,170,117,.10), transparent 60%); opacity: 0; transition: opacity .4s ease; } .gift-card:hover { transform: translateY(-8px); border-color: var(--color-primary); box-shadow: 0 28px 55px rgba(0,0,0,.55); } .gift-card:hover::before { opacity: 1; } .gift-card.is-featured { border-color: var(--color-primary); box-shadow: 0 0 0 1px rgba(234,170,117,.35) inset; } .gift-card.is-black { background: linear-gradient(180deg, #0a0a0a 0%, #000 100%); border-color: rgba(234,170,117,.5); } .gift-head { display: flex; align-items: center; gap: .9rem; margin-bottom: .9rem; } .gift-icon-badge { width: 58px; height: 58px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; background: radial-gradient(circle at 32% 28%, rgba(234,170,117,.20), rgba(234,170,117,.04)); border: 1px solid rgba(234,170,117,.38); box-shadow: inset 0 0 18px rgba(234,170,117,.08); transition: border-color .4s ease, box-shadow .4s ease; } .gift-icon-badge i { font-size: 1.6rem; color: var(--color-primary); font-variation-settings: 'wght' 300; } .gift-card:hover .gift-icon-badge { border-color: var(--color-primary); box-shadow: inset 0 0 18px rgba(234,170,117,.15), 0 0 0 4px rgba(234,170,117,.06); } .gift-name { text-transform: uppercase; letter-spacing: .1em; font-weight: 700; color: #fff; margin: 0; font-size: .95rem; line-height: 1.3; } .gift-sepa { width: 110px; opacity: .9; } .gift-price { font-size: 2.7rem; font-weight: 700; color: var(--color-primary); line-height: 1; margin: 1.1rem 0 .35rem; } .gift-persons { color: var(--color-secondary); font-size: .72rem; text-transform: uppercase; letter-spacing: .14em; } .gift-features { list-style: none; padding: 0; margin: 1.75rem 0 1.5rem; width: 100%; } .gift-features li { display: flex; align-items: flex-start; gap: .6rem; padding: .5rem 0; color: rgba(255,255,255,.82); font-size: .92rem; border-bottom: 1px solid rgba(255,255,255,.05); } .gift-features li:last-child { border-bottom: 0; } .gift-features li i { color: var(--color-primary); font-size: 1.1rem; flex: none; margin-top: 1px; } .gift-desc { color: rgba(255,255,255,.5); font-style: italic; margin-bottom: 1.85rem; line-height: 1.6; font-size: .92rem; } .gift-cta { margin-top: auto; } .gift-badge { position: absolute; top: 1.25rem; right: 1.25rem; z-index: 2; background: linear-gradient(135deg, var(--color-secondary), var(--color-primary)); color: #1a1208; font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: .3rem .75rem; border-radius: 50px; } /* Carte libre — slider */ .gift-slider-wrap { margin: 1.75rem 0; } .gift-slider { -webkit-appearance: none; appearance: none; width: 100%; height: 6px; border-radius: 50px; background: rgba(234,170,117,.22); outline: none; cursor: pointer; } .gift-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(135deg, var(--color-secondary), var(--color-primary)); border: 3px solid #100c08; box-shadow: 0 4px 12px rgba(0,0,0,.5); cursor: pointer; } .gift-slider::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: var(--color-primary); border: 3px solid #100c08; cursor: pointer; } .gift-slider-bounds { display: flex; justify-content: space-between; margin-top: .6rem; color: rgba(255,255,255,.4); font-size: .78rem; } /* Citation */ .gift-quote { font-size: 1.9rem; font-weight: 300; font-style: italic; color: var(--color-secondary); line-height: 1.5; } .gift-signature { letter-spacing: .2em; text-transform: uppercase; color: #fff; font-size: .9rem; } /* ============================================================================= PAGE : Confirmation de commande (front/checkout-success.blade.php) ============================================================================= */ .success-wrap { color:#fff; } /* ============ Carte cadeau The River ============ */ .tr-giftcard { position: relative; width: 100%; max-width: 480px; margin: 0 auto; border-radius: 26px; padding: 2.4rem 2.2rem 2rem; text-align: left; color: #fff; background: radial-gradient(120% 90% at 85% 0%, rgba(234,170,117,.18), transparent 60%), linear-gradient(160deg, #1c1712 0%, #0c0a08 100%); border: 1px solid rgba(234,170,117,.45); box-shadow: 0 24px 60px rgba(0,0,0,.5), inset 0 0 60px rgba(234,170,117,.05); overflow: hidden; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .tr-giftcard::before { content:""; position:absolute; inset:0; border-radius:26px; pointer-events:none; border:1px solid rgba(255,255,255,.05); background: linear-gradient(135deg, rgba(255,255,255,.06), transparent 35%); } .tr-gc-corner { position:absolute; top:-40px; right:-40px; width:140px; height:140px; border-radius:50%; background: radial-gradient(circle at 50% 50%, rgba(234,170,117,.22), transparent 70%); } .tr-gc-top { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.6rem; position:relative; } .tr-gc-logo { height:64px; width:auto; } .tr-gc-kicker { font-size:.7rem; letter-spacing:.28em; text-transform:uppercase; color:var(--color-secondary); } .tr-gc-amount { font-size:3rem; font-weight:700; line-height:1; color:var(--color-primary); } .tr-gc-label { font-size:1rem; color:rgba(255,255,255,.7); margin-top:.25rem; } .tr-gc-sep { width:100%; height:12px; margin:1.4rem 0; opacity:.8; } .tr-gc-code { display:flex; flex-direction:column; gap:.25rem; align-items:center; border:1px dashed rgba(234,170,117,.55); border-radius:14px; padding:.85rem 1rem; background:rgba(234,170,117,.06); } .tr-gc-code-label { font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.45); } .tr-gc-code-value { font-size:1.7rem; font-weight:700; letter-spacing:.16em; color:#fff; } .tr-gc-meta { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-top:1.3rem; } .tr-gc-meta .lbl { font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.4); display:block; } .tr-gc-meta .val { font-size:.92rem; color:#fff; } .tr-gc-message { margin-top:1.3rem; padding-top:1.1rem; border-top:1px solid rgba(255,255,255,.1); font-style:italic; color:rgba(255,255,255,.78); font-size:.92rem; } .success-actions { display:flex; gap:.8rem; flex-wrap:wrap; justify-content:center; margin-top:2.2rem; } .btn-print { display:inline-flex; align-items:center; gap:.5rem; cursor:pointer; background:transparent; border:1px solid rgba(234,170,117,.5); color:#fff; padding:.75rem 1.6rem; border-radius:50px; transition:.25s; } .btn-print:hover { background:rgba(234,170,117,.12); border-color:var(--color-primary); color:#fff; } /* Conteneur d'impression (caché à l'écran) */ .tr-print-host { display: none; } /* ============ Impression : uniquement la carte, centrée sur une page ============ */ @media print { @page { size: A4; margin: 0; } /* On masque tout le contenu de la page (display:none → aucune hauteur résiduelle) */ body > *:not(.tr-print-host) { display: none !important; } .tr-print-host { display: flex !important; align-items: center; justify-content: center; width: 100%; height: 100vh; margin: 0; padding: 0; background: #fff; overflow: hidden; } .tr-print-host .tr-giftcard { box-shadow: none; max-width: 420px; width: 90%; margin: 0; } html, body { margin: 0 !important; padding: 0 !important; } }