.main-image {max-height:400px;width:100%;object-fit:cover;border-radius:8px;transition:opacity 0.3s ease;}
.thumb-img {width:60px;height:60px;object-fit:cover;border-radius:5px;cursor:pointer;transition:all 0.2s ease;}
.thumb-img:hover {transform:scale(1.05);box-shadow:0 0 5px rgba(0,0,0,0.2);}
.thumb-img.active {border:3px solid #0d6efd;box-shadow:0 0 5px rgba(13,110,253,0.5);}
.thumbnail-scroll {display:flex;gap:10px;overflow-x:auto;margin-top:10px;padding-bottom:5px;}
.thumbnail-scroll::-webkit-scrollbar {height:5px;}
.thumbnail-scroll::-webkit-scrollbar-thumb {background:#ddd;border-radius:10px;}
.icon-outline {color:black;font-size:20px;margin-right:8px;}

.room-section {position:relative;padding:0 40px;}
.room-scroll-container {position:relative;}
.room-scroll-track {display:flex;gap:1.5rem;padding:1rem 0;overflow-x:hidden;scroll-behavior:smooth;}
.room-option-card {flex:0 0 320px;border:1px solid #e0e0e0;border-radius:10px;padding:1.25rem;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.08);display:flex;flex-direction:column;transition:transform 0.3s ease,box-shadow 0.3s ease;height:auto;}
.room-option-card ul, .room-option-card li {margin-bottom:0.3rem;word-break:break-word;white-space:normal;line-height:1.4;}
.room-option-card:hover {transform:translateY(-5px);box-shadow:0 5px 15px rgba(0,0,0,0.1);}
.room-option-title {font-weight:bold;color:#e2ad64;text-decoration:underline;margin-bottom:0.5rem;}
.room-content {flex-grow:1;overflow:hidden;position:relative;}
.room-feature-tags {display:flex;flex-wrap:wrap;gap:8px;margin:10px 0;}
.room-feature-tags span {display:inline-flex;align-items:center;font-size:0.75rem;padding:6px 10px;border:1px solid #e0e0e0;border-radius:6px;background:#f9f9f9;}
.room-feature-tags i {margin-right:6px;font-size:0.8rem;color:#555;}
.room-included {color:green;font-weight:500;margin:10px 0 5px;}
.room-not-included {color:#dc3545;font-size:0.85rem;margin-bottom:10px;}
.room-partner-note {background:#e6f0ff;color:#0071c2;font-size:0.75rem;padding:4px 8px;border-radius:4px;display:inline-block;margin-bottom:8px;}
.room-price-footer {display:flex;justify-content:space-between;align-items:center;margin-top:15px;padding-top:15px;border-top:1px solid #eee;}
.room-price-footer .price {font-size:1.25rem;font-weight:bold;color:#333;}
.room-price-footer .room-subprice {font-size:0.75rem;color:#777;}
.reserve-btn {background-color:#ffc107;color:#fff;border:none;padding:8px 16px;border-radius:4px;font-weight:500;transition:background-color 0.2s;}
.reserve-btn:hover {background-color:#e0a800;color:#fff;}
.read-more-content {max-height:0;overflow:hidden;transition:max-height 0.3s ease;}
.read-more-content.expanded {max-height:1000px;}
.read-more-btn {text-align:center;margin-top:10px;}
.read-more-btn a {color:#0d6efd;font-size:0.85rem;text-decoration:none;display:inline-flex;align-items:center;}
.read-more-btn a i {margin-left:5px;transition:transform 0.2s;}
.read-more-btn a i.rotated {transform:rotate(180deg);}

.scroll-arrow {position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;background:white;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,0.1);cursor:pointer;z-index:10;border:1px solid #eee;opacity:0.9;transition:all 0.2s;}
.scroll-arrow:hover {opacity:1;box-shadow:0 3px 12px rgba(0,0,0,0.15);}
.scroll-arrow.left {left:0;}
.scroll-arrow.right {right:0;}
.scroll-arrow i {font-size:1.2rem;color:#333;}

.map-frame {border:none;width:100%;height:300px;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.facility-item {display:flex;align-items:center;padding:8px 0;}

.scroll-wrapper {position:relative;}
.scroll-row {display:flex;flex-wrap:nowrap;overflow-x:auto;gap:1rem;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:1rem;}
.scroll-row::-webkit-scrollbar {display:none;}
.scroll-row {scrollbar-width:none;}
.scroll-col {scroll-snap-align:start;flex:0 0 auto;}
.scroll-arrow {position:absolute;top:40%;transform:translateY(-50%);background-color:rgba(255,255,255,0.9);border:none;border-radius:50%;width:40px;height:40px;z-index:10;box-shadow:0 2px 6px rgba(0,0,0,0.2);font-size:20px;}
.arrow-left {left:-10px;}
.arrow-right {right:-10px;}
.card-img-top {object-fit:cover;width:100%;height:200px;}