/* Rebel PC Builder V45 — presentation-only light/dark and component-card polish. */
:root{--builder-focus:#2368d8;--builder-price:#171a1f;--builder-muted:#59616b;--builder-card:#fff;--builder-card-border:#deded9;--builder-image:#f7f7f4}

/* Product identity, commercial information and action remain visually distinct. */
#picker .product{grid-template-columns:minmax(78px,96px) minmax(0,1fr);align-items:start}
#picker .product .part-art{display:grid;place-items:center;width:100%;height:96px;padding:7px;box-sizing:border-box;overflow:hidden;background:var(--builder-image)!important;border:1px solid #e7e7e2;border-radius:4px}
#picker .product .part-art img{display:block;width:100%!important;height:100%!important;max-width:100%;max-height:100%;object-fit:contain!important;object-position:center}
#picker .product h4{color:#202327!important;overflow-wrap:anywhere}
#picker .product .spec{color:var(--builder-muted)!important}
#picker .product .price{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:8px 0 6px;color:var(--builder-price)!important;font-size:17px!important;font-weight:900;line-height:1.15;letter-spacing:.01em}
#picker .product .price:before{content:'EFT PRICE';display:block;color:#16785e;font-size:8px;font-weight:900;line-height:1;letter-spacing:.13em}
#picker .product .price:after{content:none!important}
#picker .product .pick-state{margin-top:7px;font-weight:900;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

/* Focus is unmistakable but does not resemble a validation error. */
#picker .search:focus-within{border-color:var(--builder-focus)!important;box-shadow:0 0 0 3px rgba(35,104,216,.18)!important}
#picker #search:focus{outline:0}
#picker button:focus-visible,#picker select:focus-visible,#picker input:focus-visible,.builder-theme-toggle:focus-visible,.mobile-menu-toggle:focus-visible{outline:3px solid var(--builder-focus)!important;outline-offset:2px}

/* Explicit light-mode modal surfaces and critical contrast. */
html[data-theme="light"] #picker .modal-shell{background:#f4f4f1!important;color:#202327!important}
html[data-theme="light"] #picker .modal-head,html[data-theme="light"] #picker .toolbar,html[data-theme="light"] #picker .pager,html[data-theme="light"] #picker .mobile-results-heading{background:#fff!important;border-color:#d7d8d4!important;color:#202327!important}
html[data-theme="light"] #picker .search,html[data-theme="light"] #picker select{background:#fff!important;border-color:#bfc3c7!important;color:#202327!important}
html[data-theme="light"] #picker input{color:#202327!important}
html[data-theme="light"] #picker input::placeholder{color:#69717a!important}
html[data-theme="light"] #picker .product{background:var(--builder-card)!important;border-color:var(--builder-card-border)!important;color:#202327!important}
html[data-theme="light"] #picker .impact{color:#fff!important}
html[data-theme="light"] #picker .pick-state{color:#343a41!important}
html[data-theme="light"] #picker .close{color:#202327!important;border-color:#bfc3c7!important;background:#fff!important}

/* Explicit dark-mode component picker; no colour inversion. */
html[data-theme="dark"]{--builder-focus:#78a9ff;--builder-price:#f5f7fa;--builder-muted:#aeb8c5;--builder-card:#12171f;--builder-card-border:#303944;--builder-image:#f5f5f2}
html[data-theme="dark"] #picker .modal-shell{background:#0d1219!important;color:#eef1f4!important}
html[data-theme="dark"] #picker .modal-head,html[data-theme="dark"] #picker .toolbar,html[data-theme="dark"] #picker .pager,html[data-theme="dark"] #picker .mobile-results-heading{background:#12171f!important;border-color:#303944!important;color:#eef1f4!important}
html[data-theme="dark"] #picker .product{background:var(--builder-card)!important;border-color:var(--builder-card-border)!important;color:#eef1f4!important}
html[data-theme="dark"] #picker .product h4{color:#f5f7fa!important}
html[data-theme="dark"] #picker .product .spec{color:var(--builder-muted)!important}
html[data-theme="dark"] #picker .product .price{color:var(--builder-price)!important}
html[data-theme="dark"] #picker .product .price:before{color:#53d9ae}
html[data-theme="dark"] #picker .impact{color:#fff!important}
html[data-theme="dark"] #picker .pick-state{color:#d5dbe3!important}
html[data-theme="dark"] #picker .search,html[data-theme="dark"] #picker select{background:#0a0f15!important;border-color:#465261!important;color:#eef1f4!important}
html[data-theme="dark"] #picker input{color:#eef1f4!important}
html[data-theme="dark"] #picker input::placeholder{color:#9aa6b4!important}
html[data-theme="dark"] #picker .close{color:#f5f7fa!important;border-color:#465261!important;background:#171c24!important}

/* Mobile hierarchy and tap targets without changing the approved structure. */
@media(max-width:700px){
  #picker .product{grid-template-columns:96px minmax(0,1fr)!important;gap:12px!important;min-height:132px!important;padding:12px!important}
  #picker .product .part-art{height:96px!important;padding:8px}
  #picker .product h4{margin:0 0 6px!important;font-size:13px!important;line-height:1.35!important}
  #picker .product .spec{font-size:10px!important;line-height:1.4!important}
  #picker .product .price{margin:8px 0 5px;font-size:17px!important}
  #picker .product .pick-state{min-height:28px;display:flex;align-items:center}
  #picker .search{min-height:44px}
  #picker .search input,#picker .toolbar select,#picker .mobile-picker-controls button,#picker .close,#picker .done-picking{min-height:44px}
  body.mobile-menu-open .header-actions .builder-theme-toggle{display:flex!important}
}
@media(max-width:430px){
  #picker .product{grid-template-columns:86px minmax(0,1fr)!important;gap:10px!important;padding:10px!important}
  #picker .product .part-art{height:86px!important}
}
@media(max-width:390px){
  #picker .product{grid-template-columns:78px minmax(0,1fr)!important}
  #picker .product .part-art{height:78px!important;padding:5px}
  #picker .product h4{font-size:12px!important}
}

/* V45.0.1 Auto-Builder modal semantic contrast hotfix. */
#wizard .wizard-intro h2{color:#f5f7fa!important}
#wizard .wizard-intro>p:not(.eyebrow){color:#cbd3dc!important}
#wizard .wizard-strategies small{color:#cbd3dc!important}
;