/* ═══════════════════════════════════════════════════
   FRONTLINE PRICES — Card design (ribbon + icons)
═══════════════════════════════════════════════════ */

.fhr-prices-wrap {
    max-width: 1240px;
    margin: 0 auto;
    padding: 24px 0 48px;
    color: #2c2c2c;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.fhr-prices-intro {
    font-size: 1.05em;
    color: #555;
    margin: 0 0 28px;
    line-height: 1.55;
    text-align: center;
}
.fhr-prices-empty {
    padding: 40px;
    text-align: center;
    color: #888;
    background: #f8f8f8;
    border-radius: 10px;
}

/* ─── Facilities top bar ─── */
.fhr-facilities {
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 14px;
    padding: 22px 28px;
    margin-bottom: 40px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}
.fhr-facilities-title {
    font-size: .82em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #c0392b;
    margin-bottom: 16px;
    text-align: center;
}
.fhr-facilities-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 12px 20px;
}
.fhr-facilities-list li {
    padding: 4px 0;
    font-size: .95em;
    color: #444;
    display: flex;
    align-items: center;
    gap: 10px;
    line-height: 1.4;
}
.fhr-fac-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #c0392b;
    flex-shrink: 0;
}

/* ─── Hostel group ─── */
.fhr-hostel-group { margin-bottom: 46px; }
.fhr-hostel-heading {
    font-size: 1.55em;
    font-weight: 800;
    color: #2c2c2c;
    margin: 0 0 22px;
    padding-bottom: 10px;
    border-bottom: 3px solid #c0392b;
    display: inline-block;
    letter-spacing: -0.01em;
}

/* ─── Cards grid ─── */
.fhr-prices-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 26px;
}

/* ─── Card ─── */
.fhr-price-card {
    position: relative;
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 3px 12px rgba(0,0,0,0.06);
    transition: transform .22s ease, box-shadow .22s ease;
}
.fhr-price-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 34px rgba(0,0,0,0.10);
}
.fhr-price-card.fhr-status-full,
.fhr-price-card.fhr-status-reserved,
.fhr-price-card.fhr-status-pending { opacity: 0.82; }
.fhr-price-card.fhr-status-full:hover,
.fhr-price-card.fhr-status-reserved:hover,
.fhr-price-card.fhr-status-pending:hover {
    transform: none;
    box-shadow: 0 3px 12px rgba(0,0,0,0.06);
}

/* ─── Corner ribbon ─── */
.fhr-ribbon {
    position: absolute;
    top: 0;
    left: 0;
    width: 130px;
    height: 130px;
    overflow: hidden;
    z-index: 3;
    pointer-events: none;
}
.fhr-ribbon span {
    position: absolute;
    top: 26px;
    left: -36px;
    width: 160px;
    transform: rotate(-45deg);
    text-align: center;
    font-size: .68em;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #fff;
    padding: 5px 0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.25);
    text-transform: uppercase;
}
.fhr-ribbon-available span { background: #27ae60; }
.fhr-ribbon-limited   span { background: #e74c3c; }
.fhr-ribbon-full      span { background: #7f8c8d; }
.fhr-ribbon-reserved  span { background: #8e44ad; }
.fhr-ribbon-pending   span { background: #bdc3c7; color: #444; }

/* ─── Brown header ─── */
.fhr-card-header {
    background: linear-gradient(135deg, #c08552 0%, #b5784a 100%);
    color: #fff;
    padding: 26px 22px 20px;
    text-align: center;
    min-height: 96px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.fhr-card-hostel {
    font-size: 1.25em;
    font-weight: 800;
    margin: 0 0 4px;
    line-height: 1.25;
    color: #fff;
}
.fhr-card-room-type {
    font-size: .92em;
    font-weight: 500;
    opacity: 0.95;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ─── Body ─── */
.fhr-card-body {
    padding: 24px 22px 26px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.fhr-card-price {
    text-align: center;
    margin-bottom: 6px;
    line-height: 1;
}
.fhr-price-symbol {
    font-size: 1.15em;
    font-weight: 700;
    color: #555;
    vertical-align: top;
    margin-right: 2px;
    position: relative;
    top: 6px;
}
.fhr-price-amount {
    font-size: 3em;
    font-weight: 800;
    color: #2c2c2c;
    letter-spacing: -0.02em;
}
.fhr-card-notes {
    text-align: center;
    font-size: .82em;
    color: #999;
    font-style: italic;
    margin-bottom: 18px;
}
.fhr-card-price + .fhr-card-features { margin-top: 22px; }

/* ─── Feature rows with dividers ─── */
.fhr-card-features {
    list-style: none;
    padding: 0;
    margin: 14px 0 22px;
    flex: 1;
}
.fhr-card-features li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 4px;
    font-size: .92em;
    color: #444;
    border-bottom: 1px solid #f0f0f0;
}
.fhr-card-features li:last-child { border-bottom: none; }
.fhr-feat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #555;
    flex-shrink: 0;
    width: 24px;
}
.fhr-feat-label { line-height: 1.35; }

/* ─── CTA button ─── */
.fhr-card-cta {
    display: block;
    text-align: center;
    padding: 13px 16px;
    border-radius: 8px;
    font-weight: 800;
    font-size: .92em;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: all .15s ease;
    margin-top: auto;
    color: #fff !important;
}
.fhr-cta-available { background: #27ae60; }
.fhr-cta-available:hover { background: #219150; transform: translateY(-1px); box-shadow: 0 4px 14px rgba(39,174,96,.3); }
.fhr-cta-limited { background: #e74c3c; }
.fhr-cta-limited:hover { background: #cf3c2c; transform: translateY(-1px); box-shadow: 0 4px 14px rgba(231,76,60,.3); }
.fhr-cta-full     { background: #7f8c8d; }
.fhr-cta-reserved { background: #8e44ad; }
.fhr-cta-pending  { background: #bdc3c7; color: #444 !important; }
.fhr-cta-disabled { cursor: not-allowed; pointer-events: none; }

/* ─── Sub-note ─── */
.fhr-card-subnote {
    text-align: center;
    margin-top: 12px;
    font-size: .78em;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #c0392b;
    text-transform: uppercase;
}

/* ─── Footer ─── */
.fhr-prices-footer {
    text-align: center;
    color: #888;
    font-size: .9em;
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid #eee;
    line-height: 1.55;
}

/* ─── Mobile ─── */
@media (max-width: 640px) {
    .fhr-prices-wrap { padding: 16px 0 32px; }
    .fhr-prices-grid { grid-template-columns: 1fr; gap: 20px; max-width: 420px; margin: 0 auto; }
    .fhr-hostel-heading { font-size: 1.35em; }
    .fhr-price-amount { font-size: 2.6em; }
    .fhr-facilities-list { grid-template-columns: 1fr 1fr; gap: 10px 14px; }
    .fhr-facilities { padding: 18px 20px; }
}

/* ── WhatsApp Channel follow button ── */
.fhr-wa-channel {
    background: #e7f7ee;
    border: 1px solid #25D366;
    border-radius: 12px;
    padding: 20px;
    margin: 30px auto 0;
    max-width: 640px;
    text-align: center;
}
.fhr-wa-channel-msg {
    display: block;
    color: #075E54;
    font-weight: 600;
    font-size: 1em;
    margin-bottom: 12px;
}
.fhr-wa-channel-btn {
    display: inline-flex;
    align-items: center;
    background: #25D366;
    color: #fff !important;
    text-decoration: none;
    font-weight: 700;
    padding: 11px 24px;
    border-radius: 8px;
    transition: background .15s ease, transform .15s ease;
}
.fhr-wa-channel-btn:hover { background: #1da851; transform: translateY(-1px); color:#fff !important; }