/*
 * Rental CRM — Shams Al Bosnia Scoped Brand Layer
 * File: assets/css/booking-widget-brand.css
 * Version: 2026-10-27-scoped-safe-v4
 *
 * IMPORTANT:
 * This file is visual-only and scoped to:
 * - homepage booking shortcode widget
 * - availability page
 * - extras page
 * - book-now page
 *
 * It must NOT affect the whole WordPress site, Elementor, admin pages,
 * booking logic, prices, redirects, nonces, or database operations.
 */

/* ==========================================================================
   SCOPED SHAMS TOKENS
   ========================================================================== */

.rcrm-bw,
.rental-crm-booking-widget,
.rcrm-availability-page,
.rcrm-extras-page,
.rcrm-book-now-page {
    --rcrm-bg: var(--sa-bg, #0e0c0b);
    --rcrm-bg2: var(--sa-bg2, #151210);
    --rcrm-card: var(--sa-card, #1c1815);
    --rcrm-input: #151210;
    --rcrm-input-2: #120f0d;

    --rcrm-text: var(--sa-text, #f6f0e6);
    --rcrm-muted: var(--sa-muted, #a89f92);

    --rcrm-border: var(--sa-border, #2e2822);
    --rcrm-border-strong: #4a3b1c;

    --rcrm-gold: var(--sa-gold, #c9a14a);
    --rcrm-gold2: var(--sa-gold2, #e0bd6b);
    --rcrm-gold-text: #1a1307;

    --rcrm-dark-btn: #26211d;
    --rcrm-dark-btn-hover: #322b26;

    --rcrm-radius-card: 16px;
    --rcrm-radius-panel: 16px;
    --rcrm-radius-btn: 8px;
    --rcrm-radius-input: 8px;

    --rcrm-shadow-card: 0 18px 45px rgba(0, 0, 0, .28);
    --rcrm-shadow-panel: 0 24px 60px rgba(0, 0, 0, .45);
    --rcrm-shadow-gold: 0 12px 28px rgba(201, 161, 74, .14);

    --rcrm-head: var(--sa-head, "Playfair Display", Georgia, serif);
    --rcrm-body: var(--sa-body, "Kumbh Sans", system-ui, sans-serif);
}

/* ==========================================================================
   SCOPED BASE
   ========================================================================== */

.rcrm-bw,
.rental-crm-booking-widget,
.rcrm-availability-page,
.rcrm-extras-page,
.rcrm-book-now-page {
    font-family: var(--rcrm-body);
    color: var(--rcrm-text);
}

.rcrm-bw *,
.rental-crm-booking-widget *,
.rcrm-availability-page *,
.rcrm-extras-page *,
.rcrm-book-now-page * {
    box-sizing: border-box;
}

.rcrm-bw h1,
.rcrm-bw h2,
.rcrm-bw h3,
.rcrm-bw h4,
.rental-crm-booking-widget h1,
.rental-crm-booking-widget h2,
.rental-crm-booking-widget h3,
.rental-crm-booking-widget h4,
.rcrm-availability-page h1,
.rcrm-availability-page h2,
.rcrm-availability-page h3,
.rcrm-availability-page h4,
.rcrm-extras-page h1,
.rcrm-extras-page h2,
.rcrm-extras-page h3,
.rcrm-extras-page h4,
.rcrm-book-now-page h1,
.rcrm-book-now-page h2,
.rcrm-book-now-page h3,
.rcrm-book-now-page h4 {
    font-family: var(--rcrm-head) !important;
    color: var(--rcrm-text) !important;
    line-height: 1.15;
}

.rcrm-bw button,
.rcrm-bw input,
.rcrm-bw select,
.rcrm-bw textarea,
.rental-crm-booking-widget button,
.rental-crm-booking-widget input,
.rental-crm-booking-widget select,
.rental-crm-booking-widget textarea,
.rcrm-availability-page button,
.rcrm-availability-page input,
.rcrm-availability-page select,
.rcrm-availability-page textarea,
.rcrm-extras-page button,
.rcrm-extras-page input,
.rcrm-extras-page select,
.rcrm-extras-page textarea,
.rcrm-book-now-page button,
.rcrm-book-now-page input,
.rcrm-book-now-page select,
.rcrm-book-now-page textarea {
    font-family: var(--rcrm-body) !important;
}

.rcrm-bw a,
.rental-crm-booking-widget a,
.rcrm-availability-page a,
.rcrm-extras-page a,
.rcrm-book-now-page a {
    color: var(--rcrm-gold) !important;
    text-decoration: none;
    transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.rcrm-bw a:hover,
.rental-crm-booking-widget a:hover,
.rcrm-availability-page a:hover,
.rcrm-extras-page a:hover,
.rcrm-book-now-page a:hover {
    color: var(--rcrm-gold2) !important;
}

.rcrm-bw ::selection,
.rental-crm-booking-widget ::selection,
.rcrm-availability-page ::selection,
.rcrm-extras-page ::selection,
.rcrm-book-now-page ::selection {
    background: rgba(201, 161, 74, .28);
    color: var(--rcrm-text);
}

.rcrm-bw :focus-visible,
.rental-crm-booking-widget :focus-visible,
.rcrm-availability-page :focus-visible,
.rcrm-extras-page :focus-visible,
.rcrm-book-now-page :focus-visible {
    outline: 2px solid rgba(201, 161, 74, .55) !important;
    outline-offset: 2px;
}

/* ==========================================================================
   HOMEPAGE BOOKING WIDGET
   ========================================================================== */

.rcrm-bw {
    max-width: 1240px;
    margin: 0 auto;
    padding: 24px;
}

.rcrm-bw .rcrm-bw-card {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    padding: 24px !important;
    color: var(--rcrm-text) !important;
}

.rcrm-bw .rcrm-bw-title {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: clamp(24px, 3vw, 30px) !important;
    font-weight: 700 !important;
    letter-spacing: -.01em !important;
    margin: 0 0 22px !important;
}

.rcrm-bw .rcrm-bw-title::after {
    content: "";
    display: block;
    width: 70px;
    height: 1px;
    margin-top: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--rcrm-gold), rgba(201, 161, 74, .18));
    opacity: .9;
}

.rcrm-bw .rcrm-bw-form {
    gap: 14px;
}

.rcrm-bw .rcrm-bw-field > label {
    color: var(--rcrm-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

/* Location button */
.rcrm-bw .rcrm-bw-loc-btn {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-btn) !important;
    color: var(--rcrm-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 12px 14px !important;
    min-height: 48px !important;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease !important;
}

.rcrm-bw .rcrm-bw-loc-btn:hover {
    border-color: var(--rcrm-border-strong) !important;
    background: #171310 !important;
}

.rcrm-bw .rcrm-bw-loc-field.is-open .rcrm-bw-loc-btn {
    border-color: var(--rcrm-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .14) !important;
    background: var(--rcrm-input) !important;
}

.rcrm-bw .rcrm-bw-loc-icon,
.rcrm-bw .rcrm-bw-caret {
    color: var(--rcrm-muted) !important;
}

/* Date + time control */
.rcrm-bw .rcrm-bw-datetime {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-btn) !important;
    overflow: hidden;
    transition: border-color .18s ease, box-shadow .18s ease !important;
}

.rcrm-bw .rcrm-bw-datetime:hover {
    border-color: var(--rcrm-border-strong) !important;
}

.rcrm-bw .rcrm-bw-date-btn,
.rcrm-bw .rcrm-bw-time-btn {
    background: transparent !important;
    color: var(--rcrm-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    min-height: 48px !important;
}

.rcrm-bw .rcrm-bw-date-btn:hover,
.rcrm-bw .rcrm-bw-time-btn:hover {
    background: rgba(255, 255, 255, .03) !important;
}

.rcrm-bw .rcrm-bw-time-btn {
    border-left: 1px solid var(--rcrm-border) !important;
}

/* Main widget CTA */
.rcrm-bw .rcrm-bw-submit {
    background: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    border: 1px solid transparent !important;
    border-radius: var(--rcrm-radius-btn) !important;
    padding: 15px 28px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: .2px !important;
    box-shadow: var(--rcrm-shadow-gold) !important;
    min-height: 48px !important;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.rcrm-bw .rcrm-bw-submit:hover {
    background: var(--rcrm-gold2) !important;
    color: var(--rcrm-gold-text) !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(201, 161, 74, .20) !important;
}

/* ==========================================================================
   LOCATION PANEL
   ========================================================================== */

.rcrm-bw .rcrm-bw-panel {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-panel) !important;
    box-shadow: var(--rcrm-shadow-panel) !important;
    color: var(--rcrm-text) !important;
}

.rcrm-bw .rcrm-bw-panel-search {
    background: var(--rcrm-bg2) !important;
    border-bottom: 1px solid var(--rcrm-border) !important;
}

.rcrm-bw .rcrm-bw-search {
    background: transparent !important;
    color: var(--rcrm-text) !important;
    font-size: 14px !important;
}

.rcrm-bw .rcrm-bw-search::placeholder {
    color: #7a7168 !important;
}

.rcrm-bw .rcrm-bw-panel-close {
    background: #241d18 !important;
    color: var(--rcrm-text) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 50% !important;
}

.rcrm-bw .rcrm-bw-panel-close:hover {
    background: #2d241d !important;
    border-color: var(--rcrm-border-strong) !important;
    color: var(--rcrm-gold) !important;
}

.rcrm-bw .rcrm-bw-panel-body {
    background: var(--rcrm-card) !important;
}

.rcrm-bw .rcrm-bw-panel-list {
    background: var(--rcrm-card) !important;
    border-right: 1px solid var(--rcrm-border) !important;
    scrollbar-color: var(--rcrm-border-strong) var(--rcrm-card);
}

.rcrm-bw .rcrm-bw-group-title {
    color: var(--rcrm-gold) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.rcrm-bw .rcrm-bw-loc-item {
    background: transparent !important;
    color: var(--rcrm-text) !important;
}

.rcrm-bw .rcrm-bw-loc-item:hover,
.rcrm-bw .rcrm-bw-loc-item.is-preview {
    background: rgba(255, 255, 255, .035) !important;
}

.rcrm-bw .rcrm-bw-loc-item.is-selected {
    background: rgba(201, 161, 74, .10) !important;
    box-shadow: inset 3px 0 0 var(--rcrm-gold) !important;
}

.rcrm-bw .rcrm-bw-loc-item-icon {
    color: var(--rcrm-gold) !important;
}

.rcrm-bw .rcrm-bw-loc-item strong {
    color: var(--rcrm-text) !important;
}

.rcrm-bw .rcrm-bw-loc-item small {
    color: var(--rcrm-muted) !important;
}

.rcrm-bw .rcrm-bw-panel-details {
    background: var(--rcrm-bg2) !important;
    color: var(--rcrm-text) !important;
    scrollbar-color: var(--rcrm-border-strong) var(--rcrm-bg2);
}

.rcrm-bw .rcrm-bw-badge {
    border: 1px solid var(--rcrm-border-strong) !important;
    background: rgba(201, 161, 74, .10) !important;
    color: var(--rcrm-gold) !important;
    border-radius: 6px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    padding: 4px 9px !important;
}

.rcrm-bw .rcrm-bw-details-icon {
    color: var(--rcrm-gold) !important;
}

.rcrm-bw .rcrm-bw-panel-details h4 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
}

.rcrm-bw .rcrm-bw-details-addr {
    color: var(--rcrm-muted) !important;
}

.rcrm-bw .rcrm-bw-details-row {
    border-top: 1px solid var(--rcrm-border) !important;
    color: var(--rcrm-muted) !important;
}

.rcrm-bw .rcrm-bw-details-row strong {
    color: var(--rcrm-text) !important;
}

.rcrm-bw .rcrm-bw-empty {
    color: var(--rcrm-muted) !important;
}

/* ==========================================================================
   CALENDAR PANEL
   ========================================================================== */

.rcrm-bw .rcrm-bw-cal,
.rcrm-bw .rcrm-bw-time {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-panel) !important;
    box-shadow: var(--rcrm-shadow-panel) !important;
    color: var(--rcrm-text) !important;
}

.rcrm-bw .rcrm-bw-cal-title {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-weight: 700 !important;
}

.rcrm-bw .rcrm-bw-cal-nav {
    background: var(--rcrm-bg2) !important;
    color: var(--rcrm-text) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-btn) !important;
}

.rcrm-bw .rcrm-bw-cal-nav:hover {
    background: #241d18 !important;
    border-color: var(--rcrm-border-strong) !important;
    color: var(--rcrm-gold) !important;
}

.rcrm-bw .rcrm-bw-cal-week span {
    color: var(--rcrm-muted) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .06em !important;
}

.rcrm-bw .rcrm-bw-cal-day {
    color: var(--rcrm-text) !important;
    border-radius: var(--rcrm-radius-btn) !important;
}

.rcrm-bw .rcrm-bw-cal-day:hover {
    background: rgba(255, 255, 255, .05) !important;
}

.rcrm-bw .rcrm-bw-cal-day.is-disabled,
.rcrm-bw .rcrm-bw-cal-day[disabled] {
    color: #5a524a !important;
}

.rcrm-bw .rcrm-bw-cal-day.is-today {
    box-shadow: inset 0 0 0 1.5px var(--rcrm-border-strong) !important;
}

.rcrm-bw .rcrm-bw-cal-day.is-selected,
.rcrm-bw .rcrm-bw-cal-day[aria-selected="true"] {
    background: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   TIME PANEL
   ========================================================================== */

.rcrm-bw .rcrm-bw-time-grid {
    gap: 8px;
    scrollbar-color: var(--rcrm-border-strong) var(--rcrm-card);
}

.rcrm-bw .rcrm-bw-time-slot,
.rcrm-bw .rcrm-bw-time button {
    background: var(--rcrm-input) !important;
    color: var(--rcrm-text) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-btn) !important;
    font-weight: 700 !important;
}

.rcrm-bw .rcrm-bw-time-slot:hover,
.rcrm-bw .rcrm-bw-time button:hover {
    background: #1b1714 !important;
    border-color: var(--rcrm-border-strong) !important;
}

.rcrm-bw .rcrm-bw-time-slot.is-selected,
.rcrm-bw .rcrm-bw-time button.is-selected,
.rcrm-bw .rcrm-bw-time button[aria-selected="true"] {
    background: var(--rcrm-gold) !important;
    border-color: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   AVAILABILITY PAGE
   ========================================================================== */

.rcrm-availability-page {
    max-width: 1240px;
    margin: 40px auto;
    padding: 0 24px;
    color: var(--rcrm-text);
    font-family: var(--rcrm-body);
}

.rcrm-availability-page .rcrm-availability-header,
.rcrm-availability-page .rcrm-page-header {
    background: radial-gradient(ellipse at 50% 0%, #2a2118 0%, var(--rcrm-bg) 65%) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 20px !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    padding: 48px 24px !important;
    color: var(--rcrm-text) !important;
}

.rcrm-availability-page .rcrm-availability-header h1,
.rcrm-availability-page .rcrm-page-header h1 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: clamp(28px, 4vw, 40px) !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    margin: 0 0 10px !important;
}

.rcrm-availability-page .rcrm-availability-meta,
.rcrm-availability-page .rcrm-page-header p {
    color: var(--rcrm-muted) !important;
    font-size: 14px !important;
    opacity: 1 !important;
    margin: 0 !important;
}

.rcrm-availability-page .rcrm-cars-grid {
    gap: 30px;
}

.rcrm-availability-page .rcrm-car-card,
.rcrm-availability-page .rcrm-vehicle-card {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .22) !important;
    overflow: hidden;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease !important;
}

.rcrm-availability-page .rcrm-car-card:hover,
.rcrm-availability-page .rcrm-vehicle-card:hover {
    transform: translateY(-4px);
    border-color: var(--rcrm-border-strong) !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .34) !important;
}

.rcrm-availability-page .rcrm-car-image,
.rcrm-availability-page .rcrm-vehicle-image {
    background: var(--rcrm-input-2) !important;
}

.rcrm-availability-page .rcrm-car-image img,
.rcrm-availability-page .rcrm-vehicle-image img {
    width: 100%;
    height: auto !important;
    aspect-ratio: 900 / 560;
    object-fit: cover;
    display: block;
}

.rcrm-availability-page .rcrm-car-details,
.rcrm-availability-page .rcrm-vehicle-details {
    padding: 20px !important;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.rcrm-availability-page .rcrm-car-title,
.rcrm-availability-page .rcrm-vehicle-title {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

.rcrm-availability-page .rcrm-car-meta,
.rcrm-availability-page .rcrm-car-meta span,
.rcrm-availability-page .rcrm-vehicle-meta,
.rcrm-availability-page .rcrm-vehicle-meta span {
    color: var(--rcrm-muted) !important;
    font-size: 12px !important;
}

.rcrm-availability-page .rcrm-car-price,
.rcrm-availability-page .rcrm-vehicle-price {
    color: var(--rcrm-gold) !important;
    font-family: var(--rcrm-head) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

.rcrm-availability-page .rcrm-car-price small,
.rcrm-availability-page .rcrm-vehicle-price small {
    color: var(--rcrm-muted) !important;
    font-family: var(--rcrm-body) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

.rcrm-availability-page .rcrm-book-now-btn,
.rcrm-availability-page .rcrm-select-car-btn,
.rcrm-availability-page a[href*="/extras/"],
.rcrm-availability-page a[href*="extras"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 13px 18px !important;
    background: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    border: 1px solid transparent !important;
    border-radius: var(--rcrm-radius-btn) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: .2px !important;
    box-shadow: var(--rcrm-shadow-gold) !important;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.rcrm-availability-page .rcrm-book-now-btn:hover,
.rcrm-availability-page .rcrm-select-car-btn:hover,
.rcrm-availability-page a[href*="/extras/"]:hover,
.rcrm-availability-page a[href*="extras"]:hover {
    background: var(--rcrm-gold2) !important;
    color: var(--rcrm-gold-text) !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(201, 161, 74, .20) !important;
}

.rcrm-availability-page .rcrm-no-cars {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    color: var(--rcrm-muted) !important;
}

.rcrm-availability-page .rcrm-no-cars h2 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
}

.rcrm-availability-page .rcrm-no-cars p {
    color: var(--rcrm-muted) !important;
}

.rcrm-availability-page .rcrm-no-cars a {
    color: var(--rcrm-gold) !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   EXTRAS PAGE
   ========================================================================== */

.rcrm-extras-page {
    max-width: 1240px;
    margin: 40px auto;
    padding: 0 24px;
    color: var(--rcrm-text);
    font-family: var(--rcrm-body);
}

.rcrm-extras-page .rcrm-extras-header {
    background: radial-gradient(ellipse at 50% 0%, #2a2118 0%, var(--rcrm-bg) 65%) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 20px !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    padding: 48px 24px !important;
}

.rcrm-extras-page .rcrm-extras-header h1 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: clamp(28px, 4vw, 40px) !important;
    font-weight: 700 !important;
    margin: 0 0 8px !important;
}

.rcrm-extras-page .rcrm-extras-header p {
    color: var(--rcrm-muted) !important;
    opacity: 1 !important;
    margin: 0 !important;
}

.rcrm-extras-page .rcrm-extras-grid {
    gap: 30px;
}

.rcrm-extras-page .rcrm-extras-list,
.rcrm-extras-page .rcrm-extras-summary {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    color: var(--rcrm-text) !important;
}

.rcrm-extras-page .rcrm-section-title {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border-bottom: 1px solid var(--rcrm-border) !important;
    padding-bottom: 14px !important;
    margin: 0 0 16px !important;
}

.rcrm-extras-page .rcrm-extra-item {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 14px !important;
    color: var(--rcrm-text) !important;
    transition: border-color .18s ease, background .18s ease !important;
}

.rcrm-extras-page .rcrm-extra-item:hover {
    border-color: var(--rcrm-border-strong) !important;
    background: #171310 !important;
}

.rcrm-extras-page .rcrm-extra-item:has(input:checked) {
    border-color: var(--rcrm-gold) !important;
    background: rgba(201, 161, 74, .08) !important;
}

.rcrm-extras-page .rcrm-extra-item input[type="checkbox"] {
    accent-color: var(--rcrm-gold) !important;
    width: 20px !important;
    height: 20px !important;
}

.rcrm-extras-page .rcrm-extra-name {
    color: var(--rcrm-text) !important;
    font-weight: 800 !important;
}

.rcrm-extras-page .rcrm-extra-description {
    color: var(--rcrm-muted) !important;
}

.rcrm-extras-page .rcrm-extra-price {
    color: var(--rcrm-gold) !important;
    font-weight: 800 !important;
}

.rcrm-extras-page .rcrm-extra-price small {
    color: var(--rcrm-muted) !important;
    font-weight: 600 !important;
}

.rcrm-extras-page .rcrm-summary-row {
    border-bottom: 1px solid var(--rcrm-border) !important;
}

.rcrm-extras-page .rcrm-summary-label {
    color: var(--rcrm-muted) !important;
}

.rcrm-extras-page .rcrm-summary-value {
    color: var(--rcrm-text) !important;
    font-weight: 700 !important;
}

/* Override the inline yellow extras total row from extras-page.php */
.rcrm-extras-page .rcrm-summary-row[style] {
    background: rgba(201, 161, 74, .08) !important;
    border: 1px solid var(--rcrm-border-strong) !important;
    border-radius: 12px !important;
}

.rcrm-extras-page .rcrm-summary-row[style] .rcrm-summary-label,
.rcrm-extras-page .rcrm-summary-row[style] .rcrm-summary-value {
    color: var(--rcrm-text) !important;
}

.rcrm-extras-page .rcrm-extras-total {
    background: var(--rcrm-bg2) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 14px !important;
}

.rcrm-extras-page .rcrm-extras-total-label {
    color: var(--rcrm-text) !important;
    font-weight: 800 !important;
}

.rcrm-extras-page .rcrm-extras-total-value {
    color: var(--rcrm-gold) !important;
    font-family: var(--rcrm-head) !important;
    font-weight: 700 !important;
}

.rcrm-extras-page .rcrm-continue-btn {
    background: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    border: 1px solid transparent !important;
    border-radius: var(--rcrm-radius-btn) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: .2px !important;
    box-shadow: var(--rcrm-shadow-gold) !important;
    padding: 15px 28px !important;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.rcrm-extras-page .rcrm-continue-btn:hover {
    background: var(--rcrm-gold2) !important;
    color: var(--rcrm-gold-text) !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(201, 161, 74, .20) !important;
}

.rcrm-extras-page .rcrm-skip-btn {
    background: transparent !important;
    color: var(--rcrm-text) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-btn) !important;
    font-weight: 700 !important;
}

.rcrm-extras-page .rcrm-skip-btn:hover {
    border-color: var(--rcrm-gold) !important;
    color: var(--rcrm-gold) !important;
    background: rgba(201, 161, 74, .06) !important;
}

/* ==========================================================================
   BOOK NOW PAGE
   ========================================================================== */

.rcrm-book-now-page {
    max-width: 1240px;
    margin: 40px auto;
    padding: 0 24px;
    color: var(--rcrm-text);
    font-family: var(--rcrm-body);
}

.rcrm-book-now-page .rcrm-book-now-header {
    background: radial-gradient(ellipse at 50% 0%, #2a2118 0%, var(--rcrm-bg) 65%) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 20px !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    padding: 48px 24px !important;
    margin-bottom: 32px !important;
    text-align: center;
}

.rcrm-book-now-page .rcrm-book-now-header h1 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: clamp(28px, 4vw, 40px) !important;
    font-weight: 700 !important;
    margin: 0 0 8px !important;
}

.rcrm-book-now-page .rcrm-book-now-header p {
    color: var(--rcrm-muted) !important;
    opacity: 1 !important;
    margin: 0 !important;
}

.rcrm-book-now-page .rcrm-book-now-grid {
    gap: 30px;
}

.rcrm-book-now-page .rcrm-booking-summary,
.rcrm-book-now-page .rcrm-booking-form-card,
.rcrm-book-now-page .rcrm-payment-box {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    color: var(--rcrm-text) !important;
}

.rcrm-book-now-page .rcrm-section-title {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border-bottom: 1px solid var(--rcrm-border) !important;
    padding-bottom: 14px !important;
    margin: 0 0 16px !important;
}

.rcrm-book-now-page .rcrm-car-summary {
    border-bottom: 1px solid var(--rcrm-border) !important;
}

.rcrm-book-now-page .rcrm-car-summary img {
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 12px !important;
    background: var(--rcrm-input-2) !important;
}

.rcrm-book-now-page .rcrm-car-info h3 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    font-weight: 700 !important;
}

.rcrm-book-now-page .rcrm-car-meta {
    color: var(--rcrm-muted) !important;
}

.rcrm-book-now-page .rcrm-booking-details {
    border-bottom: 1px solid var(--rcrm-border) !important;
}

.rcrm-book-now-page .rcrm-detail-row {
    border-bottom: 1px solid var(--rcrm-border) !important;
}

.rcrm-book-now-page .rcrm-detail-row:last-child {
    border-bottom: none !important;
}

.rcrm-book-now-page .rcrm-detail-label {
    color: var(--rcrm-muted) !important;
}

.rcrm-book-now-page .rcrm-detail-value {
    color: var(--rcrm-text) !important;
    font-weight: 700 !important;
}

.rcrm-book-now-page .rcrm-extras-list {
    background: rgba(201, 161, 74, .08) !important;
    border: 1px solid var(--rcrm-border-strong) !important;
    border-radius: 12px !important;
}

.rcrm-book-now-page .rcrm-extras-list strong {
    color: var(--rcrm-gold) !important;
}

.rcrm-book-now-page .rcrm-extra-item {
    color: var(--rcrm-text) !important;
    font-weight: 650 !important;
}

.rcrm-book-now-page .rcrm-total-row {
    background: var(--rcrm-bg2) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 12px !important;
}

.rcrm-book-now-page .rcrm-total-label {
    color: var(--rcrm-text) !important;
    font-weight: 800 !important;
}

.rcrm-book-now-page .rcrm-total-value {
    color: var(--rcrm-gold) !important;
    font-family: var(--rcrm-head) !important;
    font-weight: 700 !important;
}

.rcrm-book-now-page #rcrm-show-breakdown {
    color: var(--rcrm-gold) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

.rcrm-book-now-page #rcrm-show-breakdown:hover {
    color: var(--rcrm-gold2) !important;
    text-decoration: underline !important;
}

/* Form fields */
.rcrm-book-now-page .rcrm-form-field label {
    color: var(--rcrm-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.rcrm-book-now-page .rcrm-form-field input,
.rcrm-book-now-page .rcrm-form-field select,
.rcrm-book-now-page .rcrm-form-field textarea,
.rcrm-book-now-page input[type="text"],
.rcrm-book-now-page input[type="email"],
.rcrm-book-now-page input[type="tel"],
.rcrm-book-now-page input[type="date"],
.rcrm-book-now-page input[type="number"],
.rcrm-book-now-page select,
.rcrm-book-now-page textarea {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-input) !important;
    color: var(--rcrm-text) !important;
    font-size: 14px !important;
    padding: 12px !important;
    color-scheme: dark !important;
}

.rcrm-book-now-page .rcrm-form-field input::placeholder,
.rcrm-book-now-page .rcrm-form-field textarea::placeholder,
.rcrm-book-now-page input::placeholder,
.rcrm-book-now-page textarea::placeholder {
    color: #7a7168 !important;
}

.rcrm-book-now-page .rcrm-form-field input:focus,
.rcrm-book-now-page .rcrm-form-field select:focus,
.rcrm-book-now-page .rcrm-form-field textarea:focus,
.rcrm-book-now-page input:focus,
.rcrm-book-now-page select:focus,
.rcrm-book-now-page textarea:focus {
    border-color: var(--rcrm-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    outline: none !important;
    background: #171310 !important;
}

.rcrm-book-now-page .rcrm-form-field small {
    color: var(--rcrm-muted) !important;
}

/* Additional driver / border crossing sections */
.rcrm-book-now-page .rcrm-extra-form-section {
    background: rgba(201, 161, 74, .07) !important;
    border: 1px solid var(--rcrm-border-strong) !important;
    border-radius: 14px !important;
}

.rcrm-book-now-page .rcrm-extra-form-title {
    color: var(--rcrm-gold) !important;
    font-family: var(--rcrm-head) !important;
    font-weight: 700 !important;
}

.rcrm-book-now-page .rcrm-extra-form-description {
    color: var(--rcrm-muted) !important;
}

/* Consent */
.rcrm-book-now-page .rcrm-checkbox-field label {
    color: var(--rcrm-text) !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.rcrm-book-now-page .rcrm-checkbox-field a {
    color: var(--rcrm-gold) !important;
    font-weight: 700 !important;
}

.rcrm-book-now-page .rcrm-checkbox-field input[type="checkbox"] {
    accent-color: var(--rcrm-gold) !important;
    width: 20px !important;
    height: 20px !important;
}

/* Payment method box */
.rcrm-book-now-page .rcrm-payment-title {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
    border-bottom: 1px solid var(--rcrm-border) !important;
    padding-bottom: 14px !important;
    margin: 0 0 20px !important;
}

.rcrm-book-now-page .rcrm-payment-options {
    gap: 16px;
}

.rcrm-book-now-page .rcrm-payment-option {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 14px !important;
    color: var(--rcrm-text) !important;
    transition: border-color .18s ease, background .18s ease !important;
}

.rcrm-book-now-page .rcrm-payment-option:hover {
    border-color: var(--rcrm-border-strong) !important;
    background: #171310 !important;
}

.rcrm-book-now-page .rcrm-payment-option:has(input:checked) {
    border-color: var(--rcrm-gold) !important;
    background: rgba(201, 161, 74, .09) !important;
    box-shadow: 0 0 0 1px rgba(201, 161, 74, .18) !important;
}

.rcrm-book-now-page .rcrm-payment-option input[type="radio"] {
    accent-color: var(--rcrm-gold) !important;
}

.rcrm-book-now-page .rcrm-payment-option strong {
    color: var(--rcrm-text) !important;
}

.rcrm-book-now-page .rcrm-payment-option.selected strong {
    color: var(--rcrm-gold) !important;
}

.rcrm-book-now-page .rcrm-payment-option p {
    color: var(--rcrm-muted) !important;
}

/* jQuery may still add inline selected styles */
.rcrm-book-now-page .rcrm-payment-option.selected {
    border-color: var(--rcrm-gold) !important;
    background: rgba(201, 161, 74, .09) !important;
    box-shadow: 0 0 0 1px rgba(201, 161, 74, .18) !important;
}

/* Submit buttons */
.rcrm-book-now-page .rcrm-submit-btn,
.rcrm-book-now-page #btn-pay-card,
.rcrm-book-now-page #btn-confirm-pickup {
    border-radius: var(--rcrm-radius-btn) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: .2px !important;
    padding: 15px 28px !important;
    min-height: 48px !important;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.rcrm-book-now-page #btn-pay-card {
    background: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    border: 1px solid transparent !important;
    box-shadow: var(--rcrm-shadow-gold) !important;
}

.rcrm-book-now-page #btn-pay-card:hover {
    background: var(--rcrm-gold2) !important;
    color: var(--rcrm-gold-text) !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(201, 161, 74, .20) !important;
}

.rcrm-book-now-page #btn-confirm-pickup {
    background: var(--rcrm-dark-btn) !important;
    color: var(--rcrm-text) !important;
    border: 1px solid var(--rcrm-border) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .22) !important;
}

.rcrm-book-now-page #btn-confirm-pickup:hover {
    background: var(--rcrm-dark-btn-hover) !important;
    border-color: var(--rcrm-border-strong) !important;
    color: var(--rcrm-text) !important;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(0, 0, 0, .28) !important;
}

.rcrm-book-now-page .rcrm-payment-actions p {
    color: var(--rcrm-muted) !important;
}

/* ==========================================================================
   PRICE BREAKDOWN MODAL
   ========================================================================== */

#rcrm-breakdown-modal > div {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .55) !important;
    color: var(--rcrm-text) !important;
}

#rcrm-breakdown-modal h3 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
}

#rcrm-breakdown-modal button {
    color: var(--rcrm-muted) !important;
}

#rcrm-breakdown-modal button:hover {
    color: var(--rcrm-gold) !important;
}

#rcrm-breakdown-modal div[style*="border-bottom"] {
    border-bottom-color: var(--rcrm-border) !important;
}

#rcrm-breakdown-modal span {
    color: var(--rcrm-text) !important;
}

#rcrm-breakdown-modal span[style*="#059669"],
#rcrm-breakdown-modal div[style*="#059669"] {
    color: var(--rcrm-gold) !important;
}

/* ==========================================================================
   SELECT2 — SCOPED TO BOOK NOW WHERE POSSIBLE
   ========================================================================== */

.rcrm-book-now-page .select2-container--default .select2-selection--single {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-input) !important;
    height: 46px !important;
    box-shadow: none !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--rcrm-text) !important;
    line-height: 44px !important;
    padding-left: 12px !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #7a7168 !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: var(--rcrm-muted) transparent transparent transparent !important;
}

.rcrm-book-now-page .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent var(--rcrm-muted) transparent !important;
}

.rcrm-book-now-page .select2-container--default.select2-container--open .select2-selection--single,
.rcrm-book-now-page .select2-container--default .select2-selection--single:focus {
    border-color: var(--rcrm-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
}

.rcrm-book-now-page .select2-dropdown {
    border: 1px solid var(--rcrm-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .45) !important;
    background: var(--rcrm-card) !important;
    color: var(--rcrm-text) !important;
}

.rcrm-book-now-page .select2-search--dropdown {
    background: var(--rcrm-bg2) !important;
    border-bottom: 1px solid var(--rcrm-border) !important;
    padding: 10px !important;
}

.rcrm-book-now-page .select2-search--dropdown .select2-search__field {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-input) !important;
    color: var(--rcrm-text) !important;
    padding: 10px 12px !important;
    color-scheme: dark !important;
}

.rcrm-book-now-page .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--rcrm-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    outline: none !important;
}

.rcrm-book-now-page .select2-results__option {
    padding: 10px 12px !important;
    color: var(--rcrm-text) !important;
    background: transparent !important;
}

.rcrm-book-now-page .select2-results__option--highlighted[aria-selected] {
    background-color: rgba(201, 161, 74, .16) !important;
    color: var(--rcrm-gold) !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__clear {
    color: var(--rcrm-muted) !important;
}

/* ==========================================================================
   LEGACY WIDGET CLASS FALLBACK
   ========================================================================== */

.rental-crm-booking-widget {
    background: var(--rcrm-card) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-card) !important;
    box-shadow: var(--rcrm-shadow-card) !important;
    color: var(--rcrm-text) !important;
}

.rental-crm-booking-widget input,
.rental-crm-booking-widget select {
    background: var(--rcrm-input) !important;
    border: 1px solid var(--rcrm-border) !important;
    border-radius: var(--rcrm-radius-input) !important;
    color: var(--rcrm-text) !important;
    color-scheme: dark !important;
}

.rental-crm-booking-widget input:focus,
.rental-crm-booking-widget select:focus {
    border-color: var(--rcrm-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    outline: none !important;
}

.rental-crm-booking-widget button {
    background: var(--rcrm-gold) !important;
    color: var(--rcrm-gold-text) !important;
    border: 1px solid transparent !important;
    border-radius: var(--rcrm-radius-btn) !important;
    font-weight: 800 !important;
}

.rental-crm-booking-widget button:hover {
    background: var(--rcrm-gold2) !important;
    color: var(--rcrm-gold-text) !important;
}

.rcrm-step h3 {
    color: var(--rcrm-text) !important;
    font-family: var(--rcrm-head) !important;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 768px) {
    .rcrm-bw,
    .rcrm-availability-page,
    .rcrm-extras-page,
    .rcrm-book-now-page {
        padding: 12px;
    }

    .rcrm-bw .rcrm-bw-card {
        padding: 18px !important;
        border-radius: 14px !important;
    }

    .rcrm-bw .rcrm-bw-submit {
        width: 100%;
        padding: 15px 18px !important;
    }

    .rcrm-book-now-page .rcrm-book-now-header,
    .rcrm-availability-page .rcrm-availability-header,
    .rcrm-availability-page .rcrm-page-header,
    .rcrm-extras-page .rcrm-extras-header {
        padding: 28px 18px !important;
        border-radius: 16px !important;
    }

    .rcrm-book-now-page .rcrm-booking-summary,
    .rcrm-book-now-page .rcrm-booking-form-card,
    .rcrm-book-now-page .rcrm-payment-box,
    .rcrm-availability-page .rcrm-car-card,
    .rcrm-availability-page .rcrm-vehicle-card,
    .rcrm-extras-page .rcrm-extras-list,
    .rcrm-extras-page .rcrm-extras-summary {
        border-radius: 14px !important;
    }

    .rcrm-book-now-page .rcrm-payment-options {
        grid-template-columns: 1fr;
    }

    .rcrm-book-now-page #btn-pay-card,
    .rcrm-book-now-page #btn-confirm-pickup {
        width: 100% !important;
        padding: 15px 20px !important;
    }
}

/* ==========================================================================
   SELECT2 COUNTRY DROPDOWN FIX — BOOK NOW PAGE
   Visual-only. Forces dark Shams palette and readable country names.
   ========================================================================== */

.rcrm-book-now-page select,
.rcrm-book-now-page .select2-container--default .select2-selection--single,
.rcrm-book-now-page .select2-container .select2-selection--single {
    background: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    color-scheme: dark !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single {
    height: 46px !important;
    line-height: 44px !important;
    padding: 0 !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #f6f0e6 !important;
    line-height: 44px !important;
    padding-left: 12px !important;
    padding-right: 28px !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #7a7168 !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__clear {
    color: #a89f92 !important;
    font-weight: 700 !important;
    margin-right: 24px !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
    right: 8px !important;
}

.rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #a89f92 transparent transparent transparent !important;
}

.rcrm-book-now-page .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #a89f92 transparent !important;
}

.rcrm-book-now-page .select2-container--default.select2-container--open .select2-selection--single,
.rcrm-book-now-page .select2-container--default .select2-selection--single:focus {
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    outline: none !important;
}

/* Dropdown container */
.rcrm-book-now-page .select2-dropdown,
.rcrm-book-now-page form .select2-dropdown,
.rcrm-book-now-page .select2-container--open .select2-dropdown {
    background: #1c1815 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .45) !important;
    color: #f6f0e6 !important;
    overflow: hidden;
}

/* Search box inside dropdown */
.rcrm-book-now-page .select2-search--dropdown {
    background: #151210 !important;
    border-bottom: 1px solid #2e2822 !important;
    padding: 10px !important;
}

.rcrm-book-now-page .select2-search--dropdown .select2-search__field {
    background: #120f0d !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    font-size: 14px !important;
    padding: 10px 12px !important;
    color-scheme: dark !important;
    outline: none !important;
}

.rcrm-book-now-page .select2-search--dropdown .select2-search__field::placeholder {
    color: #7a7168 !important;
    opacity: 1 !important;
}

.rcrm-book-now-page .select2-search--dropdown .select2-search__field:focus {
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
}

/* Results area */
.rcrm-book-now-page .select2-results,
.rcrm-book-now-page .select2-results__options {
    background: #1c1815 !important;
    color: #f6f0e6 !important;
}

.rcrm-book-now-page .select2-results {
    scrollbar-color: #4a3b1c #1c1815;
}

/* Individual country options */
.rcrm-book-now-page .select2-results__option,
.rcrm-book-now-page .select2-results__option--highlighted,
.rcrm-book-now-page .select2-results__option[aria-selected],
.rcrm-book-now-page .select2-results__option span {
    background: #1c1815 !important;
    color: #f6f0e6 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    padding: 10px 12px !important;
}

/* Hover / keyboard highlighted country */
.rcrm-book-now-page .select2-results__option--highlighted[aria-selected],
.rcrm-book-now-page .select2-results__option:hover,
.rcrm-book-now-page .select2-results__option.select2-results__option--highlighted {
    background: rgba(201, 161, 74, .18) !important;
    color: #e0bd6b !important;
}

/* Currently selected country */
.rcrm-book-now-page .select2-results__option[aria-selected="true"] {
    background: rgba(201, 161, 74, .24) !important;
    color: #c9a14a !important;
    font-weight: 800 !important;
}

/* No results / loading message */
.rcrm-book-now-page .select2-results__message,
.rcrm-book-now-page .select2-results__option.select2-results__message {
    background: #1c1815 !important;
    color: #a89f92 !important;
    font-size: 13px !important;
    padding: 12px !important;
}

/* Ensure dropdown text is never inherited as white-on-white */
.rcrm-book-now-page .select2-dropdown *,
.rcrm-book-now-page form .select2-dropdown * {
    color: inherit;
}

.rcrm-book-now-page .select2-dropdown a,
.rcrm-book-now-page form .select2-dropdown a {
    color: #f6f0e6 !important;
}

/* Mobile safety */
@media (max-width: 768px) {
    .rcrm-book-now-page .select2-container--default .select2-selection--single,
    .rcrm-book-now-page .select2-container--default .select2-selection--single .select2-selection__rendered {
        font-size: 16px !important;
    }

    .rcrm-book-now-page .select2-dropdown,
    .rcrm-book-now-page form .select2-dropdown {
        max-width: calc(100vw - 24px) !important;
    }
}


/* ==========================================================================
   CUSTOMER PORTAL PHASE 1 — SHAMS AL BOSNIA VISUAL REBRAND
   File: assets/css/booking-widget-brand.css
   Scope: .rcrm-portal-container only
   Purpose: Visual-only rebrand of customer booking portal.
   Does not change lookup logic, nonces, database queries, emails, or invoices.
   ========================================================================== */

.rcrm-portal-container {
    --sa-bg: #0e0c0b;
    --sa-bg2: #151210;
    --sa-card: #1c1815;
    --sa-input: #151210;
    --sa-input-2: #120f0d;

    --sa-text: #f6f0e6;
    --sa-muted: #a89f92;

    --sa-border: #2e2822;
    --sa-border-strong: #4a3b1c;

    --sa-gold: #c9a14a;
    --sa-gold2: #e0bd6b;
    --sa-gold-text: #1a1307;

    --sa-dark-btn: #26211d;
    --sa-dark-btn-hover: #322b26;

    --sa-radius-card: 18px;
    --sa-radius-panel: 24px;
    --sa-radius-btn: 8px;
    --sa-radius-input: 8px;

    --sa-shadow-card: 0 18px 45px rgba(0, 0, 0, .28);
    --sa-shadow-panel: 0 24px 60px rgba(0, 0, 0, .45);
    --sa-shadow-gold: 0 12px 28px rgba(201, 161, 74, .14);

    --sa-head: "Playfair Display", Georgia, serif;
    --sa-body: "Kumbh Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    max-width: 1040px !important;
    margin: 48px auto !important;
    padding: 28px !important;
    background: radial-gradient(ellipse at 50% 0%, #221b15 0%, var(--sa-bg) 68%) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: var(--sa-radius-panel) !important;
    box-shadow: var(--sa-shadow-panel) !important;
    color: var(--sa-text) !important;
    font-family: var(--sa-body) !important;
    line-height: 1.55 !important;
}

.rcrm-portal-container *,
.rcrm-portal-container *::before,
.rcrm-portal-container *::after {
    box-sizing: border-box !important;
}

.rcrm-portal-container h1,
.rcrm-portal-container h2,
.rcrm-portal-container h3,
.rcrm-portal-container h4 {
    font-family: var(--sa-head) !important;
    color: var(--sa-text) !important;
    line-height: 1.18 !important;
    letter-spacing: -.01em !important;
}

.rcrm-portal-container p {
    color: var(--sa-muted) !important;
    margin: 0 0 12px !important;
}

.rcrm-portal-container a {
    color: var(--sa-gold) !important;
    text-decoration: none !important;
    transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease !important;
}

.rcrm-portal-container a:hover,
.rcrm-portal-container a:focus {
    color: var(--sa-gold2) !important;
    text-decoration: none !important;
}

.rcrm-portal-container ::selection {
    background: rgba(201, 161, 74, .28) !important;
    color: var(--sa-text) !important;
}

.rcrm-portal-container :focus-visible {
    outline: 2px solid rgba(201, 161, 74, .55) !important;
    outline-offset: 2px !important;
}

/* --------------------------------------------------------------------------
   PORTAL CARD
   -------------------------------------------------------------------------- */

.rcrm-portal-card {
    width: 100% !important;
    background: var(--sa-card) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: var(--sa-radius-card) !important;
    box-shadow: var(--sa-shadow-card) !important;
    padding: 32px !important;
    color: var(--sa-text) !important;
    overflow: hidden !important;
}

/* Login card should be narrower. */
.rcrm-portal-card:not(.rcrm-booking-details) {
    max-width: 620px !important;
    margin: 0 auto !important;
}

/* Booking details card can be wider. */
.rcrm-portal-card.rcrm-booking-details {
    max-width: 980px !important;
    margin: 0 auto !important;
}

.rcrm-portal-title {
    margin: 0 0 10px !important;
    color: var(--sa-text) !important;
    font-family: var(--sa-head) !important;
    font-size: clamp(24px, 3vw, 32px) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: -.01em !important;
}

.rcrm-portal-title::after {
    content: "";
    display: block;
    width: 68px;
    height: 1px;
    margin-top: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--sa-gold), rgba(201, 161, 74, .18));
    opacity: .9;
}

.rcrm-portal-subtitle {
    margin: 0 0 24px !important;
    color: var(--sa-muted) !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* --------------------------------------------------------------------------
   ERROR MESSAGE
   -------------------------------------------------------------------------- */

.rcrm-portal-error {
    background: rgba(239, 68, 68, .12) !important;
    border: 1px solid rgba(239, 68, 68, .35) !important;
    color: #fecaca !important;
    padding: 13px 15px !important;
    border-radius: 12px !important;
    margin: 0 0 20px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

/* --------------------------------------------------------------------------
   PORTAL FORM
   -------------------------------------------------------------------------- */

.rcrm-portal-form {
    display: block !important;
}

.rcrm-form-group {
    margin-bottom: 20px !important;
}

.rcrm-form-group label {
    display: block !important;
    margin-bottom: 8px !important;
    color: var(--sa-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    line-height: 1.3 !important;
}

.rcrm-form-group input,
.rcrm-portal-container input[type="text"],
.rcrm-portal-container input[type="email"],
.rcrm-portal-container input[type="tel"],
.rcrm-portal-container input[type="date"],
.rcrm-portal-container input[type="number"],
.rcrm-portal-container select,
.rcrm-portal-container textarea {
    width: 100% !important;
    padding: 12px 14px !important;
    background: var(--sa-input) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: var(--sa-radius-input) !important;
    color: var(--sa-text) !important;
    font-family: var(--sa-body) !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    color-scheme: dark !important;
    box-shadow: none !important;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}

.rcrm-form-group input::placeholder,
.rcrm-portal-container input::placeholder,
.rcrm-portal-container textarea::placeholder {
    color: #7a7168 !important;
    opacity: 1 !important;
}

.rcrm-form-group input:focus,
.rcrm-portal-container input:focus,
.rcrm-portal-container select:focus,
.rcrm-portal-container textarea:focus {
    outline: none !important;
    border-color: var(--sa-gold) !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    background: #171310 !important;
    color: var(--sa-text) !important;
}

/* --------------------------------------------------------------------------
   BUTTONS
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-btn-primary,
.rcrm-portal-container button[type="submit"],
.rcrm-portal-container input[type="submit"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 14px 22px !important;
    background: var(--sa-gold) !important;
    color: var(--sa-gold-text) !important;
    border: 1px solid transparent !important;
    border-radius: var(--sa-radius-btn) !important;
    font-family: var(--sa-body) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: .2px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    box-shadow: var(--sa-shadow-gold) !important;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.rcrm-portal-container .rcrm-btn-primary:hover,
.rcrm-portal-container button[type="submit"]:hover,
.rcrm-portal-container input[type="submit"]:hover {
    background: var(--sa-gold2) !important;
    color: var(--sa-gold-text) !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(201, 161, 74, .20) !important;
}

.rcrm-portal-container .rcrm-btn-primary:focus-visible,
.rcrm-portal-container button[type="submit"]:focus-visible,
.rcrm-portal-container input[type="submit"]:focus-visible {
    outline: 2px solid rgba(201, 161, 74, .55) !important;
    outline-offset: 2px !important;
}

.rcrm-portal-container .rcrm-btn-secondary,
.rcrm-portal-container a.rcrm-btn-secondary {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    padding: 12px 18px !important;
    background: var(--sa-dark-btn) !important;
    color: var(--sa-text) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: var(--sa-radius-btn) !important;
    font-family: var(--sa-body) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .22) !important;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
}

.rcrm-portal-container .rcrm-btn-secondary:hover,
.rcrm-portal-container a.rcrm-btn-secondary:hover {
    background: var(--sa-dark-btn-hover) !important;
    border-color: var(--sa-border-strong) !important;
    color: var(--sa-text) !important;
    transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   BOOKING DETAILS HEADER
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-booking-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    margin-bottom: 18px !important;
}

.rcrm-portal-container .rcrm-booking-header .rcrm-portal-title {
    margin-bottom: 0 !important;
}

.rcrm-portal-container .rcrm-booking-header .rcrm-portal-title::after {
    display: none !important;
}

/* --------------------------------------------------------------------------
   STATUS BADGES
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 12px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .02em !important;
    border: 1px solid transparent !important;
    background: rgba(255, 255, 255, .06) !important;
    color: var(--sa-text) !important;
}

.rcrm-portal-container .rcrm-badge-pending {
    background: rgba(201, 161, 74, .14) !important;
    border-color: var(--sa-border-strong) !important;
    color: var(--sa-gold2) !important;
}

.rcrm-portal-container .rcrm-badge-confirmed {
    background: rgba(34, 197, 94, .14) !important;
    border-color: rgba(34, 197, 94, .35) !important;
    color: #86efac !important;
}

.rcrm-portal-container .rcrm-badge-completed {
    background: rgba(59, 130, 246, .14) !important;
    border-color: rgba(59, 130, 246, .35) !important;
    color: #93c5fd !important;
}

.rcrm-portal-container .rcrm-badge-cancelled {
    background: rgba(239, 68, 68, .12) !important;
    border-color: rgba(239, 68, 68, .35) !important;
    color: #fca5a5 !important;
}

/* --------------------------------------------------------------------------
   BOOKING REFERENCE BOX
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-booking-ref {
    background: var(--sa-bg2) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    margin-bottom: 24px !important;
    color: var(--sa-text) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

.rcrm-portal-container .rcrm-booking-ref strong {
    color: var(--sa-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

/* --------------------------------------------------------------------------
   SECTIONS
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-section {
    margin-bottom: 24px !important;
    padding-bottom: 24px !important;
    border-bottom: 1px solid var(--sa-border) !important;
}

.rcrm-portal-container .rcrm-section:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.rcrm-portal-container .rcrm-section-title {
    margin: 0 0 14px !important;
    color: var(--sa-text) !important;
    font-family: var(--sa-head) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid var(--sa-border) !important;
}

/* --------------------------------------------------------------------------
   INFO GRID
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-info-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 14px !important;
}

.rcrm-portal-container .rcrm-info-grid > div {
    background: var(--sa-bg2) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    color: var(--sa-text) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.rcrm-portal-container .rcrm-info-grid strong {
    display: block !important;
    margin-bottom: 4px !important;
    color: var(--sa-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    line-height: 1.3 !important;
}

.rcrm-portal-container .rcrm-info-grid small {
    display: block !important;
    margin-top: 4px !important;
    color: var(--sa-muted) !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

/* --------------------------------------------------------------------------
   VEHICLE BLOCK
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-vehicle-info {
    background: var(--sa-bg2) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    color: var(--sa-text) !important;
}

.rcrm-portal-container .rcrm-vehicle-name {
    margin-bottom: 8px !important;
    color: var(--sa-text) !important;
    font-family: var(--sa-head) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.rcrm-portal-container .rcrm-vehicle-year {
    color: var(--sa-muted) !important;
    font-family: var(--sa-body) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    margin-left: 6px !important;
}

.rcrm-portal-container .rcrm-vehicle-details {
    margin-bottom: 8px !important;
    color: var(--sa-muted) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.rcrm-portal-container .rcrm-vehicle-plate {
    color: var(--sa-text) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

.rcrm-portal-container .rcrm-vehicle-plate strong {
    color: var(--sa-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

/* --------------------------------------------------------------------------
   PAYMENT TOTAL
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-payment-total {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    background: rgba(201, 161, 74, .08) !important;
    border: 1px solid var(--sa-border-strong) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    color: var(--sa-text) !important;
}

.rcrm-portal-container .rcrm-payment-total span:first-child {
    color: var(--sa-muted) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
}

.rcrm-portal-container .rcrm-total-amount {
    color: var(--sa-gold) !important;
    font-family: var(--sa-head) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
}

/* --------------------------------------------------------------------------
   NOTES
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-notes {
    background: rgba(201, 161, 74, .08) !important;
    border: 1px solid var(--sa-border-strong) !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    color: var(--sa-text) !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* --------------------------------------------------------------------------
   INVOICE
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-invoice-info {
    background: var(--sa-bg2) !important;
    border: 1px solid var(--sa-border) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    color: var(--sa-text) !important;
}

.rcrm-portal-container .rcrm-invoice-info > div {
    margin-bottom: 8px !important;
    color: var(--sa-text) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

.rcrm-portal-container .rcrm-invoice-info strong {
    color: var(--sa-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.rcrm-portal-container .rcrm-invoice-actions {
    margin-top: 12px !important;
}

/* --------------------------------------------------------------------------
   PORTAL ACTIONS
   -------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-portal-actions {
    margin-top: 24px !important;
    text-align: center !important;
}

.rcrm-portal-container .rcrm-portal-actions .rcrm-btn-secondary {
    width: auto !important;
    min-width: 220px !important;
}

/* --------------------------------------------------------------------------
   MOBILE
   -------------------------------------------------------------------------- */

@media (max-width: 768px) {
    .rcrm-portal-container {
        margin: 24px 12px !important;
        padding: 18px !important;
        border-radius: 18px !important;
    }

    .rcrm-portal-card {
        padding: 22px 18px !important;
        border-radius: 16px !important;
    }

    .rcrm-portal-title {
        font-size: 24px !important;
    }

    .rcrm-portal-container .rcrm-booking-header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .rcrm-portal-container .rcrm-info-grid {
        grid-template-columns: 1fr !important;
    }

    .rcrm-portal-container .rcrm-payment-total {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .rcrm-portal-container .rcrm-total-amount {
        font-size: 22px !important;
    }

    .rcrm-portal-container .rcrm-portal-actions .rcrm-btn-secondary {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* ==========================================================================
   CUSTOMER PORTAL PHASE 2B — SECURE EDIT DETAILS
   Visual-only.
   ========================================================================== */

.rcrm-portal-manage-card {
    max-width: 860px !important;
}

.rcrm-portal-notice {
    margin: 0 0 20px !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    border: 1px solid transparent !important;
}

.rcrm-portal-notice--success {
    background: rgba(34, 197, 94, .12) !important;
    border-color: rgba(34, 197, 94, .35) !important;
    color: #86efac !important;
}

.rcrm-portal-notice--error {
    background: rgba(239, 68, 68, .12) !important;
    border-color: rgba(239, 68, 68, .35) !important;
    color: #fca5a5 !important;
}

.rcrm-portal-notice--info {
    background: rgba(201, 161, 74, .10) !important;
    border-color: #4a3b1c !important;
    color: #e0bd6b !important;
}

.rcrm-portal-edit-form {
    margin-top: 8px !important;
}

.rcrm-portal-edit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.rcrm-portal-edit-field {
    display: block;
}

.rcrm-portal-edit-field label {
    display: block;
    margin-bottom: 8px;
    color: #a89f92;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    line-height: 1.3;
}

.rcrm-portal-edit-field input,
.rcrm-portal-edit-field select,
.rcrm-portal-edit-field textarea {
    width: 100%;
    padding: 12px 14px;
    background: #151210;
    border: 1px solid #2e2822;
    border-radius: 8px;
    color: #f6f0e6;
    font-size: 14px;
    line-height: 1.4;
    color-scheme: dark;
    box-sizing: border-box;
}

.rcrm-portal-edit-field input::placeholder,
.rcrm-portal-edit-field textarea::placeholder {
    color: #7a7168;
    opacity: 1;
}

.rcrm-portal-edit-field input:focus,
.rcrm-portal-edit-field select:focus,
.rcrm-portal-edit-field textarea:focus {
    outline: none;
    border-color: #c9a14a;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16);
    background: #171310;
    color: #f6f0e6;
}

.rcrm-portal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-top: 20px;
}

.rcrm-portal-actions .rcrm-btn-primary,
.rcrm-portal-actions .rcrm-btn-secondary {
    width: auto;
    min-width: 190px;
}

@media (max-width: 768px) {
    .rcrm-portal-edit-grid {
        grid-template-columns: 1fr;
    }

    .rcrm-portal-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .rcrm-portal-actions .rcrm-btn-primary,
    .rcrm-portal-actions .rcrm-btn-secondary {
        width: 100%;
        min-width: 0;
    }
}

/* ==========================================================================
   CUSTOMER PORTAL PHASE 2B CORRECTION — EDIT BUTTON INSIDE DETAILS VIEW
   Visual-only.
   ========================================================================== */

.rcrm-portal-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin: 0 0 24px !important;
}

.rcrm-portal-inline-actions .rcrm-btn-primary,
.rcrm-portal-inline-actions .rcrm-btn-secondary {
    width: auto !important;
    min-width: 190px !important;
}

.rcrm-btn-edit-booking {
    letter-spacing: .2px !important;
}

@media (max-width: 768px) {
    .rcrm-portal-inline-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .rcrm-portal-inline-actions .rcrm-btn-primary,
    .rcrm-portal-inline-actions .rcrm-btn-secondary {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* ==========================================================================
   CUSTOMER PORTAL COUNTRY SELECT2 DARK FIX — STRONG VERSION
   Visual-only.
   Forces Select2 + native fallback to follow Shams dark/gold styling.
   ========================================================================== */

.rcrm-portal-container,
.rcrm-portal-manage-card,
.rcrm-portal-select2-container,
.rcrm-portal-container .select2-container,
.rcrm-portal-container .select2-dropdown,
.rcrm-portal-container form .select2-dropdown,
.rcrm-portal-container .select2-container--open .select2-dropdown {
    color-scheme: dark !important;
}

/* Native select fallback */
.rcrm-portal-container select.rcrm-portal-country-select,
.rcrm-portal-country-select {
    width: 100% !important;
    padding: 12px 14px !important;
    background-color: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    font-family: "Kumbh Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    color-scheme: dark !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

.rcrm-portal-country-select option {
    background-color: #1c1815 !important;
    color: #f6f0e6 !important;
}

/* Select2 main box */
.rcrm-portal-container .select2-container .select2-selection--single,
.rcrm-portal-container .select2-container--default .select2-selection--single,
.rcrm-portal-manage-card .select2-container--default .select2-selection--single,
.rcrm-portal-select2-container .select2-container--default .select2-selection--single {
    height: 46px !important;
    background-color: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    color: #f6f0e6 !important;
}

.rcrm-portal-container .select2-container--default .select2-selection--single .select2-selection__rendered,
.rcrm-portal-manage-card .select2-container--default .select2-selection--single .select2-selection__rendered,
.rcrm-portal-select2-container .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #f6f0e6 !important;
    line-height: 44px !important;
    padding-left: 12px !important;
    padding-right: 28px !important;
    font-size: 14px !important;
}

.rcrm-portal-container .select2-container--default .select2-selection--single .select2-selection__placeholder,
.rcrm-portal-manage-card .select2-container--default .select2-selection--single .select2-selection__placeholder,
.rcrm-portal-select2-container .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #7a7168 !important;
}

.rcrm-portal-container .select2-container--default .select2-selection--single .select2-selection__arrow,
.rcrm-portal-manage-card .select2-container--default .select2-selection--single .select2-selection__arrow,
.rcrm-portal-select2-container .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
    right: 8px !important;
}

.rcrm-portal-container .select2-container--default .select2-selection--single .select2-selection__arrow b,
.rcrm-portal-manage-card .select2-container--default .select2-selection--single .select2-selection__arrow b,
.rcrm-portal-select2-container .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #a89f92 transparent transparent transparent !important;
}

.rcrm-portal-container .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b,
.rcrm-portal-manage-card .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b,
.rcrm-portal-select2-container .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #a89f92 transparent !important;
}

/* Focus / open state */
.rcrm-portal-container .select2-container--default.select2-container--open .select2-selection--single,
.rcrm-portal-container .select2-container--default .select2-selection--single:focus,
.rcrm-portal-manage-card .select2-container--default.select2-container--open .select2-selection--single,
.rcrm-portal-manage-card .select2-container--default .select2-selection--single:focus,
.rcrm-portal-select2-container .select2-container--default.select2-container--open .select2-selection--single,
.rcrm-portal-select2-container .select2-container--default .select2-selection--single:focus {
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    outline: none !important;
    background-color: #171310 !important;
}

/* Dropdown panel */
.rcrm-portal-container .select2-dropdown,
.rcrm-portal-container form .select2-dropdown,
.rcrm-portal-container .select2-container--open .select2-dropdown,
.rcrm-portal-manage-card .select2-dropdown,
.rcrm-portal-select2-container .select2-dropdown {
    background-color: #1c1815 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 12px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .45) !important;
    color: #f6f0e6 !important;
    overflow: hidden !important;
}

/* Search box inside dropdown */
.rcrm-portal-container .select2-search--dropdown,
.rcrm-portal-manage-card .select2-search--dropdown,
.rcrm-portal-select2-container .select2-search--dropdown {
    background-color: #151210 !important;
    border-bottom: 1px solid #2e2822 !important;
    padding: 10px !important;
}

.rcrm-portal-container .select2-search--dropdown .select2-search__field,
.rcrm-portal-manage-card .select2-search--dropdown .select2-search__field,
.rcrm-portal-select2-container .select2-search--dropdown .select2-search__field {
    background-color: #120f0d !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    font-size: 14px !important;
    padding: 10px 12px !important;
    color-scheme: dark !important;
    outline: none !important;
}

.rcrm-portal-container .select2-search--dropdown .select2-search__field::placeholder,
.rcrm-portal-manage-card .select2-search--dropdown .select2-search__field::placeholder,
.rcrm-portal-select2-container .select2-search--dropdown .select2-search__field::placeholder {
    color: #7a7168 !important;
    opacity: 1 !important;
}

.rcrm-portal-container .select2-search--dropdown .select2-search__field:focus,
.rcrm-portal-manage-card .select2-search--dropdown .select2-search__field:focus,
.rcrm-portal-select2-container .select2-search--dropdown .select2-search__field:focus {
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
}

/* Results area */
.rcrm-portal-container .select2-results,
.rcrm-portal-container .select2-results__options,
.rcrm-portal-manage-card .select2-results,
.rcrm-portal-manage-card .select2-results__options,
.rcrm-portal-select2-container .select2-results,
.rcrm-portal-select2-container .select2-results__options {
    background-color: #1c1815 !important;
    color: #f6f0e6 !important;
}

/* Country options */
.rcrm-portal-container .select2-results__option,
.rcrm-portal-container .select2-results__option span,
.rcrm-portal-manage-card .select2-results__option,
.rcrm-portal-manage-card .select2-results__option span,
.rcrm-portal-select2-container .select2-results__option,
.rcrm-portal-select2-container .select2-results__option span {
    background-color: #1c1815 !important;
    color: #f6f0e6 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    padding: 10px 12px !important;
}

/* Hover / keyboard highlight */
.rcrm-portal-container .select2-results__option--highlighted[aria-selected],
.rcrm-portal-container .select2-results__option:hover,
.rcrm-portal-container .select2-results__option.select2-results__option--highlighted,
.rcrm-portal-manage-card .select2-results__option--highlighted[aria-selected],
.rcrm-portal-manage-card .select2-results__option:hover,
.rcrm-portal-manage-card .select2-results__option.select2-results__option--highlighted,
.rcrm-portal-select2-container .select2-results__option--highlighted[aria-selected],
.rcrm-portal-select2-container .select2-results__option:hover,
.rcrm-portal-select2-container .select2-results__option.select2-results__option--highlighted {
    background-color: rgba(201, 161, 74, .18) !important;
    color: #e0bd6b !important;
}

/* Selected country */
.rcrm-portal-container .select2-results__option[aria-selected="true"],
.rcrm-portal-manage-card .select2-results__option[aria-selected="true"],
.rcrm-portal-select2-container .select2-results__option[aria-selected="true"] {
    background-color: rgba(201, 161, 74, .24) !important;
    color: #c9a14a !important;
    font-weight: 800 !important;
}

/* No results / loading */
.rcrm-portal-container .select2-results__message,
.rcrm-portal-container .select2-results__option.select2-results__message,
.rcrm-portal-manage-card .select2-results__message,
.rcrm-portal-manage-card .select2-results__option.select2-results__message,
.rcrm-portal-select2-container .select2-results__message,
.rcrm-portal-select2-container .select2-results__option.select2-results__message {
    background-color: #1c1815 !important;
    color: #a89f92 !important;
    font-size: 13px !important;
    padding: 12px !important;
}

/* Prevent inherited white text inside dropdown */
.rcrm-portal-container .select2-dropdown *,
.rcrm-portal-container form .select2-dropdown *,
.rcrm-portal-manage-card .select2-dropdown *,
.rcrm-portal-select2-container .select2-dropdown * {
    color: inherit !important;
}

/* Mobile */
@media (max-width: 768px) {
    .rcrm-portal-container .select2-container--default .select2-selection--single,
    .rcrm-portal-container .select2-container--default .select2-selection--single .select2-selection__rendered,
    .rcrm-portal-container select.rcrm-portal-country-select {
        font-size: 16px !important;
    }

    .rcrm-portal-container .select2-dropdown,
    .rcrm-portal-container form .select2-dropdown,
    .rcrm-portal-manage-card .select2-dropdown,
    .rcrm-portal-select2-container .select2-dropdown {
        max-width: calc(100vw - 24px) !important;
    }
}

/* ==========================================================================
   CUSTOMER PORTAL PHASE 2C — DOCUMENT UPLOAD UI
   Visual-only.
   ========================================================================== */

.rcrm-portal-documents {
    margin: 0 0 24px !important;
    padding: 0 0 20px !important;
    border-bottom: 1px solid #2e2822 !important;
}

.rcrm-portal-document-list {
    display: grid;
    gap: 12px;
}

.rcrm-portal-document-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    color: #f6f0e6 !important;
}

.rcrm-portal-document-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.rcrm-portal-document-main strong {
    color: #e0bd6b !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
}

.rcrm-portal-document-name,
.rcrm-portal-document-size {
    color: #a89f92 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    word-break: break-word;
}

.rcrm-portal-document-side {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.rcrm-doc-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    border: 1px solid transparent !important;
    white-space: nowrap;
}

.rcrm-doc-status-pending {
    background: rgba(201, 161, 74, .14) !important;
    border-color: #4a3b1c !important;
    color: #e0bd6b !important;
}

.rcrm-doc-status-approved {
    background: rgba(34, 197, 94, .14) !important;
    border-color: rgba(34, 197, 94, .35) !important;
    color: #86efac !important;
}

.rcrm-doc-status-rejected {
    background: rgba(239, 68, 68, .12) !important;
    border-color: rgba(239, 68, 68, .35) !important;
    color: #fca5a5 !important;
}

.rcrm-portal-document-upload {
    margin-top: 24px !important;
    padding-top: 20px !important;
    border-top: 1px solid #2e2822 !important;
}

.rcrm-portal-document-upload small {
    display: block;
    margin-top: 8px;
    color: #7a7168 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

.rcrm-portal-edit-field input[type="file"] {
    width: 100% !important;
    padding: 10px 12px !important;
    background: #120f0d !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    color-scheme: dark !important;
    font-size: 14px !important;
}

.rcrm-portal-edit-field input[type="date"] {
    color-scheme: dark !important;
}

.rcrm-btn-small {
    min-height: 38px !important;
    padding: 9px 14px !important;
    font-size: 12px !important;
}

@media (max-width: 768px) {
    .rcrm-portal-document-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .rcrm-portal-document-side {
        width: 100%;
        justify-content: flex-start;
    }

    .rcrm-btn-small {
        width: 100%;
    }
}

/* ==========================================================================
   CUSTOMER PORTAL PHASE 2C — TWO UPLOAD FIELDS + STATUS ONLY
   Visual-only.
   ========================================================================== */

.rcrm-portal-document-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    background: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    color: #f6f0e6 !important;
}

.rcrm-portal-document-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.rcrm-portal-document-main strong {
    color: #e0bd6b !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
}

.rcrm-portal-document-name,
.rcrm-portal-document-size,
.rcrm-portal-document-note {
    color: #a89f92 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    word-break: break-word;
}

.rcrm-portal-document-note {
    color: #fca5a5 !important;
}

.rcrm-portal-document-side {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.rcrm-doc-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    border: 1px solid transparent !important;
    white-space: nowrap;
}

.rcrm-doc-status-pending {
    background: rgba(201, 161, 74, .14) !important;
    border-color: #4a3b1c !important;
    color: #e0bd6b !important;
}

.rcrm-doc-status-approved {
    background: rgba(34, 197, 94, .14) !important;
    border-color: rgba(34, 197, 94, .35) !important;
    color: #86efac !important;
}

.rcrm-doc-status-rejected {
    background: rgba(239, 68, 68, .12) !important;
    border-color: rgba(239, 68, 68, .35) !important;
    color: #fca5a5 !important;
}

.rcrm-portal-document-upload {
    margin-top: 24px !important;
    padding-top: 20px !important;
    border-top: 1px solid #2e2822 !important;
}

.rcrm-portal-upload-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
    margin-top: 12px;
}

.rcrm-portal-upload-field {
    background: #151210;
    border: 1px solid #2e2822;
    border-radius: 12px;
    padding: 14px;
}

.rcrm-portal-upload-field label,
.rcrm-portal-file-label {
    display: block;
    margin-bottom: 8px;
    color: #a89f92;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    line-height: 1.3;
}

.rcrm-portal-doc-type-select {
    width: 100% !important;
    padding: 12px 14px !important;
    background-color: #120f0d !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    font-size: 14px !important;
    color-scheme: dark !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    margin-bottom: 12px;
}

.rcrm-portal-doc-type-select option {
    background-color: #1c1815 !important;
    color: #f6f0e6 !important;
}



.rcrm-portal-edit-field input[type="date"],
.rcrm-portal-upload-field input[type="date"] {
    color-scheme: dark !important;
}

.rcrm-portal-upload-help {
    margin: 12px 0 0 !important;
    color: #a89f92 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

@media (max-width: 768px) {
    .rcrm-portal-document-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .rcrm-portal-document-side {
        width: 100%;
        justify-content: flex-start;
    }

    .rcrm-portal-upload-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   CUSTOMER PORTAL PHASE 2C UI POLISH
   File button + uploaded documents layout
   Visual-only.
   ========================================================================== */

/* -------------------------------------------------------------------------
   Pretty file chooser
   ------------------------------------------------------------------------- */

.rcrm-portal-file-control {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 8px;
    background: #120f0d !important;
    border: 1px solid #2e2822 !important;
    border-radius: 10px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.rcrm-portal-file-control:focus-within {
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    background: #171310 !important;
}

.rcrm-portal-container .rcrm-portal-file-input,
.rcrm-portal-container input[type="file"] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.rcrm-portal-file-button {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 9px 15px;
    background: #c9a14a !important;
    color: #1a1307 !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    font-family: "Kumbh Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: .2px !important;
    cursor: pointer !important;
    box-shadow: 0 10px 22px rgba(201, 161, 74, .14) !important;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.rcrm-portal-file-button:hover {
    background: #e0bd6b !important;
    color: #1a1307 !important;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(201, 161, 74, .18) !important;
}

.rcrm-portal-file-button:active {
    transform: translateY(0);
}

.rcrm-portal-file-button:focus-visible {
    outline: 2px solid rgba(201, 161, 74, .55) !important;
    outline-offset: 2px !important;
}

.rcrm-portal-file-input:focus ~ .rcrm-portal-file-button {
    outline: 2px solid rgba(201, 161, 74, .55) !important;
    outline-offset: 2px !important;
}

.rcrm-portal-file-name {
    flex: 1 1 auto;
    min-width: 0;
    color: #7a7168 !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rcrm-portal-file-control.has-file .rcrm-portal-file-name {
    color: #f6f0e6 !important;
}

.rcrm-portal-file-label {
    display: block;
    margin: 12px 0 8px !important;
    color: #a89f92 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    line-height: 1.3 !important;
}

/* -------------------------------------------------------------------------
   Uploaded documents cards
   ------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-portal-documents {
    margin: 0 0 24px !important;
    padding: 0 0 20px !important;
    border-bottom: 1px solid #2e2822 !important;
}

.rcrm-portal-container .rcrm-portal-document-list {
    display: grid;
    gap: 12px !important;
}

.rcrm-portal-container .rcrm-portal-document-item {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 14px !important;
    align-items: start !important;
    background: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 14px !important;
    padding: 16px !important;
    color: #f6f0e6 !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
}

.rcrm-portal-container .rcrm-portal-document-item--pending {
    border-color: #4a3b1c !important;
}

.rcrm-portal-container .rcrm-portal-document-item--approved {
    border-color: rgba(34, 197, 94, .32) !important;
}

.rcrm-portal-container .rcrm-portal-document-item--rejected {
    border-color: rgba(239, 68, 68, .32) !important;
}

.rcrm-portal-container .rcrm-portal-document-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
    background: rgba(201, 161, 74, .12);
    border: 1px solid #4a3b1c;
    flex: 0 0 auto;
}

.rcrm-portal-container .rcrm-portal-document-item--approved .rcrm-portal-document-icon {
    background: rgba(34, 197, 94, .12);
    border-color: rgba(34, 197, 94, .32);
}

.rcrm-portal-container .rcrm-portal-document-item--rejected .rcrm-portal-document-icon {
    background: rgba(239, 68, 68, .12);
    border-color: rgba(239, 68, 68, .32);
}

.rcrm-portal-container .rcrm-portal-document-content {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.rcrm-portal-container .rcrm-portal-document-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.rcrm-portal-container .rcrm-portal-document-type {
    color: #e0bd6b !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}

.rcrm-portal-container .rcrm-doc-status {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    border: 1px solid transparent !important;
    white-space: nowrap !important;
}

.rcrm-portal-container .rcrm-doc-status-pending {
    background: rgba(201, 161, 74, .14) !important;
    border-color: #4a3b1c !important;
    color: #e0bd6b !important;
}

.rcrm-portal-container .rcrm-doc-status-approved {
    background: rgba(34, 197, 94, .14) !important;
    border-color: rgba(34, 197, 94, .35) !important;
    color: #86efac !important;
}

.rcrm-portal-container .rcrm-doc-status-rejected {
    background: rgba(239, 68, 68, .12) !important;
    border-color: rgba(239, 68, 68, .35) !important;
    color: #fca5a5 !important;
}

.rcrm-portal-container .rcrm-portal-document-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    color: #a89f92 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

.rcrm-portal-container .rcrm-portal-document-meta span {
    min-width: 0;
}

.rcrm-portal-container .rcrm-portal-document-file {
    flex: 1 1 220px;
    word-break: break-word;
    white-space: normal;
}

.rcrm-portal-container .rcrm-portal-document-size,
.rcrm-portal-container .rcrm-portal-document-date {
    flex: 0 0 auto;
    white-space: nowrap;
}

.rcrm-portal-container .rcrm-portal-document-hint {
    color: #a89f92 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.rcrm-portal-container .rcrm-portal-document-hint--ok {
    color: #86efac !important;
}

.rcrm-portal-container .rcrm-portal-document-note {
    background: rgba(239, 68, 68, .10) !important;
    border: 1px solid rgba(239, 68, 68, .28) !important;
    color: #fca5a5 !important;
    border-radius: 10px !important;
    padding: 10px 12px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.rcrm-portal-container .rcrm-portal-document-note strong {
    color: #fecaca !important;
}

/* -------------------------------------------------------------------------
   Upload field boxes
   ------------------------------------------------------------------------- */

.rcrm-portal-container .rcrm-portal-upload-field {
    background: #151210 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 14px !important;
    padding: 16px !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
}

.rcrm-portal-container .rcrm-portal-upload-field label {
    display: block;
    margin-bottom: 8px !important;
    color: #a89f92 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    line-height: 1.3 !important;
}

.rcrm-portal-container .rcrm-portal-doc-type-select {
    width: 100% !important;
    padding: 12px 14px !important;
    background-color: #120f0d !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
    color: #f6f0e6 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    color-scheme: dark !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

.rcrm-portal-container .rcrm-portal-doc-type-select:focus {
    outline: none !important;
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    background-color: #171310 !important;
}

.rcrm-portal-container .rcrm-portal-doc-type-select option {
    background-color: #1c1815 !important;
    color: #f6f0e6 !important;
}

.rcrm-portal-container .rcrm-portal-upload-help {
    margin: 14px 0 0 !important;
    color: #a89f92 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* -------------------------------------------------------------------------
   Mobile
   ------------------------------------------------------------------------- */

@media (max-width: 768px) {
    .rcrm-portal-container .rcrm-portal-file-control {
        align-items: stretch;
        flex-direction: column;
    }

    .rcrm-portal-container .rcrm-portal-file-button {
        width: 100%;
    }

    .rcrm-portal-container .rcrm-portal-file-name {
        white-space: normal;
        word-break: break-word;
    }

    .rcrm-portal-container .rcrm-portal-document-item {
        grid-template-columns: 1fr !important;
    }

    .rcrm-portal-container .rcrm-portal-document-icon {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .rcrm-portal-container .rcrm-portal-document-top {
        align-items: flex-start;
        flex-direction: column;
    }

    .rcrm-portal-container .rcrm-doc-status {
        align-self: flex-start;
    }
}

/* ==========================================================================
   PORTAL FLATPICKR DARK STYLE
   Visual-only.
   ========================================================================== */

.rcrm-portal-dark-flatpickr,
.rcrm-portal-container .flatpickr-calendar {
    background: #1c1815 !important;
    border: 1px solid #2e2822 !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .45) !important;
    color: #f6f0e6 !important;
    border-radius: 14px !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-months,
.rcrm-portal-container .flatpickr-calendar .flatpickr-months {
    background: #151210 !important;
    color: #f6f0e6 !important;
    border-bottom: 1px solid #2e2822 !important;
    border-radius: 14px 14px 0 0 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-month,
.rcrm-portal-container .flatpickr-calendar .flatpickr-month {
    color: #f6f0e6 !important;
    fill: #f6f0e6 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-current-month .flatpickr-monthDropdown-months,
.rcrm-portal-container .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months,
.rcrm-portal-dark-flatpickr .flatpickr-current-month input.cur-year,
.rcrm-portal-container .flatpickr-calendar .flatpickr-current-month input.cur-year {
    background: #151210 !important;
    color: #f6f0e6 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month,
.rcrm-portal-container .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
    background: #1c1815 !important;
    color: #f6f0e6 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-prev-month,
.rcrm-portal-dark-flatpickr .flatpickr-next-month,
.rcrm-portal-container .flatpickr-calendar .flatpickr-prev-month,
.rcrm-portal-container .flatpickr-calendar .flatpickr-next-month {
    color: #c9a14a !important;
    fill: #c9a14a !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-prev-month:hover svg,
.rcrm-portal-dark-flatpickr .flatpickr-next-month:hover svg,
.rcrm-portal-container .flatpickr-calendar .flatpickr-prev-month:hover svg,
.rcrm-portal-container .flatpickr-calendar .flatpickr-next-month:hover svg {
    fill: #e0bd6b !important;
    color: #e0bd6b !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-weekdays,
.rcrm-portal-container .flatpickr-calendar .flatpickr-weekdays {
    background: #151210 !important;
    border-bottom: 1px solid #2e2822 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-weekday,
.rcrm-portal-container .flatpickr-calendar .flatpickr-weekday {
    color: #a89f92 !important;
    background: transparent !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-days,
.rcrm-portal-container .flatpickr-calendar .flatpickr-days {
    background: #1c1815 !important;
}

.rcrm-portal-dark-flatpickr .dayContainer,
.rcrm-portal-container .flatpickr-calendar .dayContainer {
    background: #1c1815 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-day,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day {
    color: #f6f0e6 !important;
    border-radius: 10px !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-day:hover,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day:hover {
    background: rgba(201, 161, 74, .16) !important;
    border-color: #4a3b1c !important;
    color: #e0bd6b !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-day.today,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.today {
    border-color: #c9a14a !important;
    color: #e0bd6b !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-day.selected,
.rcrm-portal-dark-flatpickr .flatpickr-day.selected:hover,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.selected,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.selected:hover {
    background: #c9a14a !important;
    border-color: #c9a14a !important;
    color: #1a1307 !important;
    font-weight: 800 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-day.inRange,
.rcrm-portal-dark-flatpickr .flatpickr-day.prevMonthDay.inRange,
.rcrm-portal-dark-flatpickr .flatpickr-day.nextMonthDay.inRange,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.inRange,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.prevMonthDay.inRange,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.nextMonthDay.inRange {
    background: rgba(201, 161, 74, .10) !important;
    border-color: rgba(201, 161, 74, .10) !important;
    box-shadow: none !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-day.flatpickr-disabled,
.rcrm-portal-dark-flatpickr .flatpickr-day.prevMonthDay,
.rcrm-portal-dark-flatpickr .flatpickr-day.nextMonthDay,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.flatpickr-disabled,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.prevMonthDay,
.rcrm-portal-container .flatpickr-calendar .flatpickr-day.nextMonthDay {
    color: #6d645b !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-time,
.rcrm-portal-container .flatpickr-calendar .flatpickr-time {
    background: #151210 !important;
    border-top: 1px solid #2e2822 !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-time input,
.rcrm-portal-dark-flatpickr .flatpickr-time .flatpickr-am-pm,
.rcrm-portal-container .flatpickr-calendar .flatpickr-time input,
.rcrm-portal-container .flatpickr-calendar .flatpickr-time .flatpickr-am-pm {
    background: #120f0d !important;
    color: #f6f0e6 !important;
    border: 1px solid #2e2822 !important;
    border-radius: 8px !important;
}

.rcrm-portal-dark-flatpickr .flatpickr-time input:focus,
.rcrm-portal-dark-flatpickr .flatpickr-time .flatpickr-am-pm:focus,
.rcrm-portal-container .flatpickr-calendar .flatpickr-time input:focus,
.rcrm-portal-container .flatpickr-calendar .flatpickr-time .flatpickr-am-pm:focus {
    border-color: #c9a14a !important;
    box-shadow: 0 0 0 3px rgba(201, 161, 74, .16) !important;
    outline: none !important;
}

.rcrm-portal-dark-flatpickr .numInputWrapper span.arrowUp:after,
.rcrm-portal-dark-flatpickr .numInputWrapper span.arrowDown:after,
.rcrm-portal-container .flatpickr-calendar .numInputWrapper span.arrowUp:after,
.rcrm-portal-container .flatpickr-calendar .numInputWrapper span.arrowDown:after {
    border-bottom-color: #a89f92 !important;
    border-top-color: #a89f92 !important;
}