/* Scoped reservation components, shared by profile pages and notification cards. */
.reservations-page { padding-top: 44px; padding-bottom: 64px; }
.reservations-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:28px; margin-bottom:30px; }
.reservations-breadcrumb { display:inline-flex; color:#a3c5b1; font-size:13px; margin-bottom:14px; text-decoration:none; }
.reservations-breadcrumb:hover { color:#c8f4da; }
.reservations-heading h1 { margin:0 0 12px; font-size:clamp(30px,4vw,42px); line-height:1.15; letter-spacing:-1.3px; }
.reservations-heading p { margin:0; max-width:620px; font-size:14px; line-height:1.7; color:#9cb9a9; }
.reservations-total { display:flex; align-items:center; gap:18px; flex-shrink:0; border:1px solid #6abd8c35; border-radius:18px; padding:16px 20px; background:linear-gradient(120deg,#214f382b,#10261c); }
.reservations-total span { font-size:12px; color:#a5c5b3; }
.reservations-total strong { color:#a0edbd; font-size:28px; line-height:1; }
.reservations-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.reservation-card { display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid #528d6a4a; border-radius:24px; padding:25px; background:radial-gradient(ellipse at top right,#386c4324,transparent 60%),linear-gradient(145deg,#142a20f5,#0d2018f5); box-shadow:0 15px 45px #0002; }
.reservation-card:only-child { grid-column:1/-1; max-width:900px; width:100%; }
.reservation-card-topline { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:23px; }
.reservation-card-number { display:flex; align-items:center; gap:8px; font-size:12px; color:#99b6a5; }
.reservation-card-number svg, .reservation-location svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.6; flex-shrink:0; }
.reservation-card-number svg { color:#94dab0; }
.reservation-card-badge { display:inline-flex; padding:5px 9px; border:1px solid #68bf8f30; border-radius:20px; background:#4fc0840c; color:#9ee0b9; font-size:10px; font-weight:700; text-align:center; }
.reservation-card-badge.is-payment { color:#e9ce8b; background:#d0ad4710; border-color:#c5a75040; }
.reservation-card-title-row { display:flex; justify-content:space-between; gap:20px; margin-bottom:16px; }
.reservation-card h2 { margin:0 0 10px; font-size:25px; line-height:1.3; overflow-wrap:anywhere; }
.reservation-package { display:inline-block; padding:4px 10px; color:#b2d5c2; background:#5d9e7a16; border:1px solid #69a98725; border-radius:8px; font-size:12px; }
.reservation-price { text-align:right; flex-shrink:0; padding-top:3px; }
.reservation-price > span { display:block; font-size:10px; color:#8dad9a; margin-bottom:5px; }
.reservation-price > strong { display:block; font-size:25px; letter-spacing:-.7px; line-height:1.2; color:#bbf5d0; white-space:nowrap; }
.reservation-price small { font-size:16px; font-weight:500; color:#7fbb97; }
.reservation-location { display:flex; align-items:center; gap:8px; margin:0; font-size:12px; color:#a1beac; overflow-wrap:anywhere; }
.reservation-location svg { width:16px; height:16px; color:#729e84; }
.reservation-location-dot { margin:0 8px; color:#53775f; }
.reservation-description { margin-top:23px; padding-top:18px; border-top:1px solid #70a68a24; }
.reservation-description > span { color:#7f9c8b; font-size:10px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; }
.reservation-description p { margin:8px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; color:#bad0c3; line-height:1.75; }
.reservation-card-bottom { margin-top:auto; padding-top:24px; }
.reservation-deadline-card { display:grid; gap:5px; padding:14px 16px; border:1px solid #b29c5440; border-radius:13px; background:linear-gradient(100deg,#baa14b0b,#15241b); }
.reservation-deadline-card > span { font-size:10px; color:#b9aa80; }
.reservation-deadline-card time { font-size:15px; font-weight:700; color:#eddda9; overflow-wrap:anywhere; }
.reservation-deadline-card small { color:#9b9e83; font-size:10px; }
.reservation-price-note, .reservation-payment-note { margin:12px 0 18px; color:#819d8c; font-size:11px; line-height:1.6; }
.reservation-payment-note { color:#b4c6b9; }
.reservation-card-actions { display:flex; gap:10px; }
.btn.reservation-action-primary, .btn.reservation-action-danger { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:48px; border-radius:12px; padding:12px 17px; font:700 13px/1.4 'Manrope',sans-serif; text-decoration:none; text-align:center; transition:background .15s,border-color .15s; }
.btn.reservation-action-primary { flex:1; color:#07351e; background:linear-gradient(115deg,#8de8b3,#59cb8c); border:1px solid #b9f7d243; box-shadow:0 7px 20px #4cc47d13; }
.btn.reservation-action-primary:hover { background:linear-gradient(115deg,#a8f0c6,#79dda4); color:#07351e; }
.btn.reservation-action-danger { color:#f1b3aa; background:#8d40331c; border:1px solid #d37c6d52; }
.btn.reservation-action-danger:hover { color:#ffccc4; background:#aa4e3d30; border-color:#ef9b8a80; }
.btn.reservation-action-danger:disabled { color:#d5aaa4; opacity:.55; }
.reservation-card-actions :focus-visible, .reservations-empty :focus-visible { outline:2px solid #a4eabc; outline-offset:4px; }
.reservations-empty { max-width:720px; border:1px solid #68967b38; border-radius:26px; padding:48px 32px; background:linear-gradient(135deg,#193b2940,#10231a); text-align:center; }
.reservations-empty-clock { display:grid; place-items:center; width:64px; height:64px; margin:0 auto 20px; border:1px solid #8fc5a13d; border-radius:20px; background:#9ed8af0a; font-size:30px; }
.reservations-empty h2 { font-size:24px; margin:0 0 12px; }
.reservations-empty p { max-width:470px; margin:0 auto 24px; color:#9db7a8; font-size:14px; line-height:1.7; }
.reservation-checkout-banner { margin-top:25px; padding:22px 26px; border:1px solid #7bb88b4d; border-radius:20px; background:linear-gradient(120deg,#183728cf,#10241b); }
.reservation-checkout-banner h2 { margin:0 0 10px; font-size:19px; }
.reservation-checkout-banner p { margin:8px 0; color:#9eb7a7; font-size:13px; line-height:1.7; }
.reservation-checkout-banner .reservation-action-danger { margin-top:10px; }
.notification-reservation-detail { display:grid; gap:15px; min-width:0; }
.reservation-notice-kicker { color:#92d9ad; font-size:10px; font-weight:800; letter-spacing:1px; text-transform:uppercase; }
.notification-reservation-detail h4 { color:#e2f6e9; margin:0; font-size:23px; line-height:1.3; }
.reservation-notice-summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px; border:1px solid #76ad8c2b; border-radius:13px; background:#38684916; }
.reservation-notice-summary > span { color:#abc5b6; font-size:13px; }
.reservation-notice-summary > strong { color:#bbf4cc; font-size:21px; white-space:nowrap; }
.payment-status-dialog .notification-reservation-detail p { margin:0; font-size:13px; line-height:1.65; }
.payment-status-dialog .notification-reservation-detail .reservation-notice-description { padding:13px; border-left:2px solid #6dbd8b; border-radius:0 9px 9px 0; background:#87bf9a08; color:#b5ccbf; }
.payment-status-dialog .notification-reservation-detail .reservation-notice-footnote { font-size:11px; color:#809f8d; }
.notification-reservation-detail .reservation-action-primary { flex:auto; width:100%; }
.notification-item.is-reservation { border-color:#7ab78942; background:linear-gradient(110deg,#1f44322e,#10251c); }
.notification-item.is-reservation .notification-item-body { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:13px; }
@media(max-width:900px) { .reservations-grid { grid-template-columns:1fr; } }
@media(max-width:560px) {
    .reservations-page { padding-top:28px; padding-bottom:42px; }
    .reservations-heading { align-items:flex-start; gap:16px; margin-bottom:22px; }
    .reservations-heading p { font-size:12px; }
    .reservations-heading h1 { font-size:29px; }
    .reservations-total { padding:10px 12px; flex-direction:column; gap:7px; border-radius:13px; text-align:center; }
    .reservations-total span { max-width:65px; font-size:9px; }
    .reservations-total strong { font-size:23px; }
    .reservation-card { padding:20px 17px; border-radius:20px; }
    .reservation-card-topline { margin-bottom:20px; }
    .reservation-card-badge { max-width:130px; font-size:9px; }
    .reservation-card h2 { font-size:23px; }
    .reservation-card-title-row { gap:12px; }
    .reservation-price > strong { font-size:21px; }
    .reservation-price small { font-size:14px; }
    .reservation-card-actions { flex-direction:column; gap:8px; }
    .reservation-card-actions .btn { width:100%; }
    .reservations-empty { padding:30px 20px; }
    .reservation-notice-summary { flex-wrap:wrap; }
    .reservation-checkout-banner { padding:20px; }
}
@media(prefers-reduced-motion:reduce) { .btn.reservation-action-primary,.btn.reservation-action-danger { transition:none; } }

.reservation-card-title-row > div:first-child, .reservations-heading > div:first-child { min-width:0; }