/* croaziere.co offer / home / destination filters — Liquid Glass (1.5.0). Desktop sidebar is light glass; the phone
   drawer becomes a full-screen frosted overlay. */
:root {
  --czg-lime: #CED970;
  --czg-ink: #1C1F1A;
  --czg-text: rgba(255, 255, 255, 0.92);
  --czg-muted: rgba(255, 255, 255, 0.56);
  --czg-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ——— Offer + destination filter (croaziere-filter) ——— */
/* Desktop / tablet sidebar: refined light glass */
@media (min-width: 1024px) {
  .czf .czf-side,
  .czf #filters-container .czf-form {
    background: rgba(255, 255, 255, 0.58);
    -webkit-backdrop-filter: blur(24px) saturate(1.55);
    backdrop-filter: blur(24px) saturate(1.55);
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 24px;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.85),
      0 12px 40px rgba(28, 31, 26, 0.08);
    padding: 8px 4px 12px;
  }
  .czf .czf-form { background: transparent; border: 0; }
}

.czf .czf-label,
.czf .czf-adv-title,
.czf .czf-drawer-t {
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 500 !important;
}
.czf .czf-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px !important;
}
.czf .czf-sub { text-transform: none; letter-spacing: 0; font-weight: 400; opacity: 0.65; }
/* thin line icons on the 10 field labels */
.czf .czf-field > .czf-label::before,
.czf .czf-field > legend.czf-label::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  background: currentColor;
  opacity: 0.85;
  -webkit-mask: var(--czg-ico) center / contain no-repeat;
  mask: var(--czg-ico) center / contain no-repeat;
}
.czf .czf-dests,
.czf .czf-dest-field, .czf .czf-dests { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.5-5.8 6.5-11A6.5 6.5 0 0 0 12 3.5 6.5 6.5 0 0 0 5.5 10c0 5.2 6.5 11 6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2'/%3E%3C/svg%3E"); }
.czf .czf-date { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2'/%3E%3Cpath d='M8 3.5v3M16 3.5v3M3.5 10h17'/%3E%3C/svg%3E"); }
.czf .czf-comps { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 16h18c-1.5 1.7-4.5 2.7-9 2.7S4.5 17.7 3 16z'/%3E%3Cpath d='M5.2 16l1.5-5.2h10.6L18.8 16'/%3E%3Cpath d='M8 10.8V8h3.2v2.8M13.2 10.8V6.8h3.4V10.8M14.9 6.8V5.2'/%3E%3C/svg%3E"); }
.czf .czf-ships { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 16h18c-1.5 1.7-4.5 2.7-9 2.7S4.5 17.7 3 16z'/%3E%3Cpath d='M7 16V7h10v9'/%3E%3Cpath d='M10 7V5h4v2'/%3E%3C/svg%3E"); }
.czf .czf-year { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E"); }
.czf .czf-durations { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E"); }
.czf .czf-ports { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='5' r='2.15'/%3E%3Cpath d='M12 7.2v13.3M7.5 11.2h9M5 15.2C6.6 19 9 21 12 21s5.4-2 7-5.8'/%3E%3C/svg%3E"); }
.czf .czf-price { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5l7.5-7.5h8v8L12 18.5 4 10.5z'/%3E%3Ccircle cx='16.2' cy='7.8' r='1.1'/%3E%3C/svg%3E"); }
.czf .czf-labels-f { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 5.5h11.5A2.5 2.5 0 0 1 19 8v11.5H6.5A2.5 2.5 0 0 1 4 17V6.5'/%3E%3Cpath d='M8 9.5h6.5M8 13h8M8 16.5h5'/%3E%3C/svg%3E"); }
.czf .czf-cabin { --czg-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V8l8-4 8 4v12'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3Cpath d='M4 10.5h16'/%3E%3C/svg%3E"); }

.czf .czf-pill,
.czf .czf-chip {
  border-radius: 999px !important;
  border: 1px solid rgba(28, 31, 26, 0.12);
  background: rgba(255, 255, 255, 0.55);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: background .3s var(--czg-ease), border-color .3s ease, color .25s ease, box-shadow .3s ease;
}
.czf .czf-pill:hover,
.czf .czf-chip:hover {
  border-color: rgba(28, 31, 26, 0.28);
}
.czf .czf-pill:has(input:checked),
.czf .czf-chip:has(input:checked),
.czf li.is-on .czf-pill {
  background: rgba(206, 217, 112, 0.45);
  border-color: rgba(206, 217, 112, 0.9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 0 0 1px rgba(206, 217, 112, 0.25);
  color: var(--czg-ink);
}
.czf .czf-btn,
.czf .czf-apply,
.czf .czf-drawer-ok,
.czf .czf-bar-all {
  border-radius: 999px !important;
  transition: transform .4s var(--czg-ease), background .3s ease, box-shadow .3s ease;
}
.czf .czf-apply,
.czf .czf-drawer-ok,
.czf .czf-form .czf-btn.czf-apply {
  background: var(--czg-lime) !important;
  color: var(--czg-ink) !important;
  border: 0 !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em;
  box-shadow: 0 8px 24px rgba(206, 217, 112, 0.35);
}
.czf input[type="text"],
.czf input[type="number"],
.czf input[type="search"],
.czf .czf-find-in,
.czf .czf-select2 + .select2 .select2-selection {
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.65) !important;
  border: 1px solid rgba(28, 31, 26, 0.12) !important;
}


/* Force Daniela's field order even if the plugin parks or re-clones nodes. */
.czf .czf-adv {
  display: flex;
  flex-direction: column;
}
.czf .czf-adv-head { order: 0; }
.czf .czf-dests, .czf #czf-dest { order: 1; }
.czf .czf-date { order: 2; }
.czf .czf-comps, .czf #czf-comp { order: 3; }
.czf .czf-ships { order: 4; }
.czf .czf-year { order: 5; }
.czf .czf-durations { order: 6; }
.czf .czf-ports, .czf #czf-port { order: 7; }
.czf .czf-price { order: 8; }
.czf .czf-labels-f { order: 9; }
.czf .czf-cabin { order: 10; }
.czf .czf-adv #czf-apply, .czf .czf-adv .czf-apply { order: 11; }

/* Phone drawer → full-screen Liquid Glass overlay */
@media (max-width: 1023.98px) {
  .czf .czf-drawer-ov {
    background: rgba(8, 10, 8, 0.28);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
    backdrop-filter: blur(20px) saturate(1.5);
  }
  .czf .czf-drawer-p {
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: scale(1.03);
    background:
      linear-gradient(180deg, rgba(10, 12, 10, 0.28) 0%, rgba(12, 14, 12, 0.48) 100%),
      rgba(16, 18, 16, 0.42);
    -webkit-backdrop-filter: blur(56px) saturate(1.85);
    backdrop-filter: blur(56px) saturate(1.85);
    color: var(--czg-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 0 80px rgba(255, 255, 255, 0.05);
    border-radius: 0;
    transition: transform 0.72s var(--czg-ease), opacity 0.55s var(--czg-ease);
  }
  .czf .czf-drawer.is-in .czf-drawer-p { transform: scale(1); }
  .czf .czf-drawer-h {
    justify-content: center;
    border-bottom: 0;
    padding-top: 18px;
    background: transparent;
  }
  .czf .czf-drawer-t { display: none; }
  .czf .czf-drawer-x {
    position: relative;
    width: 48px;
    height: 52px;
    margin: 0 auto;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--czg-text);
    font-size: 0 !important;
  }
  .czf .czf-drawer-x:focus,
  .czf .czf-drawer-x:focus-visible {
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }
  .czf .czf-drawer-x::before {
    content: "×";
    font-size: 32px;
    line-height: 1;
    font-weight: 300;
  }
  .czf .czf-drawer-x::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 32px;
    height: 1.5px;
    background: var(--czg-lime);
    border-radius: 2px;
    transform: translateX(-50%);
    box-shadow: 0 0 10px rgba(206, 217, 112, 0.55);
  }
  .czf .czf-drawer-b,
  .czf .czf-drawer-f { background: transparent; border: 0; color: var(--czg-text); }
  .czf .czf-drawer-b .czf-reset,
  .czf .czf-drawer-h .czf-reset,
  .czf .czf-drawer .czf-reset {
    background: transparent !important;
    border: 1px solid rgba(255,255,255,0.28) !important;
    color: var(--czg-text) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
  }
  .czf .czf-drawer-b .czf-label,
  .czf .czf-drawer-b legend,
  .czf .czf-drawer-b .czf-reset {
    color: var(--czg-text) !important;
  }
  .czf .czf-drawer-b .czf-pill,
  .czf .czf-drawer-b .czf-chip {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
    color: var(--czg-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
  }
  .czf .czf-drawer-b .czf-pill:has(input:checked),
  .czf .czf-drawer-b .czf-chip:has(input:checked),
  .czf .czf-drawer-b li.is-on .czf-pill {
    background: rgba(206, 217, 112, 0.18);
    border-color: rgba(206, 217, 112, 0.7);
    color: var(--czg-lime);
  }
  .czf .czf-drawer-b input[type="text"],
  .czf .czf-drawer-b input[type="number"],
  .czf .czf-drawer-b input[type="search"],
  .czf .czf-drawer-b .czf-find-in {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    color: var(--czg-text) !important;
  }
  .czf .czf-drawer-b .czf-more-pills { color: var(--czg-lime) !important; }
  .czf .czf-drawer-ok {
    background: transparent !important;
    color: var(--czg-text) !important;
    border: 1px solid rgba(255, 255, 255, 0.42) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
  }
  .czf .czf-drawer-ok:hover {
    background: var(--czg-lime) !important;
    color: var(--czg-ink) !important;
    border-color: var(--czg-lime) !important;
  }
  body.czf-drawer-on .joinchat { visibility: hidden !important; }
}

@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  @media (min-width: 1024px) {
    .czf .czf-side,
    .czf #filters-container .czf-form { background: rgba(255, 255, 255, 0.96); }
  }
  @media (max-width: 1023.98px) {
    .czf .czf-drawer-p { background: rgba(18, 20, 18, 0.96); }
  }
}

@media (prefers-reduced-motion: reduce) {
  .czf .czf-drawer-p,
  .czf .czf-pill,
  .czf .czf-btn {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}



/* ============ 1.5.1 ============ */
/* 1) Field order. The 1.4.x rules "html body.czf-sbl .czf-adv > .czf-date { order:1 }" (and #czf-port order:3) were
      more specific than the 1.5.0 order list, so Perioada came before Destinații and Navă dropped near the end.
      Two ids win over every older rule, on the computer sidebar and in the phone drawer. */
html body #czf #advanced-filter { display: flex !important; flex-direction: column; }
html body #czf #advanced-filter > * { order: 20; }
html body #czf #advanced-filter > .czf-adv-head { order: 0; }
html body #czf #advanced-filter > #czf-dest,
html body #czf #advanced-filter > .czf-dests { order: 1; }
html body #czf #advanced-filter > .czf-date { order: 2; }
html body #czf #advanced-filter > #czf-comp,
html body #czf #advanced-filter > .czf-comps { order: 3; }
html body #czf #advanced-filter > .czf-ships { order: 4; }
html body #czf #advanced-filter > .czf-year { order: 5; }
html body #czf #advanced-filter > .czf-durations { order: 6; }
html body #czf #advanced-filter > #czf-port,
html body #czf #advanced-filter > .czf-ports { order: 7; }
html body #czf #advanced-filter > .czf-price { order: 8; }
html body #czf #advanced-filter > .czf-labels-f { order: 9; }
html body #czf #advanced-filter > .czf-cabin { order: 10; }
html body #czf #advanced-filter > .czf-apply { order: 30; }
/* the first visible field after the header has no top rule */
html body.czf-sbl #czf #advanced-filter > .czf-field { border-top: 1px solid rgba(28,31,26,.10); }
html body.czf-sbl #czf #advanced-filter > #czf-dest { border-top: 0; }

/* 2) Labels stand out: bigger, bolder, lime underline (like the world-page stats line). */
html body #czf .czf-field > .czf-label,
html body #czf .czf-field > legend.czf-label {
  display: inline-flex !important; width: auto !important; max-width: 100%;
  font-size: 13.5px !important; font-weight: 700 !important; letter-spacing: .09em;
  color: #1C1F1A !important;
  padding: 0 0 6px !important; margin: 0 0 12px !important;
  border-bottom: 2px solid #CED970;
}
html body #czf .czf-field > .czf-label::before,
html body #czf .czf-field > legend.czf-label::before { width: 18px; height: 18px; flex-basis: 18px; opacity: 1; }
html body #czf .czf-drawer-b .czf-field > .czf-label,
html body #czf .czf-drawer-b .czf-field > legend.czf-label { color: #fff !important; }

/* 3) Navă dropdown. In the dark phone drawer every text inherited white, so the ship names were white on the white
      select2 list (only the highlighted row was readable). The list also opened UPWARDS over Anul lansării on the
      computer. Now: the list opens inline, under the field, pushes the fields below it down, and is readable. */
html body #czf .czf-ships > .select2-container.select2-container--open:not(.select2) {
  position: relative !important; top: auto !important; left: auto !important; width: 100% !important; display: block; }
html body #czf .czf-ships .select2-dropdown {
  position: relative !important; top: auto !important; bottom: auto !important; left: auto !important; width: 100% !important;
  margin-top: 6px; border: 1px solid rgba(28,31,26,.14) !important; border-radius: 14px !important; overflow: hidden;
  background: #fff !important; color: #1C1F1A !important; box-shadow: 0 12px 32px rgba(16,18,16,.22); }
html body #czf .czf-ships .select2-results > .select2-results__options { max-height: 320px; }
html body #czf .czf-ships .select2-results__option { color: #1C1F1A !important; background: transparent; font-size: 16px; }
html body #czf .czf-ships .select2-results__option[aria-selected=true] { background: rgba(206,217,112,.35) !important; color: #1C1F1A !important; }
html body #czf .czf-ships .select2-results__option--highlighted[aria-selected] { background: #1C1F1A !important; color: #fff !important; }
html body #czf .czf-ships .select2-results__group {
  display: block; padding: 10px 12px 6px; font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: #1C1F1A; background: #F4F5EE; border-bottom: 2px solid #CED970; }
html body #czf .czf-ships .select2-results__option[role=group] { padding: 0 !important; min-height: 0; }
html body #czf .czf-ships .select2-results__option[role=group] .select2-results__option { padding-left: 22px; }
html body #czf .czf-ships .select2-results__option[role=group][aria-disabled=true] { display: none; }
html body #czf .czf-ships .select2-results__message { color: #6F746A !important; }
/* the field itself: a clear tappable box, chosen ships readable */
html body #czf .czf-ships .select2-selection--multiple { min-height: 50px; cursor: text; }
html body #czf .czf-ships .select2-search--inline .select2-search__field { width: 100% !important; min-width: 0; margin-top: 10px; font-size: 16px; }
html body #czf .czf-ships .select2-selection__choice { color: #1C1F1A !important; background: #fff !important; }
@media (max-width: 1023.98px) {
  html body #czf .czf-drawer-b .czf-ships .select2-selection--multiple {
    background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,255,255,.45) !important; }
  html body #czf .czf-drawer-b .czf-ships .select2-search__field { color: #fff !important; }
  html body #czf .czf-drawer-b .czf-ships .select2-search__field::placeholder { color: rgba(255,255,255,.75); }
}
html body #czf .czf-ships .select2-search--inline .select2-search__field { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 4px !important; height: 30px; }