/* Shop listing de la "Catalog" in jos, dupa ligahosting_shop_demo.html (proprietar). Partea de sus (titlu, regiuni, sale,
   cele 4 categorii Game Servers / Discord Bots / Web Hosting / VPS Hosting) ramane cea de pe live. Clase cu prefix sd- ca sa
   nu se bata cu CSS-ul global al site-ului. */
.sd-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 20px; align-items: start; margin-top: 16px; }
.sd-layout:has(> .sd-sidebar[hidden]) { grid-template-columns: minmax(0, 1fr); }
.sd-sidebar { display: grid; gap: 14px; position: sticky; top: 88px; }
.sd-sidebox { border: 1px solid #1b2b55; background: linear-gradient(145deg, #0d1731, #080f22); border-radius: 15px; padding: 17px; display: flex; flex-direction: column; max-height: calc(100vh - 110px); }
.sd-sidebox h3 { font-size: 11px; letter-spacing: 1.2px; color: #9baed7; margin: 0 0 12px; font-weight: 700; text-transform: uppercase; }
.sd-search { display: flex; align-items: center; gap: 10px; border: 1px solid #1b2b55; border-radius: 12px; background: #0b142b; padding: 0 12px; height: 44px; color: #aebbe0; margin-bottom: 14px; flex: none; }
.sd-search i { color: #19d8ff; font-size: 14px; }
.sd-search input { width: 100%; border: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; color: #fff !important; font: inherit; font-size: 13px; padding: 0 !important; height: auto !important; }
.sd-search button { border: 0; background: transparent; color: #aebbe0; cursor: pointer; font-size: 12px; }
.sd-categories { display: flex; flex-direction: column; overflow-y: auto; min-height: 0; scrollbar-width: thin; padding-right: 2px; }
.sd-category { display: flex; align-items: center; gap: 8px; padding: 10px; border-radius: 9px; color: #c5d0ec; font-size: 12px; font-weight: 600; margin: 2px 0; border: 0; background: transparent; text-align: left; cursor: pointer; width: 100%; transition: background .2s, color .2s; }
.sd-category img, .sd-category i { width: 20px; height: 20px; border-radius: 5px; object-fit: cover; flex: none; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; color: #a98bff; }
.sd-category span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sd-category small { background: #172447; padding: 4px 7px; border-radius: 6px; font-size: 10px; }
.sd-category:hover, .sd-category.active { background: linear-gradient(90deg, #6320d8, #3d1a86); color: #fff; }
.sd-category.active small { background: rgba(0,0,0,.25); }
.sd-results { display: flex; justify-content: space-between; align-items: center; margin: 0 2px 13px; color: #91a0c2; font-size: 12px; }
.sd-results strong { color: #e4eaff; }
.sd-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sd-card { display: flex; flex-direction: column; overflow: hidden; min-width: 0; border: 1px solid #203665; border-radius: 16px; background: linear-gradient(155deg, #0d1935, #080f22 75%); transition: transform .25s, border-color .25s, box-shadow .25s; }
.sd-card:hover { transform: translateY(-4px); border-color: #7543d9; box-shadow: 0 18px 38px rgba(0,0,0,.4), 0 0 24px rgba(124,53,255,.09); }
.sd-card.is-out { opacity: .6; } .sd-card.is-out:hover { transform: none; }
.sd-art { display: block; height: 160px; position: relative; background-size: cover; background-position: center; background-color: #081126; }
.sd-art:after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, #081126 0%, transparent 60%), linear-gradient(90deg, rgba(7,16,37,.27), transparent); }
.sd-art-label { position: absolute; z-index: 1; bottom: 13px; left: 16px; font-size: 15px; font-weight: 900; letter-spacing: -.3px; color: #fff; text-shadow: 0 2px 8px #000; }
.sd-body { padding: 16px; display: flex; flex-direction: column; flex: 1; }
.sd-body h2 { font-size: 16px; letter-spacing: -.3px; margin: 0 0 13px; color: #fff; font-weight: 700; }
.sd-pills { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 15px; }
.sd-pill { display: inline-flex !important; align-items: center; gap: 6px; border: 1px solid #21425a !important; border-radius: 30px !important; padding: 5px 9px !important; font-size: 9px !important; color: #b7c7e7 !important; font-weight: 750 !important; font-family: inherit !important; text-transform: uppercase; letter-spacing: .4px; background: transparent !important; line-height: 1.2; }
.sd-pill i { font-size: 9px; }
.sd-pill.is-ok { color: #23e0b0 !important; border-color: #146c5d !important; background: #082b2a !important; }
.sd-pill.is-ok:before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #23e0b0; }
.sd-pill.is-low { color: #ffc84a !important; border-color: #6c5114 !important; background: #2b2208 !important; }
.sd-pill.is-low:before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #ffc84a; }
.sd-pill.is-out { color: #ff6b8a !important; border-color: #6c1430 !important; background: #2b0814 !important; }
.sd-pill.is-out:before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #ff6b8a; }
.sd-live .lh-live-stock { font-size: 9px; }
.sd-specs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #1a2a4c; border-bottom: 1px solid #1a2a4c; padding: 13px 0; margin-bottom: 15px; }
.sd-spec { padding: 0 7px; border-right: 1px solid #1a2a4c; min-width: 0; }
.sd-spec:first-child { padding-left: 0; } .sd-spec:last-child { border: 0; padding-right: 0; }
.sd-spec label { display: block; color: #7185b2; font-size: 9px; margin-bottom: 7px; }
.sd-spec strong { font-size: 10px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; }
.sd-price-row { display: flex; align-items: baseline; gap: 5px; margin-bottom: 12px; flex-wrap: wrap; }
.sd-price { font-size: 24px; font-weight: 800; letter-spacing: -1px; color: #fff; }
.sd-was { font-size: 12px; color: #ff6b8a; text-decoration: line-through; }
.sd-per { font-size: 11px; color: #a9b6d4; }
.sd-converted { font-size: 10px; color: #7383a7; margin-left: 4px; }
.sd-converted .ron-tag, .sd-converted .lh-ron { font-size: 10px; }
.sd-deal { display: flex; align-items: center; gap: 10px; border: 1px solid #273d68; border-radius: 10px; padding: 10px; margin-bottom: 10px; background: #0a142a; }
.sd-deal-icon { display: grid; place-items: center; flex: 0 0 27px; height: 27px; border-radius: 8px; background: #ffbd31; color: #3b2600; font-size: 13px; }
.sd-deal strong { display: block; font-size: 10px; color: #ffc84a; margin-bottom: 3px; }
.sd-deal small { display: block; font-size: 9px; color: #a7b4d2; }
.sd-order { margin-top: auto; width: 100%; display: flex; justify-content: center; align-items: center; gap: 9px; padding: 13px; border-radius: 9px; background: linear-gradient(100deg, #8d32ff, #6423e7); color: #fff; font-size: 12px; font-weight: 800; border: 1px solid #a25aff; box-shadow: 0 5px 18px rgba(113,35,223,.19); cursor: pointer; transition: .2s; text-decoration: none; }
.sd-order:hover { filter: brightness(1.13); box-shadow: 0 0 25px rgba(141,50,255,.4); color: #fff; }
.sd-order.is-disabled { background: #1b2948; border-color: #273d68; color: #7185b2; box-shadow: none; pointer-events: none; }
.sd-order i { font-size: 11px; }
.sd-empty { grid-column: 1 / -1; padding: 40px; text-align: center; color: #9baed7; }
.sd-benefits { display: grid; grid-template-columns: repeat(4, 1fr); margin: 22px 0 10px; border: 1px solid #23396b; border-radius: 16px; background: rgba(8,15,35,.85); padding: 18px 10px; }
.sd-benefit { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 4px 14px; border-right: 1px solid #1b2a4c; }
.sd-benefit:last-child { border: 0; }
.sd-benefit-icon { flex: 0 0 40px; height: 40px; display: grid; place-items: center; border: 1px solid #7332d8; border-radius: 13px; background: #1c1040; color: #c79aff; font-size: 17px; }
.sd-benefit strong { display: block; font-size: 12px; margin-bottom: 5px; color: #fff; }
.sd-benefit small { font-size: 10px; color: #91a4ce; }
@media (max-width: 1200px) { .sd-layout { grid-template-columns: 190px minmax(0, 1fr); } .sd-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 850px) {
	.sd-layout { grid-template-columns: minmax(0, 1fr); }
	.sd-sidebar { position: static; min-width: 0; max-width: 100%; }
	.sd-sidebox { max-height: none; min-width: 0; padding: 14px; }
	.sd-categories { flex-direction: row; overflow-x: auto; overflow-y: hidden; min-width: 0; max-width: 100%; gap: 6px; padding-bottom: 4px; -webkit-overflow-scrolling: touch; }
	.sd-category { width: auto; white-space: nowrap; flex: none; margin: 0; }
	.sd-category span { overflow: visible; }
	.sd-benefits { grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; }
	.sd-benefit { border: 0; justify-content: flex-start; }
}
@media (max-width: 560px) { .sd-cards { grid-template-columns: 1fr; } .sd-art { height: 185px; } .sd-benefits { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .sd-card, .sd-order { transition: none; } .sd-card:hover { transform: none; } }
/* input-ul de cautare: specificitate peste regula globala .app-shell input:not()... a site-ului */
.app-shell-public .sd-layout .sd-sidebox .sd-search input[type="search"], .app-shell .sd-layout .sd-sidebox .sd-search input[type="search"] { border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; height: 100% !important; border-radius: 0 !important; color: #fff !important; font-size: 13px !important; }
.sd-benefit { min-width: 0; } .sd-benefit > div { min-width: 0; }