:root{--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(255, 255, 255, .5);--glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, .15);--blur-strength: 12px;--brand-primary: #ff8c00;--text-primary: #1e293b;--text-secondary: #64748b}body.dark-mode{--glass-bg: transparent;--glass-border: rgba(255, 255, 255, .1);--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .3);--text-primary: #f1f5f9;--text-secondary: #94a3b8}.premium-search-container{position:relative;width:50%;max-width:600px;margin:0 auto;z-index:1;transition:all .3s cubic-bezier(.25,.46,.45,.94);transform:translateZ(0);will-change:width,max-width,transform}.premium-search-container:focus-within{width:65%;max-width:800px}.search-input-wrapper{position:relative;display:flex;align-items:center;background:var(--glass-bg);backdrop-filter:blur(var(--blur-strength));-webkit-backdrop-filter:blur(var(--blur-strength));border:1px solid var(--glass-border);border-radius:999px;padding:8px 16px;box-shadow:0 4px 6px -1px #0000000d;transition:all .3s cubic-bezier(.4,0,.2,1);transform:translateZ(0);will-change:transform,box-shadow}.search-input-wrapper:focus-within{box-shadow:var(--glass-shadow);transform:translateY(-2px) translateZ(0);background:#fffffff2;outline:none}body.dark-mode .search-input-wrapper:focus-within{background:rgba(255, 255, 255, 0.12)}.search-icon{color:var(--text-secondary);font-size:1.2rem;margin-right:12px;transition:color .3s}.search-input-wrapper:focus-within .search-icon{color:var(--brand-primary)}.premium-search-input{width:100%;background:transparent;border:none;font-size:1rem;color:var(--text-primary);padding:8px 0;outline:none;font-family:Inter,sans-serif}.premium-search-input:focus,.premium-search-input:focus-visible{outline:none!important;box-shadow:none!important}.premium-search-input::placeholder{color:var(--text-secondary);opacity:.7}.premium-suggestions{position:absolute;top:calc(100% + 12px);left:0;width:100%;background:var(--glass-bg);backdrop-filter:blur(var(--blur-strength));-webkit-backdrop-filter:blur(var(--blur-strength));border:1px solid var(--glass-border);border-radius:16px;box-shadow:var(--glass-shadow);padding:16px;opacity:0;transform:translateY(-10px) translateZ(0);visibility:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:opacity,transform;max-height:400px;overflow-y:auto;z-index:40}.premium-suggestions.active{opacity:1;transform:translateY(0) translateZ(0);visibility:visible}.search-section-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);margin-bottom:12px;margin-top:8px;font-weight:600;display:flex;align-items:center;gap:8px}.result-item{display:flex;align-items:center;padding:12px;border-radius:16px;cursor:pointer;transition:all .25s cubic-bezier(.16,1,.3,1);margin-bottom:6px;animation:fadeInItem .4s cubic-bezier(.16,1,.3,1) forwards;opacity:0;border:1px solid transparent}.result-item:nth-child(2){animation-delay:.04s}.result-item:nth-child(3){animation-delay:.08s}.result-item:nth-child(4){animation-delay:.12s}.result-item:nth-child(5){animation-delay:.16s}@keyframes fadeInItem{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.result-item:hover{background:#00000008}.result-item:active{background:#0000000f;transform:scale(.97)}body.dark-mode .result-item:hover{background:#ffffff0a}body.dark-mode .result-item:active{background:#ffffff14;transform:scale(.97)}.result-thumb{width:52px;height:52px;border-radius:12px;object-fit:cover;margin-right:16px;border:1px solid rgba(0,0,0,.06);background:#fff;padding:2px;box-shadow:0 4px 12px #0000000f;transition:transform .25s ease}.result-item:active .result-thumb{transform:scale(.95)}.result-info{flex:1}.result-name{font-weight:600;color:var(--text-primary);font-size:.95rem;margin-bottom:2px}.result-meta{font-size:.85rem;color:var(--text-secondary);display:flex;justify-content:space-between;align-items:center}.result-price{color:var(--brand-primary);font-weight:700;font-size:.9rem}.history-item{display:flex;align-items:center;padding:12px 14px;border-radius:12px;color:var(--text-primary);cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);margin-bottom:4px}.history-item:hover{background:#00000008}.history-item:active{background:#0000000f;transform:scale(.97)}body.dark-mode .history-item:hover{background:#ffffff0a}body.dark-mode .history-item:active{background:#ffffff14;transform:scale(.97)}.history-icon{margin-right:12px;color:var(--text-secondary);font-size:.9rem}.premium-suggestions::-webkit-scrollbar{width:6px}.premium-suggestions::-webkit-scrollbar-track{background:transparent}.premium-suggestions::-webkit-scrollbar-thumb{background:#0000001a;border-radius:3px}body.dark-mode .premium-suggestions::-webkit-scrollbar-thumb{background:#ffffff1a}

/* ── Dark Mode Suggestions Dropdown ── */
body.dark-mode .premium-suggestions {
  background: rgba(10, 10, 14, 0.9) !important;
  backdrop-filter: blur(24px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(200%) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.8) !important;
}

/* ── NUCLEAR: Remove ALL backgrounds + blur from search bar in dark mode ── */
body.dark-mode .search-input-wrapper,
body.dark-mode .new-header .search-input-wrapper,
body.dark-mode .bottom-bar .search-input-wrapper,
body.dark-mode .premium-search-container .search-input-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1.5px solid rgba(255, 255, 255, 0.3) !important;
  box-shadow: none !important;
}

/* ── THE ACTUAL FIX: the <input> element itself was getting background:#1f2038
   from a global "body.dark-mode input" rule in styles.css ── */
body.dark-mode .search-input-wrapper input,
body.dark-mode .search-input-wrapper .search-input,
body.dark-mode .search-input-wrapper .premium-search-input,
body.dark-mode .premium-search-container input,
body.dark-mode input.search-input,
body.dark-mode input.premium-search-input {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #f1f5f9 !important;
}

/* Keep the white search pill readable against the unified light desktop header. */
@media (min-width:769px){
  .new-header .search-input-wrapper{background:rgba(255,255,255,.94)!important;border:1.5px solid rgba(245,114,36,.34)!important;box-shadow:0 8px 24px rgba(111,57,20,.06)!important}
  .new-header .search-input-wrapper:focus-within{border-color:rgba(245,114,36,.62)!important;box-shadow:0 10px 28px rgba(245,114,36,.13)!important}
  body.dark-mode .new-header .search-input-wrapper{background:rgba(15,23,42,.78)!important;border-color:rgba(96,165,250,.30)!important}
  body.dark-mode .new-header .search-input-wrapper:focus-within{border-color:rgba(96,165,250,.58)!important;box-shadow:0 10px 28px rgba(37,99,235,.18)!important}
}