/*
 Theme Name:   My Listing Child
 Theme URI:    http://mylisting.27collective.net/my-city/
 Description:  MyListing Child Theme
 Author:       27collective
 Author URI:   https://27collective.net/
 Template:     my-listing
 Version:      1.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         one-column, two-columns, three-columns, left-sidebar, right-sidebar, grid-layout, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
 Text Domain:  my-listing-child
*/

:root {
  --cs-red: #c0392b;
  --cs-red-dark: #922b21;
  --cs-blue: #1a3a6e;
  --cs-blue-card: #e4edf9;
  --cs-blue-card-border: #c2d4ee;
  --cs-blue-tag: #cddaf5;
  --cs-blue-tag-text: #1a3a6e;
  --cs-blue-btn: #cddaf5;
  --cs-blue-btn-text: #1a3a6e;
  --cs-green-bg: #d5f0e0;
  --cs-green-text: #166534;
  --cs-text-primary: #0d1e36;
  --cs-text-secondary: #3a5478;
  --cs-text-muted: #7a90aa;
}

/* ============================================================
   RESET GLOBAL
   ============================================================ */
*, *::before, *::after {
  word-spacing: normal !important;
  letter-spacing: normal !important;
}
body, p, h1, h2, h3, h4, h5, h6, span, li, a, div {
  word-spacing: normal !important;
  letter-spacing: normal !important;
}

/* Previne scroll orizontal pe mobil */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Fix scroll orizontal Android — .i-nav (meniu slide-in) e pozitionat la 350px
   in afara viewport-ului si extinde body.scrollWidth la 909px. */
.c27-main-header {
    overflow-x: hidden !important;
}

@media only screen and (max-width: 768px) {

  /* Bara originala primary-filters ascunsa vizual — Vue o controleaza intern */
  .mobile-explore-head-top {
    display: none !important;
  }

  /* Harta */
  .finder-map { display: none !important; }
  .finder-map.map-mobile-visible { display: block !important; height: 80vw !important; min-height: 300px !important; }

  /* ============================================================
     HEADER MOBIL CUSTOM
     ============================================================ */
  .cs-mobile-header {
    background: var(--cs-blue);
    width: 100%;
    box-sizing: border-box;
    padding: 10px 14px 12px;
    display: flex;
    flex-direction: column;
    gap: 7px;
  }

  /* Toast */
  .cs-loc-toast {
    display: flex;
    align-items: center;
    gap: 7px;
    background: rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 11px;
    color: #d4f0e2;
    font-weight: 500;
  }
  .cs-toast-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #27ae60;
    flex-shrink: 0;
    display: inline-block;
  }

  /* Rand locatie */
  .cs-loc-row {
    display: flex;
    align-items: center;
    background: rgba(255,255,255,0.13);
    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 9px;
    padding: 8px 10px;
    gap: 8px;
  }
  .cs-loc-meta {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    gap: 2px;
  }
  .cs-loc-label {
    font-size: 10px;
    color: rgba(255,255,255,0.45);
  }

  /* Input locatie din header */
  .cs-mobile-header .ehs-location {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    flex: 1 !important;
    min-height: 0 !important;
  }
  .cs-mobile-header .ehs-location .mi.search {
    display: none !important;
  }
  .cs-mobile-header .ehs-location input {
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    border: none !important;
    border-bottom: none !important;
    background: transparent !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    flex: 1 !important;
  }
  /* Textul de sugestie din header-ul mobil. Inputurile sunt construite din
     JS (cs-header-mobil.js) cu stiluri inline pe `color`, dar placeholderul
     nu poate fi setat inline, asa ca ramanea pe implicitul inchis al temei:
     2,03:1 pe fundalul randului (#385481) — practic invizibil pe telefon.
     #cddaf5 este --cs-blue-tag, deci ramane in paleta; da 5,43:1.
     Regula generala acopera si campul de adresa (#cs-loc-input) si cel de
     cautare, care nu stau in .ehs-location. 2026-09-15 */
  .cs-mobile-header input::placeholder,
  .cs-mobile-header .ehs-location input::placeholder,
  #cs-loc-input::placeholder {
    color: #cddaf5 !important;
    opacity: 1 !important;
  }
  .cs-mobile-header .ehs-location .geocode-location {
    position: static !important;
    bottom: auto !important;
    right: auto !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 50% !important;
    border: 1px solid rgba(248,113,113,0.5) !important;
    background: rgba(192,57,43,0.3) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17px !important;
    color: #f87171 !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
  }

  /* Rand distanta */
  .cs-dist-row {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.13);
    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 9px;
    padding: 8px 10px;
    cursor: pointer;
  }
  .cs-dist-meta {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 2px;
  }
  .cs-dist-label {
    font-size: 10px;
    color: rgba(255,255,255,0.45);
  }
  .cs-dist-val {
    font-size: 13px;
    font-weight: 600;
    color: #ffffff;
  }
  /* Ascunde slider-ul din randul de distanta */
  .cs-dist-row .proximity-filter {
    display: none !important;
  }
  .cs-dist-arrow {
    color: rgba(255,255,255,0.35) !important;
    font-size: 18px !important;
    flex-shrink: 0 !important;
  }

  /* Buton Filtre */
  .cs-filters-row { display: flex; align-items: center; }
  .cs-filters-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: var(--cs-red) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 8px 14px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
  }
  .cs-filters-btn:hover, .cs-filters-btn:active {
    background: var(--cs-red-dark) !important;
    color: #ffffff !important;
  }
  .cs-filters-btn i { font-size: 14px !important; }

  /* Navigatie mobila */
  .explore-mobile-nav {
    background: var(--cs-blue) !important;
    padding: 0 14px 10px !important;
    border: none !important;
  }
  .explore-mobile-nav .nav.nav-tabs {
    border: none !important; display: flex !important; gap: 8px !important; margin: 0 !important;
  }
  .explore-mobile-nav .nav-tabs > li {
    float: none !important; flex: 1 !important; margin: 0 !important; border: none !important;
  }
  .explore-mobile-nav .nav-tabs > li > a {
    display: flex !important; align-items: center !important; justify-content: center !important;
    gap: 6px !important; background: rgba(255,255,255,0.12) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    border-bottom: 1px solid rgba(255,255,255,0.2) !important;
    border-radius: 8px !important; padding: 7px 11px !important;
    font-size: 12px !important; font-weight: 500 !important;
    color: #ffffff !important; text-decoration: none !important; margin: 0 !important;
  }
  .explore-mobile-nav .nav-tabs > li.active > a {
    background: rgba(255,255,255,0.22) !important;
    border-color: rgba(255,255,255,0.35) !important;
    color: #ffffff !important;
  }
  .explore-mobile-nav .nav-tabs > li > a i { font-size: 14px !important; color: #ffffff !important; }

  /* Results */
  .finder-listings .explore-desktop-head {
    display: flex !important; justify-content: center !important;
    padding: 8px 16px !important; background: #ffffff !important;
  }
  .finder-listings .load-previews-batch,
  .finder-listings .load-next-batch { display: none !important; }
  .finder-listings { background: #ffffff !important; }
  .finder-listings .results-view { padding: 0 10px !important; }

}

/* ============================================================
   CARDURI
   ============================================================ */
.listing-feed .results-wrapper,
.c27-explore-listings-wrapper,
.explore-listings-wrapper {
  background: #ffffff !important;
  padding: 0 10px !important;
}

.lf-item-container {
  background: var(--cs-blue-card) !important;
  border: 1px solid var(--cs-blue-card-border) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin-bottom: 10px !important;
  box-shadow: none !important;
}
.lf-item-container::before {
  content: '' !important; display: block !important;
  height: 3px !important; background: var(--cs-red) !important; width: 100% !important;
}
.lf-item-container .lf-background,
.lf-item-container .overlay,
.lf-item-container .lf-head,
.lf-item-container .lf-avatar,
.lf-item-container .lf-item > a,
.lf-item-container .c27-footer-section,
.lf-item-container .listing-details,
.lf-item-container .listing-details-3,
.lf-item-container .event-host { display: none !important; }
.lf-item-container .lf-item {
  height: auto !important; min-height: 0 !important;
  background: transparent !important; overflow: visible !important;
}

.cs-card-body { padding: 12px 14px 13px; background: var(--cs-blue-card); }
.cs-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 4px; }
.cs-card-name {
  font-size: 15px !important; font-weight: 600 !important; color: var(--cs-text-primary) !important;
  margin: 0 !important; padding: 0 !important; text-shadow: none !important; line-height: 1.2 !important;
  flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cs-open-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; border-radius: 999px; padding: 4px 10px; flex-shrink: 0; white-space: nowrap; }
.cs-open-badge.cs-status-open   { background: var(--cs-green-bg); color: var(--cs-green-text); }
.cs-open-badge.cs-status-closed { background: #d0dcea; color: #4a5a6e; } /* 2026-09-11 contrast: era #7a8ca0 (2,48:1), acum 5,07:1 */
.cs-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.cs-status-open .cs-dot   { background: #27ae60; }
.cs-status-closed .cs-dot { background: #9aacc0; }
.cs-card-loc { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; overflow: visible; }
.cs-loc-city { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; font-size: 15px; font-weight: 700; color: var(--cs-red); }
.cs-pin { display: inline-block; width: 8px; height: 8px; border-radius: 50% 50% 50% 0; background: var(--cs-red); transform: rotate(-45deg); flex-shrink: 0; }
.cs-loc-sep { color: #566c90; font-size: 16px; line-height: 1; flex-shrink: 0; } /* 2026-09-11 contrast: era var(--cs-blue-card-border) (1,27:1), acum 4,51:1 */
.cs-loc-distance { white-space: nowrap; font-size: 15px; font-weight: 700; color: var(--cs-red); }
.cs-divider { height: 1px; background: #bccfe8; margin: 0 0 8px; }
.cs-rating-row { display: flex; align-items: center; gap: 5px; margin-bottom: 8px; }
.cs-stars { color: #f59e0b; font-size: 14px; letter-spacing: 1px; }
.cs-rating-num { font-size: 14px; font-weight: 600; color: var(--cs-text-primary); }
.cs-rating-count { font-size: 13px; color: var(--cs-text-muted); }
.cs-tags-row {
  display: flex; flex-wrap: nowrap; gap: 5px; margin-bottom: 12px;
  overflow: hidden; height: 26px; align-items: center; position: relative;
}
.cs-tags-row .cs-tag {
  min-width: 0; flex-shrink: 1;
  overflow: hidden; text-overflow: ellipsis;
}
.cs-tag-extra { display: none !important; }
/* Butonul ··· — spatiu fix rezervat pe dreapta */
.cs-tags-more {
  flex-shrink: 0; flex-grow: 0;
  height: 22px; padding: 0 10px; margin-left: auto;
  background: var(--cs-blue); border: none; border-radius: 6px;
  font-size: 13px; font-weight: 700; letter-spacing: 3px;
  color: #fff; cursor: pointer;
  line-height: 1; display: inline-flex; align-items: center;
  transition: background 0.15s;
}
.cs-tags-more:hover, .cs-tags-more.active { background: var(--cs-red); }
/* Dropdown — ascuns in DOM, continut copiat in #cs-float-dropdown via JS */
.cs-tags-dropdown { display: none !important; }
.cs-tag {
  display: inline-flex; align-items: center; font-size: 13px; font-weight: 500;
  color: var(--cs-blue-tag-text); background: var(--cs-blue-tag);
  padding: 4px 10px; border-radius: 6px; white-space: nowrap; flex-shrink: 0; height: 26px;
}
.cs-card-actions { display: flex; gap: 8px; }
.cs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  background: var(--cs-blue-btn) !important; color: var(--cs-blue-btn-text) !important;
  border: none !important; border-radius: 9px !important; padding: 10px 13px !important;
  font-size: 14px !important; font-weight: 600 !important; text-decoration: none !important;
  line-height: 1.3 !important; transition: background 0.15s, color 0.15s;
  -webkit-tap-highlight-color: transparent; cursor: pointer;
  text-shadow: none !important; box-shadow: none !important; white-space: nowrap;
}
.cs-btn-call { flex: 1; }
.cs-btn-detail { flex-shrink: 0; }
.cs-btn:hover, .cs-btn:active, .cs-btn:focus {
  background: var(--cs-red) !important; color: #ffffff !important; text-decoration: none !important;
}
.cs-btn svg { flex-shrink: 0; }
.cs-card-body, .cs-card-body * { text-shadow: none !important; }

/* ============================================================
   SEO FIX — Ascunde H2 gol generat de MyListing
   ============================================================ */
h2.case27-primary-text:empty {
  display: none !important;
}

/* ============================================================
   DESIGN TEXT SEO — Professional
   ============================================================ */

/* H1 — fundal alb, titlu albastru, linie rosie */
.elementor-element-utalg80 {
  background: #ffffff !important;
  padding: 24px 32px 0px !important;
  margin-bottom: 0 !important;
}
.elementor-element-utalg80 h1.elementor-heading-title {
  color: #1a3a6e !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-shadow: none !important;
  word-spacing: normal !important;
  letter-spacing: normal !important;
  display: inline-block !important;
  padding-bottom: 10px !important;
  border-bottom: 3px solid #c0392b !important;
  margin-bottom: 0 !important;
}

/* Paragraf introductiv - fara fundal albastru */
.elementor-element-af933d0 {
  background: transparent !important;
  padding: 20px 40px 8px !important;
  margin-top: 0 !important;
}
.elementor-element-af933d0 p {
  color: #2d4a6e !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  word-spacing: normal !important;
  letter-spacing: normal !important;
}
.elementor-element-af933d0 strong,
.elementor-element-af933d0 b {
  color: var(--cs-blue) !important;
  font-weight: 700 !important;
}



/* Desktop — H2, H3, paragrafe, imagini, separatoare */
@media only screen and (min-width: 769px) {

  /* Reduce spatiul dintre widgeturile Elementor */
  .elementor-widget-wrap > .elementor-element { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  .elementor-widget-heading { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  .elementor-widget-text-editor { margin-top: 0 !important; padding-top: 0 !important; margin-bottom: 0 !important; padding-bottom: 0 !important; }

  /* H2 */
  .elementor-widget-heading h2.elementor-heading-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    background: var(--cs-blue) !important;
    margin: 12px 0 0 0 !important;
    padding: 8px 14px !important;
    border-left: 4px solid var(--cs-red) !important;
    border-radius: 0 4px 4px 0 !important;
    line-height: 1.3 !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
    display: block !important;
  }

  /* H3 */
  .elementor-widget-heading h3.elementor-heading-title {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--cs-blue) !important;
    margin: 6px 0 0 0 !important;
    padding: 5px 12px !important;
    background: #eef3fc !important;
    border-left: 3px solid var(--cs-red) !important;
    border-radius: 0 4px 4px 0 !important;
    line-height: 1.35 !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
    display: block !important;
  }

  /* Paragrafe */
  .elementor-widget-text-editor p {
    color: #374151 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
  }
  .elementor-widget-text-editor strong,
  .elementor-widget-text-editor b { color: var(--cs-blue) !important; font-weight: 600 !important; }
  .elementor-widget-text-editor ul { padding-left: 0 !important; list-style: none !important; margin: 2px 0 4px 0 !important; }
  .elementor-widget-text-editor ul li { padding: 1px 0 1px 16px !important; position: relative !important; color: #374151 !important; font-size: 13.5px !important; line-height: 1.5 !important; word-spacing: normal !important; }
  .elementor-widget-text-editor ul li::before { content: '' !important; position: absolute !important; left: 0 !important; top: 8px !important; width: 5px !important; height: 5px !important; border-radius: 50% !important; background: var(--cs-red) !important; }
  .elementor-widget-heading + .elementor-widget-text-editor p { margin-top: 2px !important; }
  .elementor-widget-text-editor p { border-left: none !important; padding-left: 0 !important; }
  .elementor-widget-text-editor .elementor-widget-container { padding-left: 10px !important; border-left: 2px solid var(--cs-blue-card-border) !important; }
  .elementor-widget-text-editor ul { border-left: none !important; padding-left: 0 !important; }
  .elementor-widget-text-editor ul li { border-left: none !important; }

  /* Imagini */
  .elementor-widget-image img,
  .elementor-widget-image .elementor-image img {
    width: 100% !important;
    height: 340px !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    border-radius: 14px !important;
    border: 4px solid #ffffff !important;
    outline: 2px solid var(--cs-blue-card-border) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.07), 0 8px 24px rgba(26,58,110,0.18), 0 20px 48px rgba(26,58,110,0.10) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  }
  .elementor-widget-image img:hover,
  .elementor-widget-image .elementor-image img:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.09), 0 16px 40px rgba(26,58,110,0.24), 0 32px 64px rgba(26,58,110,0.12) !important;
  }

  /* Separator */
  .elementor-widget-divider .elementor-divider-separator {
    border: none !important;
    height: 2px !important;
    background: linear-gradient(to right, var(--cs-red), var(--cs-blue), #c2d4ee) !important;
    border-radius: 2px !important;
    opacity: 0.55 !important;
  }

  /* Butoane */
  .elementor-widget-button .elementor-button,
  .elementor-button-wrapper .elementor-button {
    background: var(--cs-blue) !important;
    color: #ffffff !important;
    border: 1px solid rgba(26,58,110,0.3) !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 10px 20px !important;
    transition: background 0.2s, transform 0.15s !important;
    text-decoration: none !important;
    letter-spacing: normal !important;
  }
  .elementor-widget-button .elementor-button:hover,
  .elementor-button-wrapper .elementor-button:hover {
    background: var(--cs-red) !important;
    border-color: var(--cs-red-dark) !important;
    transform: translateY(-2px) !important;
    color: #ffffff !important;
  }

  /* Logo bicolor */
  .header-logo-text { font-size: 0 !important; text-decoration: none !important; }
  .header-logo-text::before { content: 'Centre' !important; font-size: 20px !important; font-weight: 700 !important; color: #ffffff !important; letter-spacing: normal !important; }
  .header-logo-text::after { content: 'Service' !important; font-size: 20px !important; font-weight: 700 !important; color: #c0392b !important; letter-spacing: normal !important; }

}

/* Bara Firme/Harta/Filtre — ascunsa implicit, vizibila doar pe paginile explore */
@media only screen and (min-width: 769px) {
  #cs-bottom-nav { display: none !important; }
}
@media only screen and (max-width: 768px) {
  #cs-bottom-nav { display: none !important; }
  body.cs-explore-page { padding-bottom: 60px !important; }
  body.cs-explore-page .explore-mobile-nav { display: none !important; }
  body.cs-explore-page #cs-bottom-nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 99999;
    background: #1a3a6e; border-top: 1px solid rgba(255,255,255,0.1);
    display: flex !important; align-items: center; height: 56px;
  }
  body.cs-explore-page #cs-bottom-nav a {
    flex: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 3px;
    text-decoration: none; color: rgba(255,255,255,0.7); padding: 6px 0; /* 2026-09-13 contrast: era 0.45 (3,58:1), acum 6,36:1 */
    -webkit-tap-highlight-color: transparent; font-size: 10px; font-weight: 500;
  }
  body.cs-explore-page #cs-bottom-nav a i { font-size: 22px; line-height: 1; }
  body.cs-explore-page #cs-bottom-nav a.cs-nav-active { color: #ffffff; }
}

/* Ascunde butonul Cauta de sus din panoul de filtre — inlocuit cu butonul fix jos */
@media (max-width: 768px) {
  .c27-explore-search-button { display: none !important; }
}

/* Pe mobil, ascunde din filtre campurile deja prezente in header */
@media (max-width: 768px) {
  #finderSearch .orderby-filter,
  #finderSearch .keyword-filter,
  #finderSearch .keywords-filter,
  #finderSearch .wp-search-filter,
  #finderSearch .location-filter,
  #finderSearch .Location-filter { display: none !important; }
}

/* Google Maps Autocomplete dropdown */
.pac-container {
  background: #fff !important;
  border: 1px solid #c2d4ee !important;
  border-radius: 10px !important;
  margin-top: 4px !important;
  box-shadow: 0 8px 24px rgba(26,58,110,0.15) !important;
  font-family: inherit !important;
  z-index: 999999 !important;
}

/* Mobil — dropdown sugestii ocupa toata latimea ecranului */
@media only screen and (max-width: 1024px) {
  .pac-container {
    width: calc(100vw - 28px) !important;
    left: 14px !important;
    right: 14px !important;
    box-sizing: border-box !important;
  }
  .pac-item {
    white-space: normal !important;
    word-break: break-word !important;
  }
  .pac-item-query { font-size: 14px !important; }
  .pac-item span { font-size: 13px !important; }
}

/* Mobil — dropdown sugestii ocupa toata latimea ecranului */
@media only screen and (max-width: 1024px) {
  .pac-container {
    width: calc(100vw - 28px) !important;
    left: 14px !important;
    right: 14px !important;
    box-sizing: border-box !important;
  }
  .pac-item {
    white-space: normal !important;
    word-break: break-word !important;
  }
  .pac-item-query {
    font-size: 14px !important;
  }
  .pac-item span {
    font-size: 13px !important;
  }
}
.pac-item {
  border-top: 1px solid #e8eef6 !important;
  padding: 9px 12px !important;
  cursor: pointer !important;
  color: #1a3a6e !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}
.pac-item:first-child { border-top: none !important; }
.pac-item:hover, .pac-item-selected { background: #e4edf9 !important; }
.pac-item-query { color: #1a3a6e !important; font-weight: 600 !important; font-size: 13px !important; }
.pac-item span { color: #555 !important; font-size: 12px !important; }
.pac-matched { color: #c0392b !important; font-weight: 700 !important; }
.pac-logo:after { display: none !important; }

/* ============================================================
   CENTRESERVICE — Ascunde slider distanta din panoul de filtre
   ============================================================ */
@media only screen and (max-width: 1024px) {
    .radius.proximity-slider.explore-filter.proximity-filter {
        display: none !important;
    }
}

/* ============================================================
   CENTRESERVICE — Fix dropdown meniu navigatie
   ============================================================ */
.c27-main-header {
    overflow: visible !important;
}

/* ============================================================
   CENTRESERVICE — Meniu utilizator mobil (Bottom Sheet)
   ============================================================ */

/* Desktop: ascunde butonul mobil al userului */
.cs-user-mobile-only {
    display: none;
}

/* Desktop: pastreaza dropdown-ul original vizibil */
.cs-user-desktop-only {
    display: flex;
    align-items: center;
}

/* Mobil: inversam vizibilitatea */
@media screen and (max-width: 1200px) {

    .cs-user-desktop-only {
        display: none !important;
    }

    .cs-user-mobile-only {
        display: flex;
        align-items: center;
    }

    .cs-mobile-user-btn {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        padding: 0;
        background: transparent;
        border: none;
        cursor: pointer;
        border-radius: 50%;
        -webkit-tap-highlight-color: transparent;
        transition: background 0.15s ease;
    }

    .cs-mobile-user-btn:active {
        background: rgba(255, 255, 255, 0.12);
    }

    .cs-mob-avatar {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        overflow: hidden;
        border: 2px solid rgba(255, 255, 255, 0.6);
        transition: border-color 0.15s ease;
    }

    .cs-mobile-user-btn:active .cs-mob-avatar,
    .cs-mobile-user-btn[aria-expanded="true"] .cs-mob-avatar {
        border-color: #fff;
    }

    .cs-mob-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .cs-user-online-dot {
        position: absolute;
        bottom: 2px;
        right: 2px;
        width: 9px;
        height: 9px;
        background: #4CAF50;
        border-radius: 50%;
        border: 2px solid #1a2e44;
        pointer-events: none;
    }
}

/* Bottom Sheet */
.cs-bottom-sheet {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 999999;
}

.cs-bottom-sheet.cs-sheet-open {
    display: block;
}

.cs-bottom-sheet-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    transition: background 0.3s ease;
    cursor: pointer;
}

.cs-bottom-sheet.cs-sheet-open .cs-bottom-sheet-overlay {
    background: rgba(0, 0, 0, 0.45);
}

.cs-bottom-sheet-panel {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #ffffff;
    border-radius: 20px 20px 0 0;
    padding-bottom: env(safe-area-inset-bottom, 12px);
    transform: translateY(100%);
    transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
    will-change: transform;
    max-height: 85vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.cs-bottom-sheet.cs-sheet-open .cs-bottom-sheet-panel {
    transform: translateY(0);
}

.cs-sheet-handle {
    width: 40px;
    height: 4px;
    background: #D3D1C7;
    border-radius: 2px;
    margin: 12px auto 8px;
}

.cs-sheet-user-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px 16px;
    border-bottom: 1px solid #EEECE8;
}

.cs-sheet-avatar {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #E0DDD8;
}

.cs-sheet-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cs-sheet-user-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cs-sheet-username {
    font-size: 15px;
    font-weight: 600;
    color: #0D1B2A;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.cs-sheet-email {
    font-size: 12px;
    color: #5C6B7A;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.cs-sheet-close-btn {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #F1EFE8;
    border: none;
    cursor: pointer;
    color: #5C6B7A;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.15s ease;
}

.cs-sheet-close-btn:active {
    background: #E0DDD8;
}

.cs-sheet-close-btn .mi {
    font-size: 18px;
    line-height: 1;
}

.cs-sheet-nav {
    padding: 8px 0;
}

.cs-sheet-nav-item {
    display: flex;
    align-items: center;
    padding: 14px 24px;
    font-size: 15px;
    font-weight: 400;
    color: #0D1B2A;
    text-decoration: none;
    border-bottom: 1px solid #F1EFE8;
    transition: background 0.12s ease;
    -webkit-tap-highlight-color: transparent;
}

.cs-sheet-nav-item:last-child {
    border-bottom: none;
}

.cs-sheet-nav-item:active {
    background: #F5F1EB;
}

.cs-sheet-item-logout,
.cs-sheet-nav-item[href*="logout"],
.cs-sheet-nav-item[href*="deconect"] {
    color: #A32D2D !important;
    margin-top: 4px;
    border-top: 1px solid #F1EFE8;
}

@media screen and (max-width: 768px) {
    .cs-bottom-sheet-panel {
        padding-bottom: 72px;
    }
}

body.cs-sheet-is-open {
    overflow: hidden;
    touch-action: none;
}

/* ============================================================
   PROFILE BUILDER — Redesign form
   ============================================================ */

/* Fix zoom mobil */
.wppb-user-forms input[type="text"],
.wppb-user-forms input[type="email"],
.wppb-user-forms input[type="password"],
.wppb-user-forms input[type="tel"],
.wppb-user-forms input[type="number"],
.wppb-user-forms textarea,
.wppb-user-forms select {
    font-size: 16px !important;
    -webkit-text-size-adjust: 100% !important;
}

/* Fiecare camp — block cu label deasupra */
.wppb-user-forms li.wppb-form-field {
    display: block !important;
    margin-bottom: 16px !important;
}

/* Label — pe toata latimea, label si steluta pe acelasi rand */
.wppb-user-forms li.wppb-form-field > label {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 3px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1a3a6e !important;
    margin-bottom: 6px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    clear: both !important;
}

.wppb-user-forms li.wppb-form-field > label .wppb-required {
    flex-shrink: 0 !important;
    display: inline !important;
}

/* Inputuri full width */
.wppb-user-forms li.wppb-form-field input[type="text"],
.wppb-user-forms li.wppb-form-field input[type="email"],
.wppb-user-forms li.wppb-form-field input[type="password"],
.wppb-user-forms li.wppb-form-field input[type="tel"],
.wppb-user-forms li.wppb-form-field textarea,
.wppb-user-forms li.wppb-form-field select {
    width: 100% !important;
    padding: 12px 14px !important;
    border: 1.5px solid #d1dae8 !important;
    border-radius: 8px !important;
    color: #0d1e36 !important;
    background: #f8fafc !important;
    box-sizing: border-box !important;
    display: block !important;
    float: none !important;
    clear: both !important;
}

.wppb-user-forms input:focus,
.wppb-user-forms textarea:focus {
    border-color: #1a3a6e !important;
    background: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(26,58,110,0.1) !important;
}

/* Indicator putere parola */
#pass-strength-result,
.wppb-user-forms #pass-strength-result {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    float: none !important;
    clear: both !important;
    margin-top: 6px !important;
    margin-left: 0 !important;
}

/* Text descriptiv sub camp — full width, wrap natural */
.wppb-user-forms .wppb-description-delimiter {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    clear: both !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
    font-size: 12px !important;
    color: #7a90aa !important;
    margin-top: 4px !important;
    white-space: normal !important;
    overflow: visible !important;
}

/* Ascunde br din descriere — forteaza textul pe o linie continua */
.wppb-user-forms .wppb-description-delimiter br {
    display: none !important;
}

/* Titluri sectiuni */
.wppb-user-forms .extra_field_heading {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #1a3a6e !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    border-bottom: 2px solid #e4edf9 !important;
    padding-bottom: 6px !important;
    margin: 24px 0 14px !important;
    display: block !important;
    width: 100% !important;
}

/* Checkbox GDPR */
.wppb-user-forms li.wppb-gdpr-checkbox label {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 10px !important;
    font-size: 13px !important;
    color: #3a5478 !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
}

.wppb-user-forms li.wppb-gdpr-checkbox label input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-top: 2px !important;
    accent-color: #1a3a6e !important;
    flex-shrink: 0 !important;
}

/* Checkbox termeni */
.wppb-user-forms li.wppb-checkbox-terms-and-conditions {
    display: block !important;
    background: #f0f4fa !important;
    border-radius: 8px !important;
    padding: 12px !important;
    margin-bottom: 10px !important;
}

.wppb-user-forms li.wppb-checkbox-terms-and-conditions label {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 10px !important;
    font-size: 13px !important;
    color: #3a5478 !important;
    line-height: 1.5 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.wppb-user-forms li.wppb-checkbox-terms-and-conditions label input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-top: 2px !important;
    accent-color: #1a3a6e !important;
    flex-shrink: 0 !important;
}

/* Mobil */
@media only screen and (max-width: 768px) {
    .wppb-user-forms {
        padding: 24px 16px !important;
        margin: 16px !important;
        border-radius: 12px !important;
    }
}

/*Scoatere likuri taxonomii pagina listing*/
.block-type-terms .social-nav li, .block-type-terms .listing-details li {
    pointer-events: none !important;
}


/* ============================================================
   Filtre pe mobil — panoul trebuie sa poata fi derulat
   ------------------------------------------------------------
   Cand se apasa "Filtre", JS-ul din functions.php blocheaza
   scroll-ul paginii (html/body overflow:hidden). Panoul
   #finderSearch e position:absolute cu min-height:100vh si
   creste pana la inaltimea continutului (~2300px), fara sa fie
   el insusi container de scroll — deci raman vizibile doar
   primele ~650px de filtre si restul sunt inaccesibile.

   Fix: panoul se lipeste de marginile containerului .cts-explore
   (care e deja dimensionat cat viewportul de sub header) si
   primeste propriul scroll. padding-bottom lasa loc butonului
   flotant "Cauta" si barei de jos.
   ============================================================ */
@media only screen and (max-width: 768px) {
    .cts-explore.mobile-tab-filters #finderSearch {
        top: 0 !important;
        bottom: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        padding-bottom: 150px !important;
        box-sizing: border-box;
    }
}

/* ============================================================
   GRILA DE ORASE DE PE PAGINILE HUB
   (/tractari-auto, /service-auto, /service-biciclete,
    /service-trotinete-electrice)

   Inainte: liste cu buline in care linkurile aveau exact culoarea
   textului normal (#242429), fara subliniere si fara ingrosare —
   singurul indiciu ca sunt linkuri era cursorul, care pe telefon
   nu exista. Acum sunt butoane, cu zona de atins de 48px.

   Clasa se pune pe <ul> in continutul paginii.
   ============================================================ */
.cs-orase-grid {
	list-style: none;
	margin: 18px 0 30px;
	padding: 0;
	display: grid;
	/* auto-fill + minmax: numarul de coloane se adapteaza singur la
	   latimea disponibila, fara media queries. */
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 10px;
}

.cs-orase-grid li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cs-orase-grid li a {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 12px 16px;
	box-sizing: border-box;
	background: var(--cs-blue, #1a3a6e);
	/* !important pe culoare: tema are reguli proprii pe `a` care ar
	   suprascrie altfel textul si l-ar face ilizibil pe fundal inchis. */
	color: #fff !important;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none !important;
	transition: background-color .15s ease, transform .06s ease;
}

.cs-orase-grid li a:hover,
.cs-orase-grid li a:focus {
	background: var(--cs-blue-dark, #122a52);
	color: #fff !important;
	text-decoration: none !important;
}

.cs-orase-grid li a:active {
	transform: translateY(1px);
}

.cs-orase-grid li a:focus-visible {
	outline: 3px solid #7aa7e6;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.cs-orase-grid li a { transition: none; }
	.cs-orase-grid li a:active { transform: none; }
}

/* ============================================================
   CONTAINERUL DE CONTINUT AL PAGINILOR HUB

   /tractari-auto avea latimea limitata printr-un style inline scris
   in continut; celelalte trei hub-uri nu aveau niciun container si
   textul se intindea pe toata latimea site-ului. Acum toate patru
   folosesc aceeasi clasa, deci valoarea se schimba dintr-un singur loc.

   900px e o alegere deliberata: paginile hub au paragrafe lungi si
   continue, spre deosebire de paginile de oras, unde textul e spart
   in sectiuni scurte si suporta 1740px. Testat la 1740px pe hub —
   randurile treceau de 200 de caractere si devenea greu de citit.
   ============================================================ */
.cs-hub-wrap {
	max-width: 900px;
	margin: 0 auto;
	padding: 24px 16px;
	box-sizing: border-box;
}

/* ------------------------------------------------------------
   IMAGINEA DIN PAGINILE HUB

   Cele patru imagini au proportii foarte diferite:
     tractari-servicii  723x961   (portret, 0,75)
     trotinete-hero    1400x1164  (1,20)
     biciclete-hero    1280x854   (1,50)
   Fara aceasta regula, la 900px latime imaginea de la tractari
   s-ar fi randat pe ~1196px inaltime, iar cea de la biciclete pe
   600px — adica exact ce nu vrem, hub-uri care arata diferit.

   aspect-ratio 3/2 + object-fit:cover le aduce pe toate la aceeasi
   inaltime randata (600px la 900px latime). Raportul e declarat in
   CSS, deci browserul rezerva spatiul inainte de a descarca fisierul
   si nu apare salt de layout (CLS), chiar daca atributele width si
   height din HTML raman cele reale ale fisierului.
   ------------------------------------------------------------ */
.cs-hub-wrap img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	object-position: center;
	border-radius: 6px;
	margin: 16px 0;
}

/* ============================================================
   2026-09-11 — Contrast (accesibilitate): linkurile din bannerul de
   cookie-uri Complianz. Culoarea Complianz #1e73be pe fundalul bannerului
   #b4e4f7 avea contrast 3,62:1 (minim 4,5:1). #0f5596 dă 5,57:1.
   Selectorul include „a” ca să aibă prioritate față de CSS-ul Complianz.
   ============================================================ */
.cmplz-cookiebanner .cmplz-links a.cmplz-link,
.cmplz-cookiebanner .cmplz-documents a { color: #0f5596; }


/* ============================================================
   2026-09-13 — Zona de sus a paginii principale: titlul (H1) și
   subtitlul. Textul e în Elementor (pagina 27, hero): widget Heading cu
   tag H1 + widget Text Editor. Aici sunt doar stilurile, legate prin
   clasele puse în Elementor → Avansat → Clase CSS: „cs-hero-h1" și
   „cs-hero-sub". Text alb cu umbră, ca să rămână lizibil peste oricare
   dintre imaginile din slideshow-ul de fundal.
   „!important" e necesar pentru că regula `.elementor-widget-text-editor p`
   de mai sus (13,5px, gri) e ea însăși marcată important, iar Elementor
   pune margin-bottom 0 pe widget-uri.
   ============================================================ */
.elementor-element.cs-hero-h1 { margin-bottom: 12px !important; }
.elementor-element.cs-hero-h1 .elementor-heading-title {
	color: #fff;
	font-size: 44px;
	line-height: 1.18;
	font-weight: 700;
	letter-spacing: -0.3px;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.55);
}
/* Spațiu mai mare între subtitlu și caseta de căutare. Coloana e centrată
   pe verticală, deci mărind distanța de sub subtitlu, titlul și subtitlul
   urcă, iar caseta coboară. */
.elementor-element.cs-hero-sub { margin-bottom: 58px !important; }
.elementor-element.cs-hero-sub .elementor-widget-container p {
	margin: 0 !important;
	color: #fff !important;
	font-size: 19px !important;
	line-height: 1.5 !important;
	font-weight: 400 !important;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6) !important;
}
@media (max-width: 1024px) {
	.elementor-element.cs-hero-h1 .elementor-heading-title { font-size: 34px; }
	.elementor-element.cs-hero-sub .elementor-widget-container p { font-size: 17px !important; }
}
@media (max-width: 640px) {
	.elementor-element.cs-hero-h1 { margin-bottom: 10px !important; }
	.elementor-element.cs-hero-h1 .elementor-heading-title { font-size: 26px; }
	.elementor-element.cs-hero-sub { margin-bottom: 34px !important; }
	.elementor-element.cs-hero-sub .elementor-widget-container p {
		font-size: 15px !important;
		line-height: 1.45 !important;
	}
}

/* ============================================================
   2026-09-13 — Cardurile de categorii de pe pagina principală nu mai sunt
   linkuri (vezi filtrul din functions.php). <a> a fost înlocuit cu
   <div class="cs-cat-card">, care e bloc, nu inline — punem explicit
   display:block ca aşezarea să rămână identică.
   ============================================================ */
.car-item > .cs-cat-card {
	display: block;
	color: inherit;
	text-decoration: none;
}


/* ============================================================
   2026-09-13 — Secțiunea de text de la finalul paginii principale.
   Conținutul e în Elementor (pagina 27, ultima secțiune): widget-uri
   Heading cu tag H2, Text Editor și Image. Aici e doar aspectul, ca să
   semene cu paginile de oraș și cu ghidurile.
   Notă: pe acest site Elementor NU redă clasele CSS puse pe secțiuni și
   coloane (le redă doar pe widget-uri), așa că țintim și id-ul secțiunii,
   „elementor-element-ad56c8a". Clasa „cs-home-text" e lăsată în Elementor
   ca să preia dacă se remediază. Dacă secțiunea e ștearsă și refăcută,
   id-ul se schimbă și trebuie actualizat aici.
   „!important" la paragrafe pentru că regula `.elementor-widget-text-editor p`
   de mai sus (13,5px, gri) e marcată important.
   ============================================================ */
.cs-home-text,
.elementor-element-ad56c8a {
	padding: 46px 0 54px;
	background: #fff;
}
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-heading { margin-bottom: 14px !important; }
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-heading-title {
	background: #1a3a6e;
	color: #fff;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	padding: 11px 18px;
	border-left: 5px solid #c0392b;
	border-radius: 3px;
}
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-text-editor { margin-bottom: 22px !important; }
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-text-editor p {
	margin: 0 0 12px !important;
	color: #333a45 !important;
	font-size: 16px !important;
	line-height: 1.68 !important;
}
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-text-editor p:last-child { margin-bottom: 0 !important; }
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-text-editor a {
	color: #1a3a6e;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-text-editor a:hover { color: #c0392b; }
:is(.cs-home-text, .elementor-element-ad56c8a) ul {
	margin: 0 0 12px;
	padding: 0;
	list-style: none;
}
:is(.cs-home-text, .elementor-element-ad56c8a) ul li {
	position: relative;
	padding-left: 22px;
	margin-bottom: 8px;
	color: #333a45;
	font-size: 16px;
	line-height: 1.6;
}
:is(.cs-home-text, .elementor-element-ad56c8a) ul li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 10px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #c0392b;
}
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-image { margin-bottom: 26px !important; }
:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-image img {
	display: block;
	width: 100%;
	max-width: 620px;
	height: auto;
	border-radius: 6px;
}
@media (max-width: 640px) {
	.cs-home-text,
	.elementor-element-ad56c8a { padding: 32px 0 38px; }
	:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-heading-title { font-size: 16px; padding: 10px 14px; }
	:is(.cs-home-text, .elementor-element-ad56c8a) .elementor-widget-text-editor p,
	:is(.cs-home-text, .elementor-element-ad56c8a) ul li { font-size: 15px !important; }
}

/* ============================================================
   2026-09-14 — Zoom automat pe iPhone la atingerea unui câmp.
   Safari pe iOS mărește pagina ori de câte ori atingi un câmp cu text
   sub 16px, iar după aceea pagina rămâne mărită și textul arată strâmb.
   Câmpurile din căutare erau la 14px. Le ducem la 16px doar sub 1024px;
   pe desktop rămân neschimbate. Înălțimea casetei nu se modifică.
   ============================================================ */
@media (max-width: 1024px) {
	.pac-target-input,
	.select2-search__field,
	.select2-container .select2-search__field,
	select.mlduo-select {
		font-size: 16px !important;
	}
}

/* ============================================================
   2026-09-14 — Rază: listă derulantă în loc de slider, peste tot.
   Slider-ul temei e greu de nimerit cu degetul, iar sub 1024px tema îl
   ascundea complet, deci pe telefon raza nici nu putea fi schimbată.
   js/cs-raza-mobil.js construiește o listă derulantă (5–200 km) care scrie
   valoarea în slider. Aici doar ascundem slider-ul și arătăm lista, pe
   toate ecranele, cu același aspect.
   Clasa „cs-raza-mobil" e pusă de JS doar pe rândurile unde lista chiar a
   fost creată, ca să nu rămână un rând gol dacă scriptul cade.
   Excepție: rândul de distanță din header-ul mobil (.cs-dist-row) are
   propriul afișaj — acolo nu punem nimic.
   ============================================================ */
.cs-raza-select { display: none; }

.cs-raza-mobil .mylisting-range-slider { display: none !important; }

.cs-raza-mobil .cs-raza-eticheta {
	display: block;
	margin: 0 0 6px;
	text-align: left;
	color: #1d1d23;
	font-size: 14px;
	font-weight: 800;
	line-height: 20px;
}

.cs-raza-mobil .cs-raza-select {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 0 0 2px;
	padding: 9px 34px 9px 12px;
	border: 1px solid #d5dbe4;
	border-radius: 4px;
	background: #fff;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%231a3a6e' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	color: #242429;
	font-size: 16px;
	line-height: 1.3;
	appearance: none;
	-webkit-appearance: none;
}
.cs-raza-mobil .cs-raza-select:focus {
	outline: none;
	border-color: #1a3a6e;
}

/* Înălțimea de 60px vine de la slider; fără ea, lista ieșea din rând și
   ajungea peste butonul Caută. */
.radius.proximity-slider.explore-filter.proximity-filter.cs-raza-mobil {
	height: auto !important;
	min-height: 0 !important;
	/* Fără padding sus: pe desktop alinia greșit lista față de chenarul de
	   adresă de alături, iar pe telefon lăsa un gol inutil sub linie. */
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

@media (max-width: 1024px) {
	/* Regula care ascundea rândul („Ascunde slider distanta din panoul de
	   filtre", mai sus) are 4 clase și !important, deci o depășim cu 5.
	   `:not([style*="display"])` lasă în pace rândurile pe care tema le
	   ascunde ea însăși din JS, prin atributul style — în panoul de filtre
	   de pe pagina de explorare, raza apare abia după ce introduci o adresă,
	   și așa trebuie să rămână. */
	.radius.proximity-slider.explore-filter.proximity-filter.cs-raza-mobil:not([style*="display"]) {
		display: block !important;
	}
	.cs-dist-row .proximity-filter.cs-raza-mobil {
		display: none !important;
	}
}

/* ============================================================
   2026-09-14 — Câmpul de adresă: chenar propriu-zis, pe toate ecranele.
   Tema folosea o etichetă plutitoare care stătea peste câmp, iar câmpul
   avea doar o linie dedesubt. Pe ecran mic părea gol și nu se înțelegea ce
   se cere; pe desktop nu se potrivea cu lista de rază, care are eticheta
   deasupra. Acum ambele arată la fel: etichetă sus, chenar dedesubt.
   Textul „Adaugă adresa" din interior e pus din js/cs-raza-mobil.js.
   Omulețul care ia locația automat rămâne în dreapta, în chenar.
   ============================================================ */
.location-filter.explore-filter {
	display: flex !important;
	flex-direction: column !important;
	position: relative !important;
	height: auto !important;
	min-height: 0 !important;
	padding-top: 0 !important;
}
/* Eticheta iese din poziția plutitoare și urcă deasupra câmpului. */
.location-filter.explore-filter > label {
	order: 1;
	position: static !important;
	transform: none !important;
	width: auto !important;
	margin: 0 0 6px !important;
	color: #1d1d23 !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	line-height: 20px !important;
	text-align: left !important;
	opacity: 1 !important;
}
.location-filter.explore-filter > input.pac-target-input {
	order: 2;
	box-sizing: border-box;
	width: 100% !important;
	height: auto !important;
	padding: 9px 42px 9px 12px !important;
	border: 1px solid #d5dbe4 !important;
	border-radius: 4px !important;
	background: #fff !important;
	color: #242429 !important;
	/* 16px și pe desktop: aduce chenarul la aceeași înălțime cu lista de
	   rază de alături, iar pe iPhone împiedică mărirea automată a paginii. */
	font-size: 16px !important;
	line-height: 1.3 !important;
}
/* Înălțime fixă în loc de padding: tema aplică 14px padding vertical pe
   câmpul vizibil (dar nu și pe cele din taburile ascunse), așa că padding-ul
   nu era de încredere. 41px = exact înălțimea listei de rază de alături,
   deci cele două chenare se aliniază. */
.location-filter.explore-filter.md-group > input.pac-target-input {
	height: 41px !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	line-height: 39px !important;
}
.location-filter.explore-filter > input.pac-target-input:focus {
	border-color: #1a3a6e !important;
	outline: none !important;
}
.location-filter.explore-filter > input.pac-target-input::placeholder {
	color: #8a93a1 !important;
	opacity: 1;
}
/* Omulețul care ia locația automat — în interiorul chenarului, dreapta. */
.location-filter.explore-filter > .geocode-location {
	position: absolute !important;
	right: 12px !important;
	bottom: 10px !important;
	top: auto !important;
	left: auto !important;
	z-index: 2;
	cursor: pointer;
}

@media (max-width: 1024px) {
	.location-filter.explore-filter {
		margin-bottom: 14px !important;
	}
}

/* ============================================================
   2026-09-14 — Poziția pe verticală a blocului din hero (homepage).
   Secțiunea centrează coloana pe verticală. O margine jos face coloana
   „mai înaltă" pentru calculul centrării, deci o urcă cu jumătate din
   valoare, fără să schimbe distanțele dinăuntru.
   ============================================================ */
.elementor-element-2woam06 .elementor-element-yrc2o3p {
	margin-bottom: 80px;
}
@media (max-width: 1024px) {
	.elementor-element-2woam06 .elementor-element-yrc2o3p {
		margin-bottom: 50px;
	}
}


/* ============================================================
   2026-09-14 — PAGINA CONTACT

   Pagina a fost refăcută în același limbaj vizual cu paginile hub
   (/service-auto, /tractari-auto, /service-biciclete,
   /service-trotinete-electrice): folosește același container
   `.cs-hub-wrap` (900px, definit mai sus) și aceleași titluri.

   Clasele de mai jos sunt doar pentru elementele care nu există pe
   hub-uri: caseta roșie de avertizare, cele trei casete de contact,
   lista „Cu ce te putem ajuta” și blocul cu datele firmei.

   Pagina a fost scoasă din Elementor și trecută pe editorul normal
   WordPress, deci markup-ul e HTML simplu în conținutul paginii.
   ============================================================ */

.cs-contact-page .cs-breadcrumb {
	font-size: 14px;
	color: #566c90;
	margin-bottom: 10px;
}

/* ------------------------------------------------------------
   Caseta de avertizare.
   Motiv: oamenii sunau la numărul portalului crezând că e al unui
   service. Stă înaintea datelor de contact, nu după — altfel ar fi
   citită abia după ce omul a văzut deja numărul.
   Contrast: #b3321f pe #fdf2f0 = 6,0:1 (minim cerut 4,5:1).
   ------------------------------------------------------------ */
.cs-avertisment {
	background: #fdf2f0;
	border: 1px solid #f0c5bd;
	border-left: 6px solid #c0392b;
	border-radius: 10px;
	padding: 20px 24px;
	margin: 26px 0 34px;
}

.cs-avertisment .cs-av-titlu {
	display: block;
	color: #b3321f;
	font-size: 23px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: .01em;
	text-transform: uppercase;
	margin-bottom: 10px;
}

.cs-avertisment p {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.58;
	color: #3e2a26;
}

.cs-avertisment p strong { color: #b3321f; }

@media (max-width: 640px) {
	.cs-avertisment {
		padding: 16px 16px 17px;
		border-left-width: 5px;
	}
	.cs-avertisment .cs-av-titlu {
		font-size: 18px;
		line-height: 1.25;
	}
	.cs-avertisment p { font-size: 14.5px; }
}

/* ------------------------------------------------------------
   Cele trei casete: e-mail, telefon, program.
   auto-fit + minmax: 3 coloane pe desktop, 2 pe tabletă, 1 pe
   telefon, fără media queries.
   ------------------------------------------------------------ */
.cs-contact-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
	gap: 14px;
	margin: 24px 0 36px;
}

.cs-contact-card {
	background: var(--cs-blue-card, #e4edf9);
	border: 1px solid var(--cs-blue-card-border, #c2d4ee);
	border-top: 4px solid var(--cs-blue, #1a3a6e);
	border-radius: 10px;
	padding: 16px 18px 18px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.cs-contact-card .cs-ct-eticheta {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #4a628c;
}

.cs-contact-card .cs-ct-valoare {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	/* !important: tema colorează toate linkurile din conținut. */
	color: var(--cs-blue, #1a3a6e) !important;
	text-decoration: none !important;
	word-break: break-word;
}

.cs-contact-card a.cs-ct-valoare:hover,
.cs-contact-card a.cs-ct-valoare:focus {
	text-decoration: underline !important;
}

.cs-contact-card a.cs-ct-valoare:focus-visible {
	outline: 3px solid #7aa7e6;
	outline-offset: 2px;
	border-radius: 3px;
}

.cs-contact-card .cs-ct-nota {
	font-size: 13.5px;
	line-height: 1.45;
	color: #4d5a6e;
}

/* ------------------------------------------------------------
   Lista „Cu ce te putem ajuta” — buline roșii, ca pe paginile
   de oraș și pe ghiduri.
   ------------------------------------------------------------ */
.cs-contact-lista {
	list-style: none;
	margin: 16px 0 26px;
	padding: 0;
}

.cs-contact-lista li {
	position: relative;
	padding-left: 26px;
	margin-bottom: 12px;
	line-height: 1.6;
}

.cs-contact-lista li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #c0392b;
}

.cs-contact-lista li strong { color: #1a3a6e; }

/* ------------------------------------------------------------
   Blocul cu datele firmei.
   ------------------------------------------------------------ */
.cs-firma-box {
	background: #f6f8fb;
	border: 1px solid #dde5f0;
	border-left: 5px solid var(--cs-blue, #1a3a6e);
	border-radius: 8px;
	padding: 18px 20px;
	margin: 18px 0 10px;
}

.cs-firma-box dl {
	margin: 0;
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 8px 16px;
}

.cs-firma-box dt {
	margin: 0;
	font-weight: 700;
	color: #4a628c;
	font-size: 14px;
}

.cs-firma-box dd {
	margin: 0;
	font-size: 15px;
	line-height: 1.45;
}

@media (max-width: 540px) {
	.cs-firma-box dl {
		grid-template-columns: 1fr;
		gap: 2px;
	}
	.cs-firma-box dd { margin-bottom: 10px; }
	.cs-firma-box dd:last-child { margin-bottom: 0; }
}

/* ------------------------------------------------------------
   Linkurile din text: tema le colorează la fel ca textul normal,
   deci nu se vede că sunt linkuri. Aici le facem albastre și
   subliniate. #0f5596 pe alb = 6,3:1.
   ------------------------------------------------------------ */
.cs-contact-page p a,
.cs-contact-lista a {
	color: #0f5596 !important;
	text-decoration: underline !important;
}

/* ------------------------------------------------------------
   2026-09-14 — Butonul de telefon din caseta de contact.
   Înainte numărul era doar text îngroșat, cu link `tel:` ascuns în
   el: pe telefon nu se vedea că e apăsabil. Acum e buton propriu-zis,
   cu pictogramă de receptor, pe toată lățimea casetei și cu zona de
   atins de 48px (minimul recomandat de Google pentru mobil).
   ------------------------------------------------------------ */
.cs-ct-buton {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 48px;
	padding: 11px 16px;
	margin: 2px 0;
	background: var(--cs-blue, #1a3a6e);
	/* !important pe culoare: tema are reguli proprii pe `a` care ar
	   face textul ilizibil pe fundal închis. */
	color: #fff !important;
	border-radius: 8px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none !important;
	transition: background-color .15s ease, transform .06s ease;
}

.cs-ct-buton:hover,
.cs-ct-buton:focus {
	background: var(--cs-blue-dark, #122a52);
	color: #fff !important;
	text-decoration: none !important;
}

.cs-ct-buton:active { transform: translateY(1px); }

.cs-ct-buton:focus-visible {
	outline: 3px solid #7aa7e6;
	outline-offset: 2px;
}

.cs-ct-ico { flex-shrink: 0; }

@media (prefers-reduced-motion: reduce) {
	.cs-ct-buton { transition: none; }
	.cs-ct-buton:active { transform: none; }
}

/* E-mailul rămâne link simplu, dar subliniat — altfel arată la fel
   ca textul normal și nu se vede că se poate apăsa. */
.cs-contact-card a.cs-ct-valoare {
	text-decoration: underline !important;
	text-underline-offset: 3px;
}


/* ============================================================
   CARD TRACTARI — preturi + mentiunea „Preturi orientative” (2026-10-23)
   Balonul de la ⓘ e creat in functions.php (#cs-price-tip)
   ============================================================ */
.cs-price-note {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; line-height: 1.3; color: #4a5a6e;
  margin-bottom: 4px; white-space: nowrap;
}
.cs-price-note-short { display: none; }
@media (max-width: 339px) {
  .cs-price-note-full  { display: none; }
  .cs-price-note-short { display: inline; }
}
.cs-price-info {
  position: relative; flex-shrink: 0;
  width: 15px; height: 15px; padding: 0; margin: 0;
  border: 1.3px solid #4a5a6e; border-radius: 50%; background: transparent;
  color: #4a5a6e; font: italic 700 10px/1 Georgia, serif;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
/* zona de atingere mai mare pe mobil (~36px) */
.cs-price-info::after { content: ''; position: absolute; inset: -11px; }
.cs-price-info { -webkit-tap-highlight-color: transparent; }
.cs-price-info.active { background: var(--cs-blue); border-color: var(--cs-blue); color: #fff; }
/* 2026-10-23: hover doar pe dispozitive cu mouse — pe telefon :hover ramanea „lipit” dupa tap si ⓘ ramanea cerc albastru plin dupa inchiderea balonului */
@media (hover: hover) { .cs-price-info:hover { background: var(--cs-blue); border-color: var(--cs-blue); color: #fff; } }
.cs-price-info:focus-visible { outline: 2px solid #7aa7e6; outline-offset: 2px; }
.cs-price-row {
  display: flex; flex-wrap: wrap; gap: 3px 12px;
  font-size: 13px; line-height: 1.35; color: var(--cs-text-primary);
  margin-bottom: 10px;
}
.cs-price-item { white-space: nowrap; }
.cs-price-label { color: #4a5a6e; }
.cs-price-item strong { font-weight: 700; color: var(--cs-text-primary); }
.cs-price-nego strong { font-weight: 600; color: var(--cs-green-text, #1e7a46); }
#cs-price-tip {
  display: none; position: fixed; z-index: 99999;
  max-width: 280px; padding: 10px 12px;
  background: #fff; border: 1.5px solid #c2d4ee; border-radius: 10px;
  box-shadow: 0 8px 28px rgba(26,58,110,0.18);
  font-size: 13px; line-height: 1.45; color: #2b3a4f;
}
#cs-price-tip strong { display: block; margin-bottom: 3px; color: var(--cs-blue); font-size: 13px; }


/* ============================================================
   CARD TRACTARI — caseta de preturi (2026-10-23 13:42)
   Inlocuieste .cs-price-note / .cs-price-row (raman in fisier, nefolosite)
   ============================================================ */
.cs-price-box { background: #fff; border: 1px solid #cfdcef; border-radius: 10px; padding: 8px 10px 7px; margin: 2px 0 10px; }
.cs-price-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.cs-price-title { display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--cs-blue, #1a3a6e); white-space: nowrap; }
.cs-price-box .cs-price-info { border-color: currentColor; color: inherit; text-transform: none; letter-spacing: 0; }
.cs-price-box .cs-price-info.active { background: var(--cs-blue); border-color: var(--cs-blue); color: #ffffff; } /* 2026-10-23: deschis = cerc albastru cu „i” alb (inainte „i” era tot albastru → punct albastru) */
@media (hover: hover) { .cs-price-box .cs-price-info:hover { background: var(--cs-blue); border-color: var(--cs-blue); color: #ffffff; } }
.cs-price-nego { font-size: 10.5px; font-weight: 600; color: #1e7a46; background: #e3f5ea; border-radius: 20px; padding: 2px 8px; white-space: nowrap; }
.cs-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #e6edf7; padding-top: 6px; }
.cs-price-cols-2 { grid-template-columns: repeat(2, 1fr); }
.cs-price-cols-1 { grid-template-columns: 1fr; }
.cs-price-cell { padding: 0 6px; border-left: 1px solid #e6edf7; min-width: 0; }
.cs-price-cell:first-child { border-left: 0; padding-left: 0; }
.cs-price-lbl { font-size: 10.5px; color: #5b6b80; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-price-val { font-size: 15px; font-weight: 700; color: #14243d; line-height: 1.25; white-space: nowrap; }
.cs-price-val small { font-size: 10.5px; font-weight: 500; color: #5b6b80; }
.cs-price-foot { font-size: 11px; font-weight: 600; color: var(--cs-red, #c0262d); margin-top: 6px; } /* 2026-10-23 15:4x: tot subsolul rosu, 11px ca titlul */
.cs-price-foot-ico { display: inline-block; width: 12px; height: 12px; vertical-align: -2px; margin-right: 2px; }
.cs-price-foot b { color: inherit; font-weight: 700; }
@media (max-width: 359px) { .cs-price-val { font-size: 13.5px; } .cs-price-cell { padding: 0 4px; } }

/* Rand localitate | distanta (2026-10-23 13:46): „km de adresă” e mai lung decat „de tine”
   — pe telefon litera scade putin si, daca tot nu incape, distanta trece pe randul urmator */
.cs-card-loc { flex-wrap: wrap; row-gap: 2px; }
@media (max-width: 420px) {
  .cs-loc-city, .cs-loc-distance { font-size: 14px; }
}

/* ============================================================
   CARD LISTING — design final (2026-10-23 16:37, ales de Mihai), la toate tipurile de listing.
   Pleaca de la cardul initial (albastru-deschis pe fundal alb, butoane deschise) si adauga:
   chenar albastru 2px, dunga rosie sus de 8px (2px chenar rosu + 6px ::before), umbra usoara,
   numele firmei intr-o eticheta alba, 26px intre carduri. Doar CSS, default.php neschimbat.
   ============================================================ */
.lf-item-container {
  border: 2px solid #7f9fd0 !important;
  border-top-color: var(--cs-red) !important;
  box-shadow: 0 2px 6px rgba(16, 40, 80, .10) !important;
  margin-bottom: 26px !important;
}
.lf-item-container::before { height: 6px !important; }
.lf-item-container .cs-card-top { align-items: center; margin-bottom: 6px; }
.lf-item-container .cs-card-name {
  flex: 0 1 auto !important;
  font-size: 16px !important; font-weight: 800 !important; color: var(--cs-text-primary) !important;
  background: #ffffff; border: 1px solid var(--cs-blue-card-border); border-radius: 8px;
  padding: 4px 10px !important; line-height: 1.25 !important;
  white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere;
}

/* Caseta de preturi (2026-10-23 16:4x): despartitoare vizibile intre cele 3 preturi (subsolul ramane scris normal, cerut de Mihai 16:42) */
.lf-item-container .cs-price-cell { padding: 0 8px; border-left-color: #c9d8ee; }
.lf-item-container .cs-price-cell:first-child { padding-left: 0; }
@media (max-width: 359px) { .lf-item-container .cs-price-cell { padding: 0 5px; } }

/* Pagina firmei — nota „Prețuri orientative” sub blocul de preturi (2026-10-23, adaugata din functions.php, wp_footer 32) */
.cs-pd-listing { margin-top: 14px; padding: 12px 14px; background: #f3f7fd; border: 1px solid #cfdcef; border-radius: 10px; }
.cs-pd-l-title { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--cs-blue, #1a3a6e); }
.cs-pd-l-i { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; border: 1.3px solid currentColor; border-radius: 50%; font: italic 700 10px/1 Georgia, serif; text-transform: none; letter-spacing: 0; }
.cs-pd-listing .cs-pd-l-text { margin: 8px 0 0; padding: 0; font-size: 13.5px; line-height: 1.5; color: #33415c; }
.cs-pd-l-foot { display: flex; align-items: center; gap: 5px; margin-top: 10px; font-size: 13px; font-weight: 600; color: var(--cs-red, #c0392b); }
.cs-pd-l-foot b { color: inherit; font-weight: 700; }
.cs-pd-l-foot svg { flex-shrink: 0; }

/* ============================================================
   Pagini Explore — oricare pagina cu widget-ul Explore (#c27-explore-listings),
   indiferent de template, inclusiv paginile create in viitor (2026-10-27, cerut de Mihai).
   Containerul exista deja in HTML-ul de la server, deci regulile se aplica de la
   prima afisare, inainte de Vue.

   1) Numele firmei din card pe un singur rand, cu „…” daca nu incape.
      Font neschimbat (16px). Doar mobil (<=768px).

   2) CLS: cele doua iconite icomoon din zona de cautare (locatie, setari) primesc
      o casuta fixa de 1em x 1em. Fara ea, pana vine fontul (font-display:swap)
      se afiseaza un caracter de rezerva cu alta inaltime, iar cand fontul ajunge
      randul se modifica si toate cardurile de dedesubt coboara (CLS 0,123).
      1em = exact dimensiunea iconitei, deci vizual nu se schimba nimic.

   3) CLS (cauza principala, masurata): randul „N rezultate” (.fl-head) are 20px in
      HTML-ul de la server si 37px dupa ce porneste Vue, deci toate cardurile
      coborau cu 17px. Ii rezervam de la inceput cei 37px. Doar mobil.

   Revenire: stergi acest bloc.
   ============================================================ */
@media (max-width: 768px) {
  #c27-explore-listings .fl-head {
    min-height: 37px;
  }
  #c27-explore-listings .lf-item-container .cs-card-name {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}
#c27-explore-listings i.icon-location-user,
#c27-explore-listings i.icon-settings-1 {
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  vertical-align: middle;
}