.popover {
width: 100%;
max-width: 800px;
}
.col19 {
margin-right: 30px;
}
.autocomplete-results {
background: white;
border: 1px solid #ccc;
z-index: 9999;
max-height: 400px;
min-width: 300px;
overflow-y: auto;
width: 100%;
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
.autocomplete-item {
display: flex;
align-items: center;
padding: 5px;
gap: 10px;
}
.autocomplete-item img {
width: 50px;
height: 70px;
object-fit: cover;
}


.psm-hidden { display:none; }
#search-modal.psm-open { display:block; position:fixed; inset:0; z-index:1000; }
#search-modal .psm-backdrop { position:absolute; inset:0; background-color: rgba(0,0,0,0.4); }
.psm-modal-shell {
position:relative; background:#fff; margin:2% auto; padding:20px; border:1px solid #888;
width:80%; border-radius:10px; z-index:1; max-height:85vh; overflow:auto;
}
.psm-close { position:absolute; top:8px; right:10px; border:0; background:transparent; font-size:28px; cursor:pointer; }
.psm-title { margin:0 0 10px; }
.psm-searchbar { display:flex; gap:8px; margin:8px 0 12px; }
#psm-input { flex:1; padding:10px 12px; }
#psm-clear { padding:10px 12px; }
.psm-status { font-size:14px; color:#666; min-height:18px; margin-bottom:8px; }
body.psm-no-scroll { overflow:hidden; }

.gallerySearch {
display: flex; flex-wrap: wrap; justify-content: center; gap: 30px;
}
.gallerySearch img {
max-width: 200px; background-size: contain; object-fit: contain; min-height: 100px; cursor: pointer;
border: 1px solid #ccc; border-radius: 5px; padding: 5px;
}
img.lazy-load {
height: 200px;
}
.gallerySearch img:hover { border-color: #007bff; }
.product-item-para{ max-width: 112px; }
.readonly{ background-color: #f7fdf9; border: 0; }

.categoryTitle {
margin-top: 0px; text-align: left; font-size: 1em; color: #333; width: 100%; clear: both;
cursor: pointer; font-weight: bold; padding: 10px; background-color: #f5f5f5; border: 1px solid #ccc; border-radius: 5px;
}
.categoryTitle:hover { background-color: #eaeaea; }

.category-container {
display: none;
flex-direction: row; width: 100%; flex-wrap: wrap; gap: 10px; margin: 10px 0 20px; padding-left: 20px;
border: 1px solid #ddd; border-radius: 5px; padding: 10px;
}

.lazy-load { width: 150px; height: auto; margin: 5px; opacity: 0; transition: opacity 0.3s ease-in-out; }
.lazy-load[src] { opacity: 1; }

.product-item { text-align: center; width: 200px; }
.product-item img { max-width: 100%; border-radius: 5px; }
.product-name { margin: 5px 0 0; font-size: 0.9em; }

.psm-results .loading, .psm-results .empty, .psm-results .error { padding:10px; color:#666; width:100%; text-align:center; }


.psm-layout {
display: grid;
grid-template-columns: 260px 1fr;
gap: 16px;
align-items: start;
}
@media (max-width: 900px){
.psm-layout { grid-template-columns: 1fr; }
}

@media (min-width: 900px){
li.menu-item-has-children.gratis-gaver-box { 
text-align: center;
padding: 5px 15px;
border-radius: 5px;
color: #fff !important;
background: /* stripes overlay */ repeating-linear-gradient(-14deg, rgba(255, 255, 255, .06) 0 14px, rgba(255, 255, 255, 0) 14px 36px), /* hot gradient */ radial-gradient(120% 120% at 100% 0%, rgba(255, 43, 43, .22) 0%, rgba(255, 43, 43, .08) 35%, rgba(0, 0, 0, 0) 60%), linear-gradient(180deg, #0b5c32, #0b5c32 60%, #063c20);
border: none;
}
li.menu-item-has-children > a.gratis-gaver-text {
text-transform: uppercase;
font-weight: 700 !important;
color: rgba(255, 255, 255, .85) !important;
background: #fff;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
z-index: 1;
}
li.menu-item-has-children.gratis-gaver-parent > a {
text-decoration: none;
}

}

.psm-cats {
position: sticky; top: 8px;
background: #f7f7f7; border: 1px solid #e4e4e4; border-radius: 8px;
padding: 10px; max-height: 70vh; overflow: auto;
}
.psm-cats h4 { margin: 6px 8px 8px 0px; font-size: 15px; color:#333; }
.psm-cat-list { list-style: none; margin: 0; padding: 0; font-weight: 700;margin-bottom: 25px;}
.psm-cat-item {
display:flex; align-items:center; justify-content:space-between;
gap:8px; padding:5px 5px; border-radius:5px; cursor:pointer;
}
.psm-cat-item:hover { background:#eee; }
.psm-cat-item.active { background:#e3f2e8; border:1px solid #cfe8d9; }
.psm-cat-name { font-size:14px; }
.psm-cat-count { font-size:12px; color:#555; }

.psm-grid { min-height: 200px; }
.psm-hidden { display:none !important; }

#psm-grid.gallerySearch {
display: flex;
flex-wrap: wrap;
gap: 40px;
justify-content: flex-start;
align-items: stretch;
}

#psm-grid .product-item {
flex: 0 0 200px;
max-width: 200px;
}
#search-modal #psm-grid.gallerySearch {
display: flex !important;
flex-wrap: wrap !important;
gap: 40px !important;
justify-content: flex-start !important;
align-items: stretch !important;
}
#search-modal #psm-grid.gallerySearch .product-item {
flex: 0 0 200px !important;
max-width: 200px !important;
box-sizing: border-box;
}
.psm-hidden { display: none !important; }

.psm-actions {
display: flex; gap: 8px; margin-top: 8px; justify-content: center; flex-wrap: wrap;
}
.psm-btn {
display: inline-block; padding: 8px 10px; border-radius: 8px; font-size: 13px; text-decoration: none;
border: 1px solid #ddd; background: #f7f7f7; color: #222;
}
.psm-btn:hover { filter: brightness(0.97); }
.psm-btn-primary {
background: #084ab7; border-color: #2563eb; color: #fff;
}
.psm-btn-secondary {
background: #0b5c32; border-color: #2f855a; color: #fff;
}
a.psm-btn.psm-btn-secondary:hover {
color: #ebebeb;
}
a.psm-btn.psm-btn-primary:hover {
color: #ebebeb;
}
a.psm-btn.psm-btn-secondary:visited {
color: #ebebeb;
}
a.psm-btn.psm-btn-primary:visited {
color: #ebebeb;
}

.psm-sort-box,
.psm-gender-box,
.psm-price-box,
.psm-brand-box {
margin-bottom: 25px;
}
.psm-gender-item,
.psm-price-item,
.psm-brand-item {
display: flex;
align-items: center;
gap: 10px;
cursor: pointer;
}
input[type="checkbox"][id^="psm-"] {
width: 20px;
height: 20px;
margin-right: 0;
vertical-align: bottom;
accent-color: #1a73e8;
}
input:is([type="checkbox"], [type="radio"])[id^="psm-"] {
width: 20px;
height: 20px;
margin-right: 0;
vertical-align: bottom;
}
select.psm-sort-select {
border-radius: 5px;
}
input#psm-input {
border-radius: 10px;
border: 2px solid #0b5c32;
}