:root{
  /* ===== NEW LIGHT COMFORT THEME (Dimar) ===== */
  --bg: #F5F3EE;             /* warm off-white */
  --bg2: #EDF3FA;            /* soft light blue sections */
  --panel: rgba(255,255,255,.88);
  --panel-solid: #FFFFFF;
  --stroke: #E2E2E2;
  --stroke2: #DADADA;

  --text: #2E2E2E;           /* body text */
  --muted: #7A7A7A;          /* muted text */

  --accent: #5B7FA6;         /* elegant light blue */
  --accent2: #4A6C8E;        /* hover/deeper blue */
  --accentSoft: #E8F0F8;     /* very light blue */
  --accentSoft2: #DCE8F4;

  /* Softer shadows for light theme */
  --shadow: 0 18px 44px rgba(0,0,0,.10);
  --shadow2: 0 26px 70px rgba(0,0,0,.12);
}

*{ box-sizing:border-box }
html{ scroll-behavior:smooth }

body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial;
}

a{ color: inherit; text-decoration:none }
img{ max-width:100%; height:auto }

.container{ width:min(1180px,92%); margin:0 auto }
.section{ padding:90px 0 }

.kicker{
  letter-spacing:.22em;
  font-size:12px;
  color: var(--accent);
  margin:0 0 14px;
}

h1,h2,h3{ margin:0 }
h2{ font-size:44px; line-height:1.05 }
h2 span{ color: var(--accent) }

p{ margin:0 }
.muted{ color: var(--muted) }
.small{ font-size:13px }

/* ===== Buttons ===== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:999px;
  border:1px solid transparent;
  cursor:pointer;
  transition:.25s ease;
  gap:10px;
  font-weight:650;
  user-select:none;
}

.btn:hover{ transform:translateY(-1px) }
.btn:active{ transform:translateY(0) }

/* Keep class name btn-gold for compatibility, but recolor to BLUE */
.btn-gold{
  background: linear-gradient(135deg, var(--accent), #6F95BB);
  color:#FFFFFF;
  box-shadow: 0 10px 28px rgba(91,127,166,.22);
  margin-top:16px;
}

.btn-ghost{
  background: transparent;
  border-color: var(--accent);
  color: var(--accent);
}

.btn-ghost:hover{
  background: var(--accentSoft);
  border-color: var(--accent);
}

.btn.w-full{ width:100% }

/* Subtle pulse outline for hero CTA (now blue) */
.btn-pulse{ position:relative }
.btn-pulse:after{
  content:"";
  position:absolute;
  inset:-3px;
  border-radius:999px;
  border:1px solid rgba(91,127,166,.45);
  filter: drop-shadow(0 0 16px rgba(91,127,166,.22));
  animation:pulse 2.8s ease-in-out infinite;
  pointer-events:none;
}
@keyframes pulse{
  0%,100%{ opacity:.30; transform:scale(1) }
  50%{ opacity:.60; transform:scale(1.02) }
}

/* ===== Layout helpers ===== */
.grid{ display:grid; gap:18px }
.grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)) }
.grid-4{ grid-template-columns:repeat(4,minmax(0,1fr)) }

.glass-panel{
  background: var(--panel);
  border: 1px solid var(--stroke);
  border-radius:18px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(12px);
}

/* ===== Cards ===== */
.card{
  border-radius:18px;
  overflow:hidden;
  background: var(--panel-solid);
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
}

.card-hover{ transition:.25s ease }
.card-hover:hover{
  transform: translateY(-4px);
  border-color: rgba(91,127,166,.45);
  box-shadow: 0 0 0 1px rgba(91,127,166,.18), var(--shadow2);
}

.card-media{
  position:relative;
  height:240px;
  background-size:cover;
  background-position:center;
  overflow:hidden;
  transition:.35s ease;
}

/* Keep a gentle readability overlay on images (not heavy dark) */
.card-media:before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg,
    rgba(255,255,255,.00),
    rgba(245,243,238,.35),
    rgba(245,243,238,.78)
  );
}

.card-hover:hover .card-media{ transform:scale(1.06) }

.badge{
  position:absolute;
  top:14px;
  left:14px;
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:750;
  z-index:2;
}

/* Keep class name badge-gold but recolor to blue */
.badge-gold{
  background: var(--accentSoft);
  border: 1px solid var(--accentSoft2);
  color: var(--accent);
}

/* Optional dark badge variant: make it “soft” instead of black */
.badge-dark{
  background: rgba(255,255,255,.78);
  border: 1px solid var(--stroke);
  color: var(--text);
}

.price-pill{
  position:absolute;
  top:14px;
  right:14px;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.86);
  border: 1px solid var(--stroke);
  font-weight:800;
  z-index:2;
  color: var(--text);
  backdrop-filter: blur(10px);
}

.price-pill span{
  font-weight:650;
  color: rgba(46,46,46,.65);
  margin-left:6px;
}

.card-body{ padding:16px }
.card-body h3{
  font-size:18px;
  margin-bottom:6px;
  color: var(--accent);
}

.specs{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
  color: rgba(46,46,46,.72);
  font-size:13px;
}

.specs span{
  padding:6px 10px;
  border-radius:999px;
  background: var(--accentSoft);
  border: 1px solid var(--accentSoft2);
  color: rgba(46,46,46,.78);
}

.hint{
  margin-top:10px;
  color: var(--accent2);
  font-size:13px;
}

/* Airbnb overlay */
.card-overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  opacity:0;
  transition:.25s ease;
  z-index:3;
}

.card-hover:hover .card-overlay{ opacity:1 }

.overlay-actions{
  width:100%;
  padding:14px;
}

/* Section head */
.section-head{ margin-bottom:34px }
.section-head p{ max-width:640px; margin-top:10px }

/* ===== Modals / Drawer ===== */
.modal, .drawer{
  position:fixed;
  inset:0;
  display:none;
  z-index:9999;
}

.modal[aria-hidden="false"],
.drawer[aria-hidden="false"]{ display:block }

.modal-backdrop,
.drawer-backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.38); /* softer */
  backdrop-filter: blur(6px);
}

/* Modal panel */
.modal-panel{
  position:absolute;
  left:50%;
  top:50%;
  transform: translate(-50%,-50%);
  width: min(520px,92%);
  padding:16px;
}

.modal-head,
.drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
}

.icon-btn{
  background: rgba(255,255,255,.85);
  border: 1px solid var(--stroke);
  color: var(--text);
  border-radius:12px;
  padding:8px 10px;
  cursor:pointer;
}

.form{
  padding:18px;
  display:grid;
  gap:10px;
  background: var(--panel-solid);
  border: 1px solid var(--stroke);
  border-radius:18px;
  box-shadow: var(--shadow);
}

.form input,
.form textarea,
.form select{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  background: #FFFFFF;
  border: 1px solid var(--stroke2);
  color: var(--text);
  outline:none;
}

.form input:focus,
.form textarea:focus,
.form select:focus{
  border-color: rgba(91,127,166,.65);
  box-shadow: 0 0 0 3px rgba(91,127,166,.16);
}

.form input::placeholder,
.form textarea::placeholder{
  color: var(--muted);
}

.form-status{ font-size:13px; color: rgba(46,46,46,.70) }
.form-status.success{ color: var(--accent2) }

/* Drawer */
.drawer-panel{
  position:absolute;
  right:0;
  top:0;
  height:100%;
  width:min(520px,92%);
  padding:16px;
  overflow:auto;
  background: transparent;
}

.drawer-hero{
  height:220px;
  border-radius:16px;
  background-size:cover;
  background-position:center;
  border: 1px solid var(--stroke);
}

.price-big{
  font-size:28px;
  color: var(--accent);
  font-weight:900;
  margin:10px 0;
}

/* ===== Booking page UI ===== */
.booking-summary{
  display:flex;
  gap:14px;
  align-items:center;
  padding:16px;
}

.booking-img{
  width:140px;
  height:96px;
  border-radius:14px;
  background-size:cover;
  background-position:center;
  border: 1px solid var(--stroke);
}

.booking-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:18px;
}

.booking-form{ padding:18px }
.row-2{ display:grid; grid-template-columns:1fr 1fr; gap:10px }
.price-card{ padding:18px }

.line{
  display:flex;
  justify-content:space-between;
  margin:10px 0;
  color: rgba(46,46,46,.82);
}

.divider{
  height:1px;
  background: var(--stroke);
  margin:12px 0;
}

.total{ font-weight:900 }

/* ===== Responsive ===== */
@media (max-width:980px){
  .grid-4{ grid-template-columns: repeat(2,1fr) }
  .grid-3{ grid-template-columns: repeat(2,1fr) }
  .booking-grid{ grid-template-columns:1fr }
}
@media (max-width:560px){
  .grid-3, .grid-4{ grid-template-columns:1fr }
  .row-2{ grid-template-columns:1fr }
}

/* =========================================
   DIMAR HERO LINES (light theme)
========================================= */
.dimar-hero{
  position:relative !important;
  overflow:hidden !important;
}

/* Elementor overlay behind */
.dimar-hero>.elementor-background-overlay,
.dimar-hero .elementor-background-overlay{
  z-index:1 !important;
  pointer-events:none;
}

/* Content above overlay */
.dimar-hero>.e-con-inner,
.dimar-hero .e-con-inner,
.dimar-hero>.elementor-container,
.dimar-hero .elementor-container,
.dimar-hero .elementor-widget-wrap{
  position:relative;
  z-index:5;
}

/* Lines wrapper on top */
.dimar-hero .dimar-hero-linewrap{
  position:relative !important;
  z-index:9999 !important;
  width:100%;
  height:2px;
  overflow:hidden;
  pointer-events:none;
  margin:0;
}

/* Base line */
.dimar-hero .dimar-hero-line{
  position:absolute;
  inset:0;
  height:2px;
  background: rgba(91,127,166,.22);
  opacity:.65;
}

/* Moving shine (STRONGER + still elegant) */
.dimar-hero .dimar-hero-line::after{
  content:"";
  position:absolute;
  top:0;
  left:-40%;
  width:45%;              /* λίγο πιο φαρδύ highlight */
  height:2px;

  background: linear-gradient(90deg,
    transparent 0%,
    rgba(91,127,166,.22) 20%,
    rgba(91,127,166,.95) 50%,   /* πιο έντονο κέντρο */
    rgba(91,127,166,.22) 80%,
    transparent 100%
  );

  filter: drop-shadow(0 0 14px rgba(91,127,166,.45)); /* πιο εμφανές */
  opacity: .95;                                      /* έξτρα boost */
  animation: dimarShine 4.8s linear infinite;
  will-change: transform;
}

/* 2nd line: also more visible */
.dimar-hero .dimar-hero-line--2{ opacity:.55 }

.dimar-hero .dimar-hero-line--2::after{
  opacity:.75;
  animation-delay:1.6s;
  filter: drop-shadow(0 0 12px rgba(91,127,166,.32));
}
.dimar-hero .dimar-hero-line,
.dimar-hero .dimar-hero-line::after{
  height: 3px;
}

@keyframes dimarShine{
  0%{ transform: translateX(0) }
  100%{ transform: translateX(420%) }
}

/* ---------------------------------------
   SALE MODAL (Light)
---------------------------------------- */
html.dimar-modal-open,
body.dimar-modal-open{
  overflow:hidden !important;
}

.dimar-sale-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:999999;
}
.dimar-sale-modal[aria-hidden="false"]{ display:block }

.dimar-sale-backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.42);
  backdrop-filter: blur(8px);
}

.dimar-sale-panel{
  position:absolute;
  left:50%;
  top:50%;
  transform: translate(-50%,-50%);
  width: min(1080px,92vw);
  max-height: 88vh;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--stroke);
  border-radius:18px;
  overflow:hidden;
  box-shadow: var(--shadow2);
  display:flex;
  flex-direction:column;
}

.dimar-sale-close{
  position:absolute;
  right:14px;
  top:14px;
  width:44px;
  height:44px;
  border-radius:999px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.88);
  color: var(--text);
  cursor:pointer;
  z-index:5;
}

.dimar-sale-main{
  position:relative;
  background: #F7F6F2;
}

.dimar-sale-image{
  display:block;
  width:100%;
  height: min(62vh,560px);
  object-fit:cover;
}

/* nav buttons */
.dimar-sale-nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:46px;
  height:46px;
  border-radius:999px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.85);
  color: var(--text);
  cursor:pointer;
  z-index:4;
  font-size:28px;
  line-height:1;
}
.dimar-sale-prev{ left:16px }
.dimar-sale-next{ right:16px }

.dimar-sale-price{
  position:absolute;
  left:16px;
  bottom:16px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,.86);
  border: 1px solid var(--stroke);
  font-weight:800;
  color: var(--text);
  z-index:4;
  backdrop-filter: blur(10px);
}

.dimar-sale-meta{
  padding:14px 16px 6px 16px;
}

.dimar-sale-title{
  font-size:18px;
  font-weight:800;
  color: var(--accent);
}

.dimar-sale-location{
  margin-top:4px;
  color: rgba(46,46,46,.70);
}

.dimar-sale-thumbs{
  display:flex;
  gap:10px;
  padding:12px 16px 28px 18px;
  overflow-x:auto;
  border-top: 1px solid var(--stroke);
  background: rgba(255,255,255,.75);
}

.dimar-sale-thumb{
  flex:0 0 auto;
  width:92px;
  height:64px;
  padding:0;
  border-radius:12px;
  overflow:hidden;
  border: 2px solid rgba(226,226,226,.9);
  background: transparent;
  cursor:pointer;
}

.dimar-sale-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.dimar-sale-thumb.is-active{
  border-color: rgba(91,127,166,.90);
  box-shadow: 0 0 0 1px rgba(91,127,166,.25), 0 12px 26px rgba(0,0,0,.12);
}

/* scroll area */
.dimar-sale-content{
  flex: 1 1 auto;
  overflow-y:auto;
  padding: 14px 16px 0 16px;
  background: rgba(255,255,255,.92);
}

.dimar-sale-content .dimar-sale-title{
  font-size:36px;
  font-weight:900;
  letter-spacing:-0.02em;
  margin:2px 0 6px 0;
  color: var(--accent);
}
.dimar-sale-content .dimar-sale-location{
  font-size:15px;
  color: rgba(46,46,46,.62);
  margin-bottom:14px;
}

.dimar-sale-specs{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin: 14px 0 6px 0;
  color: rgba(46,46,46,.78);
  font-weight:650;
}

.dimar-sale-specs span{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  background: var(--accentSoft);
  border: 1px solid var(--accentSoft2);
  font-size:13px;
}

.dimar-sale-h3{
  margin:16px 0 10px 0;
  font-size:18px;
  font-weight:850;
  color: var(--text);
}

.dimar-sale-desc{
  color: rgba(46,46,46,.72);
  line-height:1.55;
  margin:0;
  font-size:15px;
}

.dimar-sale-features{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding-bottom:14px;
}

.dimar-sale-chip{
  padding:8px 12px;
  border-radius:999px;
  background: rgba(237,243,250,.92);
  border: 1px solid rgba(220,232,244,.95);
  font-size:13px;
  color: rgba(46,46,46,.82);
  font-weight:650;
}

.dimar-sale-bottomspace{ height:18px }

@media (max-width:640px){
  .dimar-sale-image{ height:46vh }
  .dimar-sale-thumb{ width:78px; height:56px }
  .dimar-sale-content{ padding: 18px 16px 18px 16px }
  .dimar-sale-content .dimar-sale-title{ font-size:26px }
  .dimar-sale-specs{ gap:10px }
}

/* ================================
   BOOKING MODAL (MotoPress) UI
   Light theme
================================ */
#bookingModal .modal-panel{
  max-height:90vh;
  overflow-y:auto;
}
#bookingModalContent{ margin-top:14px }

.dimar-booking-loading,
.dimar-booking-error{
  padding:16px;
  border-radius:14px;
  background: rgba(255,255,255,.88);
  border: 1px solid var(--stroke);
  color: rgba(46,46,46,.85);
  box-shadow: var(--shadow);
}
.dimar-booking-error b{ color: var(--accent2) }

/* =========================================================
   BOOKING PAGE (remove forced dark backgrounds)
========================================================= */
body.dimar-booking-page{
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* fallback for booking shell route */
body:has(.dimar-booking-shell),
html:has(.dimar-booking-shell){
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* Remove any dark pseudo overlays from previous version */
body:has(.dimar-booking-shell)::before{
  content:none !important;
}

.dimar-booking-shell{
  width: min(1180px,92%) !important;
  margin: 70px auto 90px !important;
}

/* cards */
.dimar-booking-shell .dimar-card,
body.dimar-booking-page .dimar-card{
  background: rgba(255,255,255,.92) !important;
  border: 1px solid var(--stroke) !important;
  box-shadow: var(--shadow) !important;
  border-radius: 18px !important;
}

/* headings */
body.dimar-booking-page .dimar-h1{
  color: var(--accent) !important;
}
body.dimar-booking-page .dimar-sub,
body.dimar-booking-page .dimar-loc,
body.dimar-booking-page .dimar-note{
  color: rgba(46,46,46,.70) !important;
}

/* labels */
body.dimar-booking-page .dimar-field label{
  color: rgba(46,46,46,.78) !important;
}

/* inputs */
body.dimar-booking-page .dimar-field input,
body.dimar-booking-page .dimar-field textarea{
  width:100% !important;
  background:#FFFFFF !important;
  border: 1px solid var(--stroke2) !important;
  color: var(--text) !important;
  border-radius:12px !important;
  padding:11px 12px !important;
  font-size:14px !important;
  line-height:1.2 !important;
  min-height:44px !important;
  box-shadow:none !important;
  outline:none !important;
}

body.dimar-booking-page .dimar-field input::placeholder,
body.dimar-booking-page .dimar-field textarea::placeholder{
  color: var(--muted) !important;
}

/* selects */
body.dimar-booking-page .dimar-field select{
  width:100% !important;
  background:#FFFFFF !important;
  border: 1px solid var(--stroke2) !important;
  color: var(--text) !important;
  border-radius:12px !important;
  padding:11px 40px 11px 12px !important;
  font-size:14px !important;
  line-height:1.2 !important;
  min-height:44px !important;
  box-shadow:none !important;
  outline:none !important;

  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;

  background-image:
    linear-gradient(45deg, transparent 50%, rgba(46,46,46,.65) 50%),
    linear-gradient(135deg, rgba(46,46,46,.65) 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat:no-repeat;
}

/* focus */
body.dimar-booking-page .dimar-field input:focus,
body.dimar-booking-page .dimar-field textarea:focus,
body.dimar-booking-page .dimar-field select:focus{
  border-color: rgba(91,127,166,.70) !important;
  box-shadow: 0 0 0 3px rgba(91,127,166,.16) !important;
}

/* button */
body.dimar-booking-page .dimar-btn,
.dimar-booking-shell .dimar-btn{
  width:100% !important;
  border:none !important;
  border-radius:14px !important;
  padding:14px 16px !important;
  background: linear-gradient(135deg, var(--accent), #6F95BB) !important;
  color:#FFFFFF !important;
  font-weight:850 !important;
  font-size:16px !important;
  cursor:pointer !important;
  box-shadow: 0 12px 26px rgba(91,127,166,.20) !important;
  margin-top:18px !important;
  margin-bottom:26px !important;
}

body.dimar-booking-page .dimar-btn:hover{
  filter: brightness(1.03) !important;
  transform: translateY(-1px) !important;
}

/* Right sidebar */
body.dimar-booking-page .dimar-side .price{
  color: var(--text) !important;
}

/* booking form spacing */
body.dimar-booking-page .booking-form,
body.dimar-booking-page .dimar-card .booking-form{
  padding-bottom:32px !important;
}

/* ==========================
   Flatpickr – LIGHT readable
========================== */
.flatpickr-calendar{
  background: #FFFFFF;
  color: var(--text);
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
}
.flatpickr-months,
.flatpickr-current-month,
.flatpickr-current-month .cur-month,
.flatpickr-current-month .numInputWrapper,
.flatpickr-current-month input.cur-year{
  color: var(--text) !important;
}
.flatpickr-weekdays,
.flatpickr-weekday{
  color: rgba(46,46,46,.70) !important;
  font-weight:600;
}
.flatpickr-day{
  color: rgba(46,46,46,.92) !important;
}
.flatpickr-day:hover{
  background: var(--accentSoft);
}
.flatpickr-day.disabled,
.flatpickr-day.disabled:hover{
  color: rgba(46,46,46,.25) !important;
}
.flatpickr-day.today{
  border-color: rgba(91,127,166,.70) !important;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.inRange{
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #FFFFFF !important;
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg{
  fill: rgba(46,46,46,.75) !important;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg{
  fill: rgba(46,46,46,.95) !important;
}

/* ==========================
   Elegant scrollbars (neutral)
========================== */
::-webkit-scrollbar{ width:10px; height:10px }
::-webkit-scrollbar-track{
  background: rgba(0,0,0,0.03);
  border-radius:999px;
}
::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(91,127,166,.55), rgba(91,127,166,.28));
  border-radius:999px;
  border: 2px solid rgba(245,243,238,.95);
}
::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, rgba(91,127,166,.70), rgba(91,127,166,.40));
}
body{
  scrollbar-width: thin;
  scrollbar-color: rgba(91,127,166,.55) rgba(0,0,0,0.03);
}

/* ==========================================
   FLUENT FORM #3 – LIGHT COMFORT (SCOPED)
========================================== */
.fluentform_wrapper_3 #fluentform_3{
  max-width:520px !important;
  padding:28px !important;
  border-radius:22px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid var(--stroke) !important;
  box-shadow: var(--shadow2) !important;
  backdrop-filter: blur(14px) !important;
}

.fluentform_wrapper_3 #fluentform_3 .ff-el-input--label label{
  font-size:13px !important;
  color: rgba(46,46,46,.72) !important;
  margin-bottom:6px !important;
}

/* inputs */
.fluentform_wrapper_3 #fluentform_3 .ff-el-form-control{
  background: #FFFFFF !important;
  border: 1px solid var(--stroke2) !important;
  border-radius:14px !important;
  padding:14px 16px !important;
  color: var(--text) !important;
  font-size:14px !important;
  box-shadow:none !important;
  outline:none !important;
}

.fluentform_wrapper_3 #fluentform_3 .ff-el-form-control::placeholder{
  color: var(--muted) !important;
}

.fluentform_wrapper_3 #fluentform_3 .ff-el-form-control:focus{
  border-color: rgba(91,127,166,.70) !important;
  box-shadow: 0 0 0 3px rgba(91,127,166,.16) !important;
}

.fluentform_wrapper_3 #fluentform_3 textarea.ff-el-form-control{
  min-height:130px !important;
  resize:none !important;
}

.fluentform_wrapper_3 #fluentform_3 .ff-el-group{
  margin-bottom:18px !important;
}

/* submit button */
.fluentform_wrapper_3 #fluentform_3 .ff_submit_btn_wrapper .ff-btn,
.fluentform_wrapper_3 #fluentform_3 button.ff-btn{
  width:100% !important;
  margin-top:10px !important;
  padding:16px !important;
  border-radius:16px !important;
  border:none !important;
  font-size:15px !important;
  font-weight:750 !important;
  color:#FFFFFF !important;
  background: linear-gradient(135deg, var(--accent), #6F95BB) !important;
  box-shadow: 0 14px 30px rgba(91,127,166,.22) !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}

.fluentform_wrapper_3 #fluentform_3 .ff_submit_btn_wrapper .ff-btn:hover,
.fluentform_wrapper_3 #fluentform_3 button.ff-btn:hover{
  transform: translateY(-1px) !important;
  box-shadow: 0 20px 40px rgba(91,127,166,.26) !important;
}

/* 2 columns spacing */
.fluentform_wrapper_3 #fluentform_3 .ff-t-container{ gap:18px !important; }
.fluentform_wrapper_3 #fluentform_3 .ff-t-cell{
  padding-right:9px !important;
  padding-left:9px !important;
}

/* mobile */
@media (max-width:600px){
  .fluentform_wrapper_3 #fluentform_3{ padding:22px !important; }
  .fluentform_wrapper_3 #fluentform_3 .ff-t-cell{
    padding-right:0 !important;
    padding-left:0 !important;
  }
}

/* 1) Remove the washed overlay by default */
.card-media::before{
  background: none !important;
}

/* 2) Add a soft overlay ONLY on hover (nice premium effect) */
.card-hover:hover .card-media::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.00) 0%,
    rgba(0,0,0,0.06) 55%,
    rgba(0,0,0,0.18) 100%
  ) !important;
}

/* =========================================
   SALE MODAL – CORRECT SCROLL (panel scrolls)
   One scroll container: .dimar-sale-panel
========================================= */
html.dimar-modal-open,
body.dimar-modal-open{
  overflow: hidden !important;
}

#dimarSaleModal{
  position: fixed !important;
  inset: 0 !important;
}

/* PANEL scrolls (this is the key) */
#dimarSaleModal .dimar-sale-panel{
  max-height: 88vh !important;
  overflow-y: auto !important;         /* <-- scroll HERE */
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  display: block !important;            /* kill flex scroll setup */
}

/* Make sure inner areas DO NOT create their own vertical scrollbars */
#dimarSaleModal .dimar-sale-main,
#dimarSaleModal .dimar-sale-thumbs,
#dimarSaleModal .dimar-sale-content,
#dimarSaleModal .dimar-sale-scroll{
  overflow: visible !important;         /* <-- no nested scroll */
  flex: initial !important;
  min-height: auto !important;
}

/* thumbs only horizontal scroll */
#dimarSaleModal .dimar-sale-thumbs{
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

/* (Optional) smoother look for the panel scrollbar */
#dimarSaleModal .dimar-sale-panel{
  scrollbar-width: thin;
  scrollbar-color: rgba(91,127,166,.45) rgba(0,0,0,0.06);
}
#dimarSaleModal .dimar-sale-panel::-webkit-scrollbar{
  width: 10px;
}
#dimarSaleModal .dimar-sale-panel::-webkit-scrollbar-track{
  background: rgba(0,0,0,0.05);
  border-radius: 999px;
}
#dimarSaleModal .dimar-sale-panel::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(91,127,166,.55), rgba(91,127,166,.28));
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.75);
}

/* Booking Lightbox */
.dimar-booking-lightbox[aria-hidden="true"] { display: none; }
.dimar-booking-lightbox{
  position: fixed;
  inset: 0;
  z-index: 99999;
}

.dimar-booking-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.75);
}

.dimar-booking-panel{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.dimar-booking-image{
  max-width: min(1100px, 92vw);
  max-height: 86vh;
  object-fit: contain;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
}

.dimar-booking-close{
  position: absolute;
  top: 18px;
  right: 18px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(15,15,15,.75);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}

.dimar-booking-nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 54px;
  height: 54px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(15,15,15,.75);
  color: #fff;
  font-size: 34px;
  cursor: pointer;
  display: grid;
  place-items: center;
}

.dimar-booking-prev{ left: 18px; }
.dimar-booking-next{ right: 18px; }

.ti-widget.ti-goog .ti-footer-filter-text {
    color: #f7f2ea !important;
  
}