main {
    background-color: #F9F9F7;
    color: #252323;
    font-family: Figtree;
    font-style: normal;
    line-height: normal;
    font-weight: 500;
}

.flex-1 {
    flex: 1;
}

.no-overflow {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.listing-details-landlord-image {
    width: 56px;          
    height: 56px;
    flex: 0 0 56px;
    overflow: hidden;
    border-radius: 0;
}

.listing-owner-avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;     
    object-position: center;
    display: block;
}

.error-message {
    color: #dc3545;
}

/* Prevent fixed header from overlapping listing gallery */
.listing-container {
    padding-top: 1rem;
    position: relative;
    z-index: 1;
}

.gallery-item {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1; /* ensures square even inside Bootstrap columns */
    overflow: hidden;
    background: #f0f0f0;
    border-radius: 8px;
}

.gallery-item img {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

.gallery-item.more .more-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.6);
    color: #fff;
    font-size: 1.2em;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 1;
}

.listing-details-name {
    font-size: 32px;
    font-weight: 700;
}

.listing-details-address {
    color: #4F4D4D;
    font-size: 20px;
}

.listing-owner-avatar {
    border-radius: 0;
    width: 52px;
    height: 52px;
    box-shadow: none;
}

.listing-details-landlord-details-name {
    font-size: 14px;
}

.listing-details-landlord-details-membership {
    font-size: 12px;
}

.dot {
    width: 7px;
    height: 7px;
    margin-bottom: 0;
}

.listing-details-landlord-details-online-status span {
    color: #787777;
    font-size: 10px;
    font-family: Poppins;
}

.leasing-block {
    border-radius: 4px;
    border: 2px solid #C38F08;
    background: #F3E9CE;
}

.leasing-header {
    font-size: 14px;
    font-weight: 700;
}

.leasing-description {
    font-size: 14px;
    font-weight: 400;
}

.leasing-learn-more {
    color: var(--hlrbo-primary-text);
    font-size: 14px;
    font-weight: 700;
}

.pricing {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.price-amount {
    font-size: 20px;
    font-weight: 700;
}

/* Selected lease offering, shown above the price it belongs to on a listing with more than one
   offering. Filled in by the season chooser, which selects in place rather than navigating. */
.listing-selected-offering {
    border-bottom: 1px solid #E0E0E0;
    padding-bottom: 8px;
}

.listing-selected-offering-name {
    color: #31420E;
    font-size: 16px;
    font-weight: 600;
}

.price-negotiable {
    font-size: 16px;
    font-weight: 500;
}

.spots {
    font-size: 16px;
    font-weight: 500;
    color: #787777;
}

/* HLRBO Rewards inline toggle on exclusive listings */
.rewards-toggle-row {
    padding: 4px 0;
}

.rewards-toggle-star {
    color: #6E883F;
    font-size: 18px;
    line-height: 1;
}

.rewards-toggle-label {
    font-size: 15px;
    font-weight: 600;
    color: #6E883F;
    line-height: 1;
}

.rewards-toggle-switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 28px;
    flex-shrink: 0;
    cursor: pointer;
    margin: 0;
}

.rewards-toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.rewards-toggle-slider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    border-radius: 28px;
    transition: background-color 0.2s ease;
}

.rewards-toggle-slider::before {
    content: "";
    position: absolute;
    height: 22px;
    width: 22px;
    left: 3px;
    bottom: 3px;
    background-color: #FFFFFF;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.rewards-toggle-switch input:checked + .rewards-toggle-slider {
    background-color: #6E883F;
}

.rewards-toggle-switch input:checked + .rewards-toggle-slider::before {
    transform: translateX(20px);
}

.pricing-splitter, .weather-splitter {
    border-bottom: 1px solid #DFDFD5;
}

.pricing-upgrade-button {
    border-radius: 4px;
    background: #6E883F;
    height: 44px;
    border: none;
    outline: none;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
}

.pricing-upgrade-button:hover {
    color: #FFF !important;
    text-decoration: none;
}

/* Equal-size CTA buttons (Subscribe To Schedule Visit / Subscribe to Reserve Lease) */
.listing-cta-button-row .listing-cta-button-col {
    flex: 1 1 0;
    min-width: 0;
}
.listing-cta-button {
    white-space: normal;
    line-height: 1.25;
    padding: 8px 12px;
}

/* Booking note: wrap text in panel on mobile (no nowrap) */
.listing-booking-note {
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
}

.pricing-upgrade-button:disabled,
.pricing-upgrade-button.disabled {
    background: #A3A3A3;
    cursor: not-allowed;
    opacity: 1;
}

/* Reserve Lease button: dark green when enabled (as on listing detail) */
.reserve-lease-button:not(:disabled):not(.disabled),
#reserveLeaseButton:not(:disabled):not(.disabled) {
    background: #31420E;
}
.reserve-lease-button:not(:disabled):not(.disabled):hover,
#reserveLeaseButton:not(:disabled):not(.disabled):hover {
    background: #31420E;
    color: #FFF;
}

.schedule-visit-time-btn {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #F5F5F0;
    color: #252323;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    outline: none;
    padding: 10px 8px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}

.schedule-visit-time-btn:hover:not(:disabled) {
    border-color: #6E883F;
}

.schedule-visit-time-btn.selected {
    border: 1.5px solid #31420E;
    background: #D6D9CF;
}

.schedule-visit-time-btn.disabled {
    background: #F2F2EE !important;
    border-color: #DFDFD5 !important;
    color: #A3A3A3 !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
}

/* Schedule Visit calendar: compact + centered in modal */
 {
    display: flex;
    justify-content: center;
}

 .ui-datepicker {
    width: 360px !important; /* compact width */
    max-width: 100%;
}

 .ui-datepicker table {
    width: 100%;
    table-layout: fixed; /* prevent column width shifts */
}

 .ui-datepicker th {
    padding: 0.25rem 0;
    font-size: 0.85rem;
}

 .ui-datepicker td a,
 .ui-datepicker td span {
    /* Fixed-size day "pill" so selecting doesn't resize columns */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 0 auto;
    padding: 0 !important;
    font-size: 0.95rem;
}

 .ui-datepicker-header {
    position: relative;
    padding: 0.25rem 0;
}

 .ui-datepicker-title {
    text-align: center;
    margin: 0 auto;
    padding: 0 2.5rem; /* keep title clear of nav buttons */
    font-size: 1rem;
}

 .ui-datepicker-calendar {
    margin-top: 1rem;
    text-align: center;
}

 .ui-state-default {
    color: #252323;
}

 .ui-state-disabled .ui-state-default {
    color: lightgrey;
}

 .ui-state-default:hover {
    text-decoration: none;
}

 .ui-datepicker-title {
    color: #252323;
    font-size: 20px;
    font-weight: 700;
    line-height: 150%; /* 30px */
}


 .ui-datepicker-prev {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
}

 .ui-datepicker-next {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
}

/* If jQuery UI icon sprites aren't loading, render our own arrows */
 .ui-datepicker-prev span.ui-icon,
 .ui-datepicker-next span.ui-icon {
    display: none;
}

 .ui-datepicker-prev::before {
    content: "\2039";
    font-size: 22px;
    line-height: 1;
    color: #D97A15;
}

 .ui-datepicker-next::before {
    content: "\203A";
    font-size: 22px;
    line-height: 1;
    color: #D97A15;
}

/* Selected date styling (orange circle) */
 .ui-datepicker td a.ui-state-active,
 .ui-datepicker td.ui-datepicker-current-day a {
    background: #D97A15 !important; /* orange */
    border-color: #D97A15 !important;
    color: #FFFFFF !important;
    border-radius: 999px !important;
}

 .ui-datepicker td {
    text-align: center;
    width: 14.285%;
}

#schedulePropertyVisitModal .action-block, .action-block-greyed {
    background: #F2F2EE;
}

#schedulePropertyVisitModal .action-block {
    position: sticky;
    bottom: 0;
    z-index: 1;
}

.hunter-number-label {
    color: #787777;
    font-size: 12px;
    font-weight: 500;
}

.hunter-number-select {
    display: flex;
    padding: 10px 16px 10px 12px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 4px;
    background: #F2F2EE;
    font-size: 16px;
    font-weight: 800;
    border: none;
    outline: none;
}

.visit-main-button {
    display: flex;
    height: 44px;
    padding: 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    background: #6E883F;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    border: none;
    outline: none;
}

.visit-main-button:disabled {
    background: #C4C4C4 !important;
    color: #7A7A7A !important;
    cursor: not-allowed;
    opacity: 1 !important;
}

.lease-about {
    max-width: 600px;
    position: relative;
}

.lease-about-header {
    font-size: 14px;
    font-weight: 700;
}

.lease-about-content-wrapper {
    position: relative;
    overflow: hidden;
    max-height: 40px; /* collapsed height */
    transition: max-height 0.3s ease;
    color: #333;
}

.lease-about-content-wrapper.expanded {
    max-height: fit-content; /* enough to show full text */
}

.lease-about-content {
    position: relative;
    z-index: 1;
    font-size: 14px;
    font-weight: 500;
}

.lease-about-fade {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background: linear-gradient(to top, #F9F9F7, transparent);
    z-index: 2;
    pointer-events: none;
}

.lease-about-read-more {
    cursor: pointer;
    color: #66974E;
    font-size: 14px;
    font-weight: 600;
}

.animals-title, .land-types-title, .amenities-title {
    font-size: 14px;
    font-weight: 600;
}

.animal, .land-type, .amenity {
    border-radius: 4px;
    background: #DFDFD5;
    min-height: 40px;
    font-size: 14px;
}

.blur-grayscale {
    filter: blur(5px) grayscale(1);
    -webkit-filter: blur(5px) grayscale(1);
    -moz-filter: blur(5px) grayscale(1);
    -o-filter: blur(5px) grayscale(1);
    -ms-filter: blur(5px) grayscale(1);
}

.inner {
    left: 50%;
    top: 25%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    background-color: white;
}

.innerNoBackground {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
}

.trail-cam-block {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

/* Bug 3209: Schedule Visit button - 16px instead of 14px */
.cam-trail-subscribe-button {
    display: flex;
    height: 36px;
    padding: 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    border: 1px solid #6E883F;
    background: #6E883F;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 900;
}

.cam-trail-subscribe-button:hover {
    color: #FFF;
    text-decoration: none;
}

.location-container {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.listingMap {
    border-radius: 8px;
    width: 100%;
}

.weather-conditions {
    border-radius: 4px;
    background: #F3E9CE;
    flex: 1.5;
}

.hunting-conditions {
    border-radius: 4px;
    background: #E7D29C;
    flex: 1;
}

.contact-owner-button button {
    height: 44px;
    padding: 10px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #6E883F;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    border: none;
}

.weather-temperature-label {
    font-size: 16px;
    font-weight: 700;
}

.weather-temperature-value {
    font-size: 64px;
    font-weight: 700;
}

.weather-icons {
    flex: 1.5;
}

.weather-conditions-details {
    flex: 1;
}

.weather-conditions-details-row.bordered {
    border-bottom: 1px solid #DBBC6B;
}

.weather-conditions-details-label {
    font-size: 14px;
    font-weight: 700;
}

.weather-conditions-details-value {
    font-size: 14px;
    font-weight: 400;
}

.current-conditions-label {
    font-size: 16px;
    font-weight: 700;
}

.current-conditions-date {
    font-size: 16px;
    font-weight: 400;
}

.current-conditions-row {
    font-size: 16px;
    font-weight: 600;
}

.current-location {
    font-size: 16px;
    font-weight: 400;
}

.weather-tab-link, .data-tab-link {
    height: 44px;
    flex-shrink: 0;
    border-radius: 4px;
    background: #F2F2EE;
    font-size: 16px;
    font-weight: 700;
    border: none;
    outline: none;
    color: #252323;
}

.weather-tab-link.active, .data-tab-link.active {
    border: 2px solid #31420E;
    background: #D6D9CF;
}

.data-container {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.data-container-label {
    font-size: 24px;
    font-weight: 700;
}

.county-dropdown-label {
    color: #787777;
    font-size: 12px;
}

.county-dropdown {
    display: flex;
    padding: 10px 16px 10px 12px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    background: #F2F2EE;
    font-size: 16px;
    border-radius: 4px;
    border: none;
    outline: none;
    color: #252323;
}

.select-wrapper {
    position: relative;
    display: inline-block;
}

.select-wrapper select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    padding-right: 2.5rem;
}

.select-wrapper::after {
    content: "";
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(25%) rotate(45deg);
    width: 10px;
    height: 10px;
    border-right: 2px solid #252323;
    border-bottom: 2px solid #252323;
    pointer-events: none;
}

.field-rep-notes-container {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.field-rep-notes-label {
    font-size: 24px;
    font-weight: 700;
}

.field-rep-notes {
    border-radius: 4px;
    background: #F9F9F7;
}

.field-rep-info {
    flex-basis: 40%;
}

.field-rep-visit-info {
    flex-basis: 60%;
}

.field-rep-user-name {
    font-size: 20px;
    font-weight: 600;
}

.field-rep-badge {
    border-radius: 4px;
    background: #6E883F;
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2.1px;
    width: 187px;
    height: 26px;
    flex-shrink: 0;
}

.field-rep-user-icon {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    border-radius: 30px;
}

.field-rep-badge-text {
    text-transform: uppercase;
}

.field-rep-visit-notes {
    font-size: 16px;
    font-weight: 600;
    white-space: pre-line;
}

.section {
    font-size: 20px;
    font-weight: 400;
    cursor: pointer;
}

.section-block {
    border-bottom: 1px solid #DFDFD5;
}

.section-block:last-of-type {
    border-bottom: none;
}

.section-content {
    display: none;
}

.arrow {
    transition: transform 0.3s ease;
}

.section.open .arrow {
    transform: rotate(90deg);
}

.section.open .arrow.reverse {
    transform: rotate(-180deg);
}

.resources-container {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.resource-label {
    font-size: 24px;
    font-weight: 700;
}

.listing-id-block {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.listing-id-label {
    font-size: 24px;
    font-weight: 700;
}

.listing-id-value {
    font-size: 20px;
    font-weight: 400;
}

.similar-leases {
    background-color: #252323;
}

.similar-leases-label {
    color: #FFF;
    font-size: 32px;
    font-weight: 700;
    flex-basis: 37%;
}

.similar-leases-container {
    flex-basis: 70%;
}

.similar-lease-item {
    width: 252px;
}

.similar-listing-photo-image {
    width: 252px; /* desired width */
    height: 242px; /* desired height */
    object-fit: cover; /* crop to fill while preserving aspect ratio */
    overflow: hidden;
    border-radius: 4px 4px 0px 0px;
    border: 1px solid #DFDFD5;
}

.similar-listing-info {
    border-radius: 0px 0px 4px 4px;
    border: 1px solid #DFDFD5;
    border-top: none;
    background: #FFF;
}

.similar-listing-info-online-status {
    font-size: 10px;
    font-weight: 400;
}

.similar-listing-info-price {
    color: #6E883F;
    font-size: 12px;
    font-weight: 800;
}

.similar-listing-info-name {
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.similar-listing-info-address {
    color: #4F4D4D;
    font-size: 12px;
    font-weight: 500;
}

.contact-landowner-textbox {
    border-radius: 8px;
    border: 1px solid #DFDFD5;
    background: #FDFDFD;
    min-height: 125px;
    max-height: 400px;
}

.contact-landowner-textbox:focus-visible {
    border-color: #DFDFD5;
    outline-color: #DFDFD5;
}

.location-container-label {
    font-size: 24px;
    font-weight: 700;
}

.nearby-container-label, .weather-container-label {
    font-size: 20px;
    font-weight: 700;
}

.nearby-item-image img {
    width: 125px;
    height: 125px;
    object-fit: cover;
    overflow: hidden;
}

.nearby-item {
    border-radius: 4px;
    border: 1px solid #DFDFD5;
    background: #FFF;
}

.nearby-item-details-title {
    font-size: 16px;
    font-weight: 700;
}

.nearby-item-details-address {
    font-size: 16px;
    font-weight: 500;
}

.nearby-item-details-distance {
    color: #4F4D4D;
    font-size: 14px;
    font-weight: 500;
}

.field-rep-notes-FAQ {
    color: #6E883F;
    font-size: 20px;
    font-weight: 600;
}

.upgrade-plan-button {
    border-radius: 4px;
    border: 1px solid #6E883F;
    background: #FFF;
    color: #6E883F;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
}

.upgrade-plan-button-wrapper {
    position: absolute;
    bottom: 8px;
    right: 8px;
    z-index: 1;
}

.hot-actions-block {
    position: absolute;
    top: 10px;
    right: 20px;
}

.similar-listing-photo .hot-actions-block {
    right: 15px;
}

.hot-action {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #DFDFD5;
    cursor: pointer;
}

/* Favorite icon: light olive green circle (share stays light grey) */
.hot-action-fav {
    background: #E2E7D9;
}

.full-length-button {
    display: flex;
    height: 44px;
    padding: 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 4px;
    background: #6E883F;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
}

.full-length-button:hover {
    color: #FFF;
    text-decoration: none;
}

.message-sent-stub {
    border-radius: 8px;
    background: #E2E7D9;
    min-height: 125px;
}

.message-sent-stub-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #31420E;
}

.message-sent-stub-label {
    text-align: center;
    font-size: 16px;
    font-weight: 700;
}

.message-sent-stub-description {
    text-align: center;
    font-size: 14px;
    font-weight: 500;
}

/* Set custom color for inactive bullets */
.similar-leases .swiper-pagination-bullet {
    background-color: white; /* Change to your desired color */
    opacity: 0.7;
}

/* Set custom color for active bullet */
.similar-leases .swiper-pagination-bullet-active {
    background-color: white; /* Change to your desired active color */
}

.trail-cam-modal {
    border: 1px solid lightgray;
    border-radius: 8px;
    width: 325px;
    z-index: 1;
    background-color: #fff;
}

#locationTransitionContainer {
    display: none;
}

#addToWaitlistButton:disabled {
    background-color: #a3a3a3;
    color: white;
    cursor: not-allowed;
    opacity: 0.7;
}

#messageOwnerButton:disabled {
    background-color: #a3a3a3;
    color: white;
    cursor: not-allowed;
    opacity: 0.7;
}

#windForecast, #genericForecast {
    overflow: auto;
}

.waitlist-success .btn-close {
    opacity: 1;
}

.waitlist-success .modal-header {
    border-bottom: none;
}

.waitlist-success .modal-content {
    max-width: 300px;
}

#genericForecast {
    background: #F3E9CE;
}

.hunter-name {
    font-size: 16px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.hunter-review-date {
    font-size: 14px;
    font-weight: 400;
}

.early-access-block-message-block {
    border-radius: 6px;
    border: 2px solid #6E883F;
    background: #E2E7D9;
    font-size: 14px;
    font-weight: 500;
}

.premium-label-container {
    border-radius: 4px;
    background: #6E883F;
}

.premium-label-description {
    color: #FFF;
    font-size: 14px;
    font-weight: 500;
}

.premium-label {
    border-radius: 4px;
    background: #C38F08;
    color: #FFF;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
}

.payment-method-messaging-element {
    border-radius: 4px;
    background: #F2F2EE;
}

@media (min-width: 768px) {
    .county-dropdown {
        width: 185px;
    }

    .trail-cam-modal {
        border: 1px solid lightgray;
        border-radius: 8px;
        width: 400px;
        z-index: 1;
        background-color: #fff;
    }

    /* DEF-12158: weather-conditions/hunting-conditions only sit side-by-side
       (flex-md-row) at >=768px — below that they stack via flex-column, so
       these shrink/wrap rules are only needed at this breakpoint. */
    .weather-conditions {
        min-width: 0;
    }

    .hunting-conditions {
        min-width: 0;
    }

    .current-conditions-row.d-flex {
        flex-wrap: wrap;
        column-gap: 12px;
    }
}

/* Price History percentage change arrows */
.table td.text-success::before {
  content: "▲ ";
  color: inherit;
}
.table td.text-danger::before {
  content: "▼ ";
  color: inherit;
}

/* Hunter Review Photos */
.hunter-review-photos {
    flex-shrink: 0;
}

.hunter-review-photo {
    width: 100px;
    height: 100px;
    border-radius: 4px;
    overflow: hidden;
}

.hunter-review-photo-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hunter-review-photo-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    color: #FFF;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.hunter-review-content {
    flex-wrap: nowrap;
}

.hunter-review-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
}

.h-100 {
    height: 100%;
}

.visit-main-block {
    border-radius: 12px;
    background: #F9F9F7;
}

.visit-block-header {
    font-size: 20px;
    font-weight: 700;
}

.visit-block-content-image-src {
    width: 95px;
    height: 60px;
    border-radius: 8px;
    object-fit: cover;
}

.timezone-label {
    text-align: end;
    font-size: 14px;
    font-weight: 500;
}

.visit-block-content-body-title {
    font-size: 16px;
    font-weight: 700;
}

.visit-block-content-body-address {
    color: #4F4D4D;
    font-size: 14px;
    font-weight: 500;
}

.visit-block-content-row-icon {
    width: 35px;
    height: 35px;
    border-radius: 4px;
    background: #D6D9CF;
}

.visit-block-content-row-body-title {
    color: #787777;
    font-size: 12px;
    font-weight: 400;
}

.visit-block-content-row-body-info {
    font-size: 16px;
    font-weight: 400;
}

.visit-attention-block {
    border-radius: 12px;
    border: 1px solid #6E883F;
    background: #E2E7D9;
}

.visit-attention-block-header {
    color: #6E883F;
    font-size: 17px;
    font-weight: 700;
}

.visit-attention-block-body {
    color: #4F4D4D;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 0;
}

.visit-submitted-header-main {
    color: #000;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
}

.visit-submitted-header-secondary {
    color: #000;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
}

.visit-submitted-info-header {
    font-size: 16px;
    font-weight: 700;
}

.visit-submitted-info-address {
    font-size: 16px;
    font-weight: 400;
}

.visit-submitted-info-date, .visit-submitted-info-time {
    font-size: 14px;
    font-weight: 400;
}

.visit-attention-block-header-small {
    color: #6E883F;
    font-size: 16px;
    font-weight: 700;
}

.visit-next-steps {
    list-style: none; /* remove default numbers */
    padding-left: 0;
    counter-reset: item;
}

.visit-next-steps li {
    counter-increment: item;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.visit-next-steps li::before {
    content: counter(item);
    width: 19px;
    height: 19px;
    min-width: 19px;
    margin-right: 10px;
    background-color: #6E883F; /* green circle */
    color: white; /* white number */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}

.availability-summary-price {
    font-size: 20px;
    font-weight: 700;
}

.availability-summary-group-days {
    font-size: 14px;
    font-weight: 400;
}

/* base highlighted range */
.dp-range-between {
    background: #F8E2CC !important;
    color: #000 !important;
    border-radius: 0 !important;
}

/* start date: rely on dp-range-between for the bar, keep edge cell itself transparent */
.dp-range-start {
    background: transparent !important;
    color: #fff !important;
    border-top-left-radius: 50% !important;
    border-bottom-left-radius: 50% !important;
}

/* end date: rely on dp-range-between for the bar, keep edge cell itself transparent */
.dp-range-end {
    background: transparent !important;
    color: #fff !important;
    border-top-right-radius: 50% !important;
    border-bottom-right-radius: 50% !important;
}

.dp-range-start a, .dp-range-end a {
    background: #D97A15 !important;
    border-color: #D97A15 !important;
    color: #FFFFFF !important;
    border-radius: 999px !important;
}

.dp-range-disabled a {
    opacity: 0.5;
    pointer-events: none;
    background: #E0E0E0 !important;
    color: #9E9E9E !important;
    cursor: not-allowed;
}

/* remove default highlight conflict */
.ui-datepicker .ui-state-active {
    background: transparent !important;
    border: none !important;
}

@media (max-width: 767px) {
    .hunter-review-photo {
        width: 80px;
        height: 80px;
    }

    .hunter-review-content {
        flex-direction: column;
    }

    /* Fix overlay for non-subscribers on mobile - display elements vertically */
    .position-relative > .blur-grayscale {
        display: none !important;
    }

    .position-relative > .trail-cam-modal.inner {
        position: static;
        transform: none;
        width: 100%;
    }

    /* Fix landowner section - stack vertically on mobile */
    .pricing > .d-flex.flex-row {
        flex-direction: column !important;
        gap: 1rem;
    }

    .pricing > .d-flex.flex-row .contact-owner-button {
        justify-content: flex-start !important;
    }
}


/* ---- Multi-season chooser ----
   Shown when a listing sells more than one offering and the visitor arrived without
   ?offeringId= — now the normal path from search, which collapsed to one card per listing.
   Each row selects that season in place — no navigation. Mirrors the mobile app's
   "Seasons & Pricing" block: name, window and game on the left, all-in price and capacity
   on the right, with a badge on a season the hunter has already reserved. */
.listing-offering-choices {
    margin-top: 8px;
}

.listing-offering-choices-label {
    font-size: 20px;
    font-weight: 600;
    color: #1A1A1A;
    margin-bottom: 12px;
}

.listing-offering-choices-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.listing-offering-choice {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 16px;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    background: #FFFFFF;
    text-decoration: none;
    /* A <button>, so it needs the type reset a link didn't: full width, left-aligned text,
       inherited font. Selecting a season is an in-page change, not a navigation. */
    width: 100%;
    text-align: left;
    font: inherit;
    color: inherit;
    cursor: pointer;
}

.listing-offering-choice:hover,
.listing-offering-choice:focus {
    border-color: #6E883F;
    text-decoration: none;
}

/* The selected season. The page no longer reloads on a choice, so this ring is the only thing
   saying which option the price card, the calendar and Reserve Lease below now refer to —
   border and tint together rather than color alone, for the same reason. */
.listing-offering-choice.is-selected {
    border-color: #6E883F;
    border-width: 2px;
    /* Keeps the row the same height as its unselected siblings despite the thicker border. */
    padding: 15px;
    background: #F4F6EE;
}

.listing-offering-choice.is-selected .listing-offering-choice-name {
    color: #31420E;
}

/* A season that is already leased to another hunter. It stays listed — a hunter comparing this
   property's seasons is owed the fact that the deer season is gone — but it is visibly inert:
   muted, no hover affordance, and a not-allowed cursor so the row does not look like a control
   that is merely failing to respond. The strike-through is on the PRICE only: the season name and
   dates are still information, the price is the part no longer on offer. */
.listing-offering-choice.is-leased {
    background: #F7F7F7;
    border-color: #E0E0E0;
    cursor: not-allowed;
}

/* Overrides the shared :hover/:focus green ring above — a disabled button still receives hover
   on some browsers, and a green ring reads as "selectable". */
.listing-offering-choice.is-leased:hover,
.listing-offering-choice.is-leased:focus {
    border-color: #E0E0E0;
}

/* Not opacity on the row: dropping the whole card below AA contrast to say "unavailable" makes
   the season name and dates hard to read for exactly the hunters most likely to need them.
   Each line is muted to a value that still passes on this background instead. */
.listing-offering-choice.is-leased .listing-offering-choice-name,
.listing-offering-choice.is-leased .listing-offering-choice-price {
    color: #595959;
}

.listing-offering-choice.is-leased .listing-offering-choice-price {
    text-decoration: line-through;
}

.listing-offering-choice-main,
.listing-offering-choice-aside {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.listing-offering-choice-aside {
    align-items: flex-end;
    text-align: right;
    flex-shrink: 0;
}

.listing-offering-choice-name {
    font-size: 16px;
    font-weight: 600;
    color: #1A1A1A;
}

.listing-offering-choice-dates,
.listing-offering-choice-species,
.listing-offering-choice-spots {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
}

.listing-offering-choice-price {
    font-size: 18px;
    font-weight: 700;
    color: #1A1A1A;
}

/* Reserved-season badge. Brand green so it reads as progress, not as a warning. */
.listing-offering-choice-badge {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #6E883F;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
}

/* Leased badge. Slate rather than the brand green above: that badge marks the hunter's own
   progress ("Deposit Accepted"), this one marks a season they cannot have, and the two sit in the
   same slot on adjacent rows. Not red — nothing has gone wrong, the season is simply taken.
   #4A4A4A on white is 9.0:1, so the 12px text clears AA comfortably. */
.listing-offering-choice-badge.is-leased {
    background: #4A4A4A;
}

.listing-offering-choices-hint {
    margin-top: 12px;
    font-size: 14px;
    color: #666666;
}

/* Narrow screens: the price column would squeeze the name to a couple of words, so the
   card stacks and the price left-aligns under the season it belongs to. */
@media (max-width: 575px) {
    .listing-offering-choice {
        flex-direction: column;
        gap: 8px;
    }

    .listing-offering-choice-aside {
        align-items: flex-start;
        text-align: left;
    }
}