/* ═══════════ Dropdowns: one look everywhere ═══════════
   One file for the whole product: the public site (loaded before final-fixes.css), the account area (dashboard.html) and the admin panel (admin.html).
   Plan configurator (.dd), location pickers (.loc-dd), blog sort (.sort-wrap) and every <select> that assets/js/dropdown.js turns into a list (.xdd).
   Uses --c (accent) and --f (font) when the page defines them. Navigation menus (.nav-dd) stay in final-fixes.css. */
:root{--dd-line:rgba(255,255,255,.13);--dd-menu-bg:linear-gradient(180deg,#111b2f,#0b1322);--dd-shadow:0 22px 56px rgba(0,0,0,.62),0 0 0 1px rgba(0,0,0,.35)}
.dd-trigger,.loc-trigger,.sort-dd,.xdd-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:40px;padding:0 14px;border-radius:10px!important;background:linear-gradient(180deg,rgba(18,27,46,.92),rgba(10,16,30,.92));border:1px solid rgba(255,255,255,.12);color:#fff;font-family:var(--f,inherit);font-size:13px;font-weight:600;line-height:1.2;cursor:pointer;text-align:left;transition:border-color .16s,box-shadow .16s,background .16s}
.dd-trigger:hover,.loc-trigger:hover,.sort-dd:hover,.xdd-trigger:hover{border-color:rgba(255,255,255,.28);background:linear-gradient(180deg,rgba(22,33,56,.95),rgba(12,19,36,.95))}
.dd.open .dd-trigger,.loc-dd.open .loc-trigger,.sort-wrap.open .sort-dd,.xdd.open .xdd-trigger,
.dd-trigger:focus-visible,.loc-trigger:focus-visible,.sort-dd:focus-visible,.xdd-trigger:focus-visible{outline:none;border-color:var(--c,#00d9b4);box-shadow:0 0 0 3px rgba(0,217,180,.16)}
.xdd-trigger{width:100%}
.xdd-trigger.is-placeholder .xdd-cur{color:#7e8aa0;font-weight:500}
.xdd-cur{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xdd-chev{width:8px;height:8px;border-right:2px solid #aab4c4;border-bottom:2px solid #aab4c4;transform:rotate(45deg);margin-top:-3px;transition:transform .22s;flex:none}
.xdd.open .xdd-chev{transform:rotate(-135deg);margin-top:2px}
.sort-dd svg{transition:transform .22s}
.sort-wrap.open .sort-dd svg{transform:rotate(180deg)}

/* menus */
.dd-menu,.loc-menu,.sort-menu,.xdd-menu{background:var(--dd-menu-bg)!important;background-origin:border-box!important;border:1px solid var(--dd-line)!important;border-radius:14px!important;padding:6px!important;box-shadow:var(--dd-shadow)!important;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
.dd-menu::-webkit-scrollbar,.loc-menu::-webkit-scrollbar,.sort-menu::-webkit-scrollbar,.xdd-menu::-webkit-scrollbar{width:8px}
.dd-menu::-webkit-scrollbar-thumb,.loc-menu::-webkit-scrollbar-thumb,.sort-menu::-webkit-scrollbar-thumb,.xdd-menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:8px}
.dd-menu::-webkit-scrollbar-thumb:hover,.xdd-menu::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.26)}
.dd-menu::-webkit-scrollbar-track,.loc-menu::-webkit-scrollbar-track,.sort-menu::-webkit-scrollbar-track,.xdd-menu::-webkit-scrollbar-track{background:transparent}

/* options */
.dd-opt,.loc-opt,.sort-opt,.xdd-opt{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;font-size:13.5px;font-weight:500;line-height:1.3;color:#b4bfd1;cursor:pointer;outline:none;transition:background .12s,color .12s}
.dd-opt:hover,.loc-opt:hover,.sort-opt:hover,.xdd-opt:hover,.dd-opt:focus-visible,.loc-opt:focus-visible,.sort-opt:focus-visible,.xdd-opt:focus,.xdd-opt:focus-visible{background:rgba(255,255,255,.07);color:#fff}
.dd-opt.sel,.loc-opt.sel,.sort-opt.act,.xdd-opt.sel{background:rgba(0,217,180,.13);color:var(--c,#00d9b4);font-weight:600}
.dd-opt.sel:hover,.loc-opt.sel:hover,.sort-opt.act:hover,.xdd-opt.sel:hover,.xdd-opt.sel:focus{background:rgba(0,217,180,.19)}
.loc-opt .ck{display:none}
.loc-opt.sel::after,.sort-opt.act::after{content:"";margin-left:auto;width:14px;height:14px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E") center/contain no-repeat}
.xdd-opt .xdd-t{flex:1;min-width:0}
.xdd-opt .xdd-ck{width:14px;height:14px;flex:none;opacity:0}
.xdd-opt.sel .xdd-ck{opacity:1}
.dd-opt.is-soon,.loc-opt.soon,.loc-opt.is-soon,.xdd-opt.is-disabled{opacity:.5;cursor:not-allowed}
.dd-opt.is-soon:hover,.loc-opt.soon:hover,.loc-opt.is-soon:hover,.xdd-opt.is-disabled:hover{background:transparent!important;color:#b4bfd1!important}

/* menus open upward when there is no room below (class set by assets/js/dropdown.js) */
.dd.dd-up .dd-menu,.loc-dd.dd-up .loc-menu,.sort-wrap.dd-up .sort-menu{top:auto!important;bottom:calc(100% + 8px);transform:translateY(8px)}
.dd.dd-up.open .dd-menu,.loc-dd.dd-up.open .loc-menu,.sort-wrap.dd-up.open .sort-menu{transform:translateY(0)}

/* enhanced <select> */
.xdd{position:relative;display:block;min-width:0}
.xdd-native{position:absolute!important;left:0;top:0;width:100%!important;height:100%!important;margin:0!important;opacity:0;pointer-events:none}
.xdd-menu{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:60;max-height:320px;overflow-y:auto;overscroll-behavior:contain;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px);transition:opacity .16s,transform .16s,visibility 0s linear .16s}
.xdd-menu.floating{position:fixed;right:auto;z-index:100000}
.xdd-menu.floating.up{transform:translateY(6px)}
.xdd-menu.open{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.xdd.is-disabled .xdd-trigger,.xdd-trigger:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:560px){.dd-menu,.loc-menu,.sort-menu,.xdd-menu{border-radius:12px!important}.dd-opt,.loc-opt,.sort-opt,.xdd-opt{padding:12px}}
@media(prefers-reduced-motion:reduce){.dd-menu,.loc-menu,.sort-menu,.xdd-menu,.xdd-chev{transition:none!important}}
