/* IPEKERP_STOREFRONT_VEHICLE_CUSTOM_DROPDOWNS_V1 */

@media (min-width:821px){
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 select.c5-cdd-native{
    position:absolute !important;width:1px !important;height:1px !important;min-width:1px !important;min-height:1px !important;
    opacity:0 !important;pointer-events:none !important;clip-path:inset(50%) !important;overflow:hidden !important;white-space:nowrap !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd{position:relative !important;width:100% !important;}
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd__trigger{
    width:100% !important;height:44px !important;display:flex !important;align-items:center !important;justify-content:space-between !important;
    gap:10px !important;padding:0 12px !important;border:1px solid #d6e2ef !important;border-radius:10px !important;background:#fff !important;
    color:#183555 !important;font-size:11px !important;font-weight:650 !important;text-align:left !important;
    box-shadow:0 1px 2px rgba(20,47,82,.025) !important;cursor:pointer !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd__trigger:hover:not(:disabled){
    border-color:#b8cde4 !important;background:#fbfdff !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd[data-open="true"] .c5-cdd__trigger,
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd__trigger:focus-visible{
    outline:none !important;border-color:#76acf0 !important;box-shadow:0 0 0 3px rgba(13,104,223,.085) !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd__trigger:disabled{
    border-color:#e1e8f0 !important;background:#f6f8fb !important;color:#8b9bae !important;cursor:not-allowed !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd__label{
    min-width:0 !important;overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd__chevron{
    width:16px !important;height:16px !important;flex:0 0 16px !important;color:#6f84a0 !important;transition:transform .16s ease !important;
  }
  body.sf-home-concept[data-c5-live-home] .c5-vehicle-panel--hybrid-v1 .c5-cdd[data-open="true"] .c5-cdd__chevron{
    transform:rotate(180deg) !important;
  }
}

.c5-cdd-portal{
  position:fixed !important;z-index:2147482000 !important;display:flex !important;flex-direction:column !important;max-height:308px !important;
  overflow:hidden !important;border:1px solid #d7e3f0 !important;border-radius:12px !important;background:rgba(255,255,255,.99) !important;
  box-shadow:0 18px 48px rgba(16,43,79,.18),0 4px 14px rgba(16,43,79,.09) !important;backdrop-filter:blur(8px) !important;
  animation:c5-cdd-in .14s ease-out both !important;
}
@keyframes c5-cdd-in{from{opacity:0;transform:translateY(-4px) scale(.992)}to{opacity:1;transform:translateY(0) scale(1)}}

.c5-cdd-portal__search-wrap{
  position:relative !important;padding:10px !important;border-bottom:1px solid #edf2f7 !important;background:#fbfdff !important;
}
.c5-cdd-portal__search-icon{
  position:absolute !important;left:21px !important;top:50% !important;width:15px !important;height:15px !important;color:#7e94b0 !important;
  transform:translateY(-50%) !important;pointer-events:none !important;
}
.c5-cdd-portal__search{
  width:100% !important;height:36px !important;padding:0 12px 0 34px !important;border:1px solid #d8e3ef !important;
  border-radius:9px !important;background:#fff !important;color:#173555 !important;font-size:12px !important;font-weight:600 !important;outline:none !important;
}
.c5-cdd-portal__search:focus{border-color:#7eb0ef !important;box-shadow:0 0 0 3px rgba(13,104,223,.08) !important;}

.c5-cdd-portal__list{
  overflow-y:auto !important;overscroll-behavior:contain !important;padding:6px !important;scrollbar-width:thin !important;
  scrollbar-color:#9db6d5 #eef3f8 !important;
}
.c5-cdd-portal__list::-webkit-scrollbar{width:8px !important;}
.c5-cdd-portal__list::-webkit-scrollbar-track{background:#eef3f8 !important;}
.c5-cdd-portal__list::-webkit-scrollbar-thumb{background:#9db6d5 !important;border-radius:999px !important;border:2px solid #eef3f8 !important;}

.c5-cdd-portal__option{
  width:100% !important;min-height:36px !important;display:grid !important;grid-template-columns:minmax(0,1fr) 18px !important;
  align-items:center !important;gap:8px !important;padding:8px 9px !important;border:0 !important;border-radius:8px !important;background:transparent !important;
  color:#173555 !important;font-size:12px !important;line-height:1.25 !important;font-weight:620 !important;text-align:left !important;cursor:pointer !important;
}
.c5-cdd-portal__option:hover,.c5-cdd-portal__option[data-active="true"]{background:#eef6ff !important;color:#0d5fd2 !important;}
.c5-cdd-portal__option[data-selected="true"]{background:#e8f2ff !important;color:#0b5dcc !important;font-weight:780 !important;}
.c5-cdd-portal__option:disabled{color:#a4b0bf !important;cursor:not-allowed !important;background:transparent !important;}
.c5-cdd-portal__option-text{min-width:0 !important;overflow-wrap:anywhere !important;}
.c5-cdd-portal__check{width:16px !important;height:16px !important;display:grid !important;place-items:center !important;color:#0d68df !important;opacity:0 !important;}
.c5-cdd-portal__option[data-selected="true"] .c5-cdd-portal__check{opacity:1 !important;}
.c5-cdd-portal__empty{padding:18px 12px !important;color:#7b8da3 !important;font-size:12px !important;text-align:center !important;}

@media (max-width:820px){.c5-cdd-portal{display:none !important;}}

/* IPEKERP_PHASE18_ITEM12_HOME_NATIVE_SELECT_DESKTOP_OVERFLOW_REPAIR_V1
 * Phase 18 Item 12 causal proof at 1366px:
 * - 4 native select.c5-cdd-native controls were computed as 1366px wide.
 * - model/variant controls extended document right edge to 1625px.
 * - moving the native controls to a strict 1px absolute origin reduced
 *   document width from 1625px to 1366px without hiding custom dropdown UI.
 *
 * Keep native selects in the DOM for form state / JS synchronization.
 * This rule only strengthens the existing desktop visually-hidden contract.
 */
@media (min-width: 821px) {
  body.sf-home-concept[data-c5-live-home]
  .c5-vehicle-panel--hybrid-v1
  [data-c5-vehicle]
  .c5-vsel-field
  select.c5-cdd-native {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;

    box-sizing: border-box !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 1px !important;
    min-height: 1px !important;
    max-width: 1px !important;
    max-height: 1px !important;

    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;

    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
  }
}
