.elementor-widget-rosoa_archive,
.elementor-widget-rosoa_archive:focus,
.elementor-widget-rosoa_archive.elementor-element-editable {
outline: none !important;
box-shadow: none !important;
border: none !important;
}
.rosoa-wrap {
outline: none !important;
} .rosoa-wrap * { box-sizing: border-box; }
.rosoa-wrap { direction: rtl; font-family: inherit; } .rosoa-subcat-wrap {
position: relative;
margin-bottom: 28px;
display: flex;
align-items: center;
gap: 0;
direction: rtl;
}
.rosoa-subcat-viewport {
flex: 1;
overflow: hidden;
min-width: 0;
}
.rosoa-subcat-track {
display: flex;
gap: 12px;
transition: transform 0.35s cubic-bezier(.4,0,.2,1);
direction: ltr;
justify-content: flex-start;
}
.rosoa-subcat-item {
flex-shrink: 0;
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
cursor: pointer;
width: 100px;
}
.rosoa-subcat-img {
width: 90px;
height: 90px;
border-radius: 50%;
border: 2px solid #e0e0e0;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
background: #f5f5f5;
transition: border-color 0.2s;
}
.rosoa-subcat-img img {
width: 100%;
height: 100%;
object-fit: contain;
}
.rosoa-subcat-all { background: #f0f0f0; }
.rosoa-subcat-item.active .rosoa-subcat-img { border-color: #111; border-width: 2.5px; }
.rosoa-subcat-item:hover .rosoa-subcat-img  { border-color: #555; }
.rosoa-subcat-name {
font-size: 12px;
color: #444;
text-align: center;
line-height: 1.3;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 90px;
}
.rosoa-subcat-item.active .rosoa-subcat-name { color: #111; font-weight: 700; }
.rosoa-subcat-prev,
.rosoa-subcat-next {
flex-shrink: 0;
width: 34px;
height: 34px;
border-radius: 50%;
border: 1.5px solid #ddd !important;
background: #fff !important;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: #555 !important;
transition: background 0.2s, border-color 0.2s;
box-shadow: 0 1px 4px rgba(0,0,0,.1);
padding: 0 !important;
}
.rosoa-subcat-prev:hover,
.rosoa-subcat-next:hover {
background: #111 !important;
border-color: #111 !important;
color: #fff !important;
}
.rosoa-subcat-prev svg,
.rosoa-subcat-next svg { pointer-events: none; } .rosoa-layout {
display: flex;
flex-direction: row;
gap: 24px;
align-items: flex-start;
direction: rtl; } .rosoa-sidebar {
width: 220px;
flex-shrink: 0;
background: #f8f8f8;
border-radius: 8px;
position: -webkit-sticky;
position: sticky;
top: 100px; max-height: calc(100vh - 120px);
overflow-y: auto;
order: -1;
align-self: flex-start;
}
.rosoa-sidebar-inner {
padding: 16px;
display: flex;
flex-direction: column;
gap: 20px;
}
.rosoa-filter-section { display: flex; flex-direction: column; gap: 10px; }
.rosoa-filter-title {
font-size: 12px;
font-weight: 700;
color: #444;
letter-spacing: 0.5px;
text-transform: uppercase;
padding-bottom: 6px;
border-bottom: 1px solid #e5e5e5;
} .rosoa-sort {
width: 100%;
padding: 8px 10px;
border: 1px solid #ddd;
border-radius: 6px;
font-size: 13px;
background: #fff;
color: #111;
cursor: pointer;
}
.rosoa-sort:focus { outline: none; border-color: #111; } .rosoa-price-display {
font-size: 13px;
font-weight: 600;
color: #111;
text-align: center;
}
.rosoa-range-wrap {
position: relative;
height: 36px;
display: flex;
align-items: center;
padding: 0 4px;
direction: ltr;
}
.rosoa-range-track {
position: absolute;
width: calc(100% - 8px);
left: 4px;
height: 4px;
background: #ddd;
border-radius: 2px;
top: 50%;
transform: translateY(-50%);
}
.rosoa-range-fill {
position: absolute;
height: 100%;
background: #111;
border-radius: 2px;
left: 0;
width: 100%;
}
.rosoa-range {
position: absolute;
width: calc(100% - 8px);
left: 4px;
-webkit-appearance: none;
appearance: none;
background: transparent;
pointer-events: none;
height: 4px;
margin: 0;
padding: 0;
direction: ltr;
}
.rosoa-range::-webkit-slider-thumb {
-webkit-appearance: none;
width: 18px; height: 18px;
border-radius: 50%;
background: #111;
cursor: pointer;
pointer-events: all;
border: 2px solid #fff;
box-shadow: 0 1px 4px rgba(0,0,0,.2);
transition: transform 0.15s;
}
.rosoa-range::-webkit-slider-thumb:hover { transform: scale(1.2); }
.rosoa-range::-moz-range-thumb {
width: 18px; height: 18px;
border-radius: 50%;
background: #111;
cursor: pointer;
pointer-events: all;
border: 2px solid #fff;
box-shadow: 0 1px 4px rgba(0,0,0,.2);
} .rosoa-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rosoa-tag {
padding: 4px 10px;
border: 1.5px solid #ddd;
border-radius: 20px;
background: #fff;
font-size: 11px;
font-weight: 500;
color: #333;
cursor: pointer;
transition: all 0.18s;
white-space: nowrap;
}
.rosoa-tag:hover { border-color: #111; color: #111; }
.rosoa-tag.active { background: #111; border-color: #111; color: #fff; } .rosoa-reset {
width: 100%;
padding: 8px;
border: 1.5px solid #ddd !important;
border-radius: 6px !important;
background: #fff !important;
font-size: 12px !important;
color: #666 !important;
cursor: pointer;
transition: all 0.18s;
text-decoration: none !important;
display: block;
}
.rosoa-reset:hover {
border-color: #e53935 !important;
color: #e53935 !important;
background: #fff !important;
} .rosoa-content { flex: 1; min-width: 0; direction: rtl; }
.rosoa-top-bar {
display: flex;
justify-content: flex-end;
margin-bottom: 14px;
}
.rosoa-total-count { font-size: 13px; color: #888; } .rosoa-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px; grid-auto-rows: auto;
} .rosoa-card {
display: flex;
flex-direction: column;
height: 100%;
}
.rosoa-img-outer { position: relative; margin-bottom: 12px; flex-shrink: 0; }
.rosoa-info {
flex: 1;
display: flex;
flex-direction: column;
padding: 0 4px;
gap: 4px;
text-align: right;
direction: rtl;
}
.rosoa-name-link { flex: 1; } .rosoa-price-current { flex-shrink: 0; }
.rosoa-price-row {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
flex-shrink: 0;
}
.rosoa-disc-pill {
font-size: 11px;
font-weight: 700;
background: #e53935;
color: #fff;
padding: 3px 8px;
border-radius: 20px;
white-space: nowrap;
letter-spacing: 0.02em;
}
.rosoa-card-actions {
flex-shrink: 0;
margin-top: 10px !important;
padding-top: 0 !important;
}
.rosoa-card:hover .rosoa-img-wrap img { transform: scale(1.04); }
.rosoa-img-wrap {
position: relative;
display: flex;
align-items: center;
justify-content: center;
background: #f2f2f2;
border-radius: 4px;
height: 240px; overflow: hidden;
text-decoration: none;
}
.rosoa-img-wrap img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
display: block;
transition: transform 0.35s ease;
} .rosoa-badge-wrap {
position: absolute;
top: 10px;
right: 10px;
z-index: 3;
}
.rosoa-badge {
display: inline-block;
padding: 4px 10px;
font-size: 11px;
font-weight: 700;
background: #111;
color: #fff;
border-radius: 2px;
}
.rosoa-badge-sale { background: #e53935; } .rosoa-cart-btn {
position: absolute;
bottom: 10px;
left: 10px;
width: 38px;
height: 38px;
border-radius: 50%;
background: #fff !important;
border: 1px solid #ddd !important;
cursor: pointer;
display: flex !important;
align-items: center;
justify-content: center;
transition: background 0.2s, border-color 0.2s;
z-index: 3;
padding: 0 !important;
box-shadow: 0 1px 4px rgba(0,0,0,.08);
color: #555 !important;
outline: none !important;
}
.rosoa-cart-btn:hover,
.rosoa-cart-btn:focus,
.rosoa-cart-btn:active,
.rosoa-wrap .rosoa-card .rosoa-img-wrap .rosoa-cart-btn:hover,
.rosoa-wrap .rosoa-card .rosoa-img-wrap button.rosoa-cart-btn:hover {
background: #e53935 !important;
background-color: #e53935 !important;
border-color: #e53935 !important;
color: #fff !important;
outline: none !important;
box-shadow: none !important;
text-decoration: none !important;
}
.rosoa-cart-btn svg { stroke: #555; transition: stroke 0.2s; pointer-events: none; }
.rosoa-cart-btn:hover svg,
.rosoa-cart-btn:focus svg,
.rosoa-wrap .rosoa-card .rosoa-img-wrap .rosoa-cart-btn:hover svg {
stroke: #ffffff !important;
fill: none !important;
}  .rosoa-name-link { text-decoration: none; color: inherit; }
.rosoa-name {
font-size: 13px;
font-weight: 500;
color: #111;
line-height: 1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.rosoa-price-current {
font-size: 14px;
font-weight: 700;
color: #111;
}
.rosoa-price-current .woocommerce-Price-amount { font-size: inherit; }
.rosoa-price-current ins { text-decoration: none !important; }
.rosoa-price-current del { color: #aaa !important; font-size: 12px; } .rosoa-loader {
display: flex;
justify-content: center;
padding: 30px;
}
.rosoa-spinner {
width: 32px; height: 32px;
border: 3px solid #eee;
border-top-color: #111;
border-radius: 50%;
animation: rosoa-spin 0.7s linear infinite;
}
@keyframes rosoa-spin { to { transform: rotate(360deg); } } .rosoa-empty {
grid-column: 1/-1;
text-align: center;
padding: 60px 20px;
color: #999;
font-size: 15px;
} .rosoa-toast {
position: fixed;
bottom: 24px; left: 50%;
transform: translateX(-50%) translateY(20px);
background: #222; color: #fff;
padding: 12px 28px;
border-radius: 30px;
font-size: 14px; font-weight: 600;
opacity: 0; pointer-events: none;
transition: opacity 0.3s, transform 0.3s;
z-index: 99999; direction: rtl;
}
.rosoa-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); } .rosoa-mobile-filter-toggle {
display: none !important; align-items: center;
gap: 8px;
padding: 10px 18px;
border: 1.5px solid #ddd !important;
border-radius: 8px !important;
background: #fff !important;
font-size: 14px !important;
font-weight: 600 !important;
color: #111 !important;
cursor: pointer;
margin-bottom: 16px;
direction: rtl;
outline: none !important;
box-shadow: none !important;
text-decoration: none !important;
}
.rosoa-mobile-filter-toggle:hover {
background: #f5f5f5 !important;
border-color: #aaa !important;
color: #111 !important;
}
.rosoa-mobile-filter-toggle:focus {
outline: none !important;
box-shadow: none !important;
background: #fff !important;
border-color: #ddd !important;
}
.rosoa-mobile-filter-toggle.active { background: #111 !important; color: #fff !important; border-color: #111 !important; }
.rosoa-mobile-filter-toggle.active svg { stroke: #fff !important; }
@media (max-width: 1024px) {
.rosoa-mobile-filter-toggle { display: flex !important; }
.rosoa-layout { flex-direction: column; }
.rosoa-sidebar {
width: 100%;
position: static;
display: none; }
.rosoa-sidebar.rosoa-sidebar-open { display: block; }
.rosoa-sidebar-inner { flex-direction: row; flex-wrap: wrap; gap: 16px; }
.rosoa-filter-section { min-width: 180px; flex: 1; }
}
@media (max-width: 600px) {
.rosoa-subcat-wrap { padding: 0 36px; }
.rosoa-subcat-item { width: 80px; }
.rosoa-subcat-img { width: 68px; height: 68px; }
.rosoa-subcat-name { max-width: 76px; font-size: 11px; }
.rosoa-grid { gap: 10px; } .rosoa-filter-section { min-width: 140px; }
} .rosoa-wrap button,
.rosoa-wrap input[type="button"] {
background: initial;
border: initial;
border-radius: initial;
color: initial;
font-size: initial;
font-weight: initial;
display: initial;
text-decoration: none;
outline: none !important;
box-shadow: none !important;
} .rosoa-wrap button:hover,
.rosoa-wrap button:focus,
.rosoa-wrap input[type="button"]:hover,
.rosoa-wrap input[type="button"]:focus {
background-color: initial !important;
border-color: initial !important;
color: initial !important;
outline: none !important;
box-shadow: none !important;
}
.rosoa-sort {
-webkit-appearance: auto;
appearance: auto;
} .rosoa-overlay {
position: fixed;
inset: 0;
background: rgba(0,0,0,.45);
z-index: 9000;
opacity: 0;
pointer-events: none;
transition: opacity 0.35s;
}
.rosoa-overlay.open { opacity: 1; pointer-events: all; }
.rosoa-drawer {
position: fixed;
top: 0; right: 0; bottom: 0;
width: min(420px, 100vw);
background: #fff;
z-index: 9001;
display: flex;
flex-direction: column;
transform: translateX(100%);
transition: transform 0.38s cubic-bezier(.4,0,.2,1);
box-shadow: -6px 0 32px rgba(0,0,0,.12);
direction: rtl;
}
.rosoa-drawer.open { transform: translateX(0); } .rosoa-drawer-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 20px 14px;
border-bottom: 1px solid #f0f0f0;
flex-shrink: 0;
}
.rosoa-drawer-title {
font-size: 11px;
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
color: #888;
}
.rosoa-drawer-close {
width: 32px; height: 32px;
border: none !important;
background: none !important;
cursor: pointer;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
color: #888 !important;
transition: background 0.15s, color 0.15s;
padding: 0 !important;
}
.rosoa-drawer-close:hover { background: #f5f5f5 !important; color: #111 !important; } .rosoa-drawer-body {
flex: 1;
overflow-y: auto;
padding: 20px;
display: flex;
flex-direction: column;
gap: 20px;
} .rosoa-drawer-product {
display: flex;
gap: 14px;
align-items: flex-start;
}
.rosoa-drawer-img {
width: 100px;
height: 130px;
object-fit: contain;
background: #f5f5f5;
border-radius: 6px;
flex-shrink: 0;
}
.rosoa-drawer-meta { flex: 1; }
.rosoa-drawer-name {
font-size: 15px;
font-weight: 600;
color: #111;
line-height: 1.4;
margin-bottom: 8px;
}
.rosoa-drawer-price { font-size: 14px; color: #111; }
.rosoa-drawer-price .woocommerce-Price-amount { font-size: inherit; } .rosoa-drawer-attr-sec { display: flex; flex-direction: column; gap: 10px; }
.rosoa-drawer-attr-label {
font-size: 11px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
color: #666;
}
.rosoa-drawer-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.rosoa-drawer-tag {
padding: 7px 14px;
border: 1.5px solid #ddd !important;
border-radius: 6px !important;
background: #fff !important;
font-size: 13px !important;
font-weight: 500 !important;
color: #333 !important;
cursor: pointer;
transition: all 0.15s;
}
.rosoa-drawer-tag:hover { border-color: #111 !important; color: #111 !important; }
.rosoa-drawer-tag.active {
background: #111 !important;
border-color: #111 !important;
color: #fff !important;
} .rosoa-drawer-err {
font-size: 12px;
color: #e53935;
padding: 8px 12px;
background: #fdecea;
border-radius: 4px;
} .rosoa-drawer-foot {
padding: 14px 20px 10px;
border-top: 1px solid #f0f0f0;
display: flex;
gap: 10px;
align-items: center;
flex-shrink: 0;
}
.rosoa-drawer-qty-wrap {
display: flex;
align-items: center;
border: 1.5px solid #ddd;
border-radius: 6px;
overflow: hidden;
flex-shrink: 0;
}
.rosoa-drawer-minus,
.rosoa-drawer-plus {
width: 34px; height: 40px;
border: none !important;
background: #f5f5f5 !important;
font-size: 18px !important;
color: #111 !important;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
padding: 0 !important;
transition: background 0.15s;
}
.rosoa-drawer-minus:hover,
.rosoa-drawer-plus:hover { background: #eee !important; }
.rosoa-drawer-qty {
width: 36px;
text-align: center;
font-size: 14px;
font-weight: 600;
color: #111;
}
.rosoa-drawer-view {
display: block;
text-align: center;
padding: 10px 20px 16px;
font-size: 12px;
color: #888;
text-decoration: underline;
flex-shrink: 0;
}
@media(max-width:600px){
.rosoa-drawer { width: 100vw; }
} .rosoa-topbar {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 14px;
direction: rtl;
}
.rosoa-total-count-top {
font-size: 13px;
color: #888;
} @media (max-width: 1024px) {
.rosoa-topbar {
flex-direction: row;
align-items: center;
}
.rosoa-total-count-top {
flex: 1;
text-align: right;
}
} .rosoa-cat-heading {
margin-bottom: 16px;
direction: rtl;
text-align: center;
width: 100%;
}
.rosoa-cat-heading-text {
font-size: 1.4rem;
font-weight: 700;
color: #111;
display: block;
text-align: center;
} .rosoa-drawer-btns {
display: flex;
gap: 10px;
flex: 1;
direction: rtl;
}
.rosoa-drawer-atc {
flex: 1;
height: 44px;
background: #111 !important;
color: #fff !important;
border: none !important;
border-radius: 6px !important;
font-size: 14px !important;
font-weight: 600 !important;
cursor: pointer;
transition: opacity 0.2s;
white-space: nowrap;
}
.rosoa-drawer-atc:hover { opacity: 0.85; }
.rosoa-drawer-atc:disabled { opacity: 0.6; pointer-events: none; }
.rosoa-drawer-buy {
flex: 1;
height: 44px;
background: #e53935 !important;
color: #fff !important;
border: none !important;
border-radius: 6px !important;
font-size: 14px !important;
font-weight: 600 !important;
cursor: pointer;
transition: opacity 0.2s;
white-space: nowrap;
}
.rosoa-drawer-buy:hover { opacity: 0.85; }
.rosoa-drawer-buy:disabled { opacity: 0.6; pointer-events: none; } .rosoa-card-actions {
display: flex !important;
flex-direction: row !important;
gap: 8px !important;
margin-top: 8px !important;
padding-top: 8px !important;
direction: rtl !important;
width: 100% !important;
align-items: stretch !important;
}
.rosoa-card-atc-btn,
.rosoa-card-buy-btn {
flex: 1 1 0 !important;
min-width: 0 !important;
padding: 9px 6px !important;
border: none !important;
cursor: pointer !important;
transition: transform 0.15s ease !important;
outline: none !important;
box-shadow: none !important;
text-decoration: none !important;
display: block !important;
text-align: center !important;
}
.rosoa-card-atc-btn {
background: #111 !important;
color: #fff !important;
border-radius: 6px !important;
}
.rosoa-card-buy-btn {
background: #e53935 !important;
color: #fff !important;
border-radius: 6px !important;
}
.rosoa-card-atc-btn:hover { transform: scale(1.03) !important; background: #111 !important; color: #fff !important; }
.rosoa-card-buy-btn:hover { transform: scale(1.03) !important; background: #e53935 !important; color: #fff !important; } @media (max-width: 1024px) {
.rosoa-card-buy-btn { display: none !important; }
.rosoa-wrap .rosoa-card .rosoa-card-actions .rosoa-card-atc-btn,
.rosoa-wrap .rosoa-card .rosoa-card-actions .rosoa-card-atc-btn:hover,
.rosoa-wrap .rosoa-card .rosoa-card-actions .rosoa-card-atc-btn:focus {
background: #C62828 !important;
background-color: #C62828 !important;
color: #fff !important;
}
}
.rosoa-card-atc-btn:focus,
.rosoa-card-buy-btn:focus,
.rosoa-card-atc-btn:active,
.rosoa-card-buy-btn:active {
outline: none !important;
box-shadow: none !important;
}
.rosoa-card-atc-btn:disabled { opacity: 0.6 !important; pointer-events: none !important; } .rosoa-wrap { font-family: 'Assistant', 'Rubik', 'Heebo', sans-serif; }
.rosoa-card-atc-btn,
.rosoa-card-buy-btn,
.rosoa-drawer-atc,
.rosoa-drawer-buy {
font-family: inherit;
font-size: 13px;
font-weight: 600;
line-height: 1.4;
} .rosoa-search-wrap { position: relative; }
.rosoa-search-input {
width: 100%;
padding: 9px 12px;
border: 1.5px solid #ddd !important;
border-radius: 8px !important;
font-size: 13px !important;
font-family: 'Assistant', 'Rubik', 'Heebo', sans-serif !important;
background: #fff !important;
color: #111 !important;
outline: none !important;
box-shadow: none !important;
direction: rtl;
transition: border-color 0.2s;
}
.rosoa-search-input:focus { border-color: #111 !important; }
.rosoa-search-results {
position: absolute;
top: calc(100% + 6px);
right: 0; left: 0;
background: #fff;
border: 1.5px solid #eee;
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0,0,0,.12);
z-index: 999;
display: none;
max-height: 400px;
overflow-y: auto;
direction: rtl;
}
.rosoa-search-item {
display: flex;
align-items: center;
gap: 10px;
padding: 10px 12px;
border-bottom: 1px solid #f5f5f5;
cursor: pointer;
transition: background 0.15s;
}
.rosoa-search-item:last-child { border-bottom: none; }
.rosoa-search-item:hover { background: #f9f9f9; }
.rosoa-search-item img {
width: 48px; height: 48px;
object-fit: contain;
border-radius: 4px;
background: #f5f5f5;
flex-shrink: 0;
}
.rosoa-search-item-info { flex: 1; min-width: 0; }
.rosoa-search-item-name {
font-size: 13px;
font-weight: 600;
color: #111;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-family: 'Assistant', 'Rubik', 'Heebo', sans-serif;
}
.rosoa-search-item-price {
font-size: 12px;
color: #666;
font-family: 'Assistant', 'Rubik', 'Heebo', sans-serif;
}
.rosoa-search-atc {
flex-shrink: 0;
padding: 6px 12px;
background: #111 !important;
color: #fff !important;
border: none !important;
border-radius: 5px !important;
font-size: 12px !important;
font-family: 'Assistant', 'Rubik', 'Heebo', sans-serif !important;
cursor: pointer;
white-space: nowrap;
transition: opacity 0.2s;
}
.rosoa-search-atc:hover { opacity: 0.85 !important; }
.rosoa-search-atc:disabled { opacity: 0.6 !important; pointer-events: none !important; }
.rosoa-search-empty {
padding: 20px;
text-align: center;
color: #999;
font-size: 13px;
font-family: 'Assistant', 'Rubik', 'Heebo', sans-serif;
} .rosos-wrap * { box-sizing: border-box; }
.rosos-wrap { direction: rtl; position: relative; font-family: 'Assistant','Rubik','Heebo',sans-serif; } .rosos-field {
position: relative;
display: flex;
align-items: center;
}
.rosos-icon {
position: absolute;
right: 12px;
pointer-events: none;
z-index: 1;
}
.rosos-input {
width: 100%;
padding: 11px 40px 11px 40px;
border: 1.5px solid #ddd !important;
border-radius: 8px !important;
font-size: 14px !important;
font-family: 'Assistant','Rubik','Heebo',sans-serif !important;
background: #fff !important;
color: #111 !important;
outline: none !important;
box-shadow: none !important;
direction: rtl;
transition: border-color 0.2s, box-shadow 0.2s;
-webkit-appearance: none;
}
.rosos-input:focus {
border-color: #111 !important;
box-shadow: 0 0 0 3px rgba(0,0,0,.06) !important;
}
.rosos-input::-webkit-search-cancel-button { display: none; }
.rosos-clear {
position: absolute;
left: 10px;
background: none !important;
border: none !important;
color: #aaa !important;
font-size: 14px !important;
cursor: pointer;
padding: 4px !important;
line-height: 1;
outline: none !important;
}
.rosos-clear:hover { color: #111 !important; } .rosos-results {
position: absolute;
top: calc(100% + 6px);
right: 0; left: 0;
background: #fff;
border: 1.5px solid #eee;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0,0,0,.12);
z-index: 9999;
overflow: hidden;
max-height: 420px;
overflow-y: auto;
direction: rtl;
} .rosos-item {
display: flex;
align-items: center;
gap: 12px;
padding: 10px 14px;
border-bottom: 1px solid #f5f5f5;
text-decoration: none;
color: inherit;
transition: background 0.15s;
}
.rosos-item:last-of-type { border-bottom: none; }
.rosos-item:hover { background: #f8f8f8; }
.rosos-item img {
width: 52px; height: 52px;
object-fit: contain;
border-radius: 6px;
background: #f5f5f5;
flex-shrink: 0;
padding: 4px;
}
.rosos-item-info { flex: 1; min-width: 0; }
.rosos-item-name {
font-size: 13px;
font-weight: 600;
color: #111;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-family: 'Assistant','Rubik','Heebo',sans-serif;
margin-bottom: 3px;
}
.rosos-item-price {
font-size: 12px;
color: #777;
font-family: 'Assistant','Rubik','Heebo',sans-serif;
}
.rosos-item-price .woocommerce-Price-amount { font-size: inherit; } .rosos-atc {
flex-shrink: 0;
padding: 7px 14px !important;
background: #111 !important;
color: #fff !important;
border: none !important;
border-radius: 6px !important;
font-size: 12px !important;
font-family: 'Assistant','Rubik','Heebo',sans-serif !important;
font-weight: 600 !important;
cursor: pointer;
white-space: nowrap;
transition: opacity 0.2s, transform 0.15s;
outline: none !important;
box-shadow: none !important;
text-decoration: none !important;
}
.rosos-atc:hover { opacity: 0.85 !important; transform: scale(1.03); }
.rosos-atc:disabled { opacity: 0.5 !important; pointer-events: none !important; } .rosos-view-all {
display: block;
text-align: center;
padding: 12px;
font-size: 13px;
font-weight: 600;
color: #111;
text-decoration: none;
border-top: 1px solid #f0f0f0;
background: #fafafa;
font-family: 'Assistant','Rubik','Heebo',sans-serif;
transition: background 0.15s;
}
.rosos-view-all:hover { background: #f0f0f0; } .rosos-loading,
.rosos-empty {
padding: 20px;
text-align: center;
color: #999;
font-size: 13px;
font-family: 'Assistant','Rubik','Heebo',sans-serif;
}
.rosos-loading { color: #aaa; } .rosoa-top-search {
position: relative;
margin-bottom: 20px;
direction: rtl;
}
.rosoa-top-search-field {
position: relative;
display: flex;
align-items: center;
}
.rosoa-top-search-field svg {
position: absolute;
left: 12px; pointer-events: none;
z-index: 1;
}
.rosoa-top-search-input {
width: 100%;
padding: 11px 16px 11px 42px; border: 1.5px solid #ddd !important;
border-radius: 8px !important;
font-size: 14px !important;
font-family: 'Assistant','Rubik','Heebo',sans-serif !important;
background: #fff !important;
color: #111 !important;
outline: none !important;
box-shadow: none !important;
direction: rtl;
transition: border-color 0.2s, box-shadow 0.2s;
-webkit-appearance: none;
}
.rosoa-top-search-input:focus {
border-color: #111 !important;
box-shadow: 0 0 0 3px rgba(0,0,0,.06) !important;
}
.rosoa-top-search-input::-webkit-search-cancel-button { display: none; }
.rosoa-top-search-clear {
position: absolute;
left: 40px;
background: none !important;
border: none !important;
color: #aaa !important;
font-size: 14px !important;
cursor: pointer;
padding: 4px !important;
outline: none !important;
}
.rosoa-top-search-clear:hover { color: #111 !important; }
.rosoa-top-search-results {
position: absolute;
top: calc(100% + 6px);
right: 0; left: 0;
background: #fff;
border: 1.5px solid #eee;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0,0,0,.12);
z-index: 9999;
overflow: hidden;
max-height: 420px;
overflow-y: auto;
direction: rtl;
} .roso-heart-btn {
position: absolute;
bottom: 10px;
left: 58px;
width: 38px;
height: 38px;
border-radius: 50%;
background: #fff;
border: 1px solid #ddd;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: #111;
transition: background 0.2s, border-color 0.2s, transform 0.15s;
z-index: 6;
padding: 0;
box-shadow: 0 1px 4px rgba(0,0,0,.08);
outline: none;
}
.roso-heart-btn:hover {
background: #e53935 !important;
background-color: #e53935 !important;
border-color: #e53935 !important;
transform: scale(1.1);
transform-origin: center center;
}
.roso-heart-btn:hover svg { stroke: #fff !important; fill: none !important; }
.roso-heart-btn.active {
background: #e53935;
border-color: #e53935;
}
.roso-heart-btn.active svg { fill: #fff; stroke: #fff; } .rosoa-card .rosoa-img-wrap .rosoa-cart-btn,
.rosoa-card .rosoa-img-outer .rosoa-cart-btn,
button.rosoa-cart-btn {
position: absolute !important;
bottom: 10px !important;
left: 10px !important;
width: 38px !important;
height: 38px !important;
min-width: 0 !important;
min-height: 0 !important;
border-radius: 50% !important;
background: #fff !important;
background-color: #fff !important;
border: 1px solid #ddd !important;
padding: 0 !important;
margin: 0 !important;
box-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 0 !important;
text-indent: -9999px !important;
color: transparent !important;
outline: none !important;
}
.rosoa-card .rosoa-img-wrap .roso-heart-btn,
.rosoa-card .rosoa-img-outer .roso-heart-btn,
button.roso-heart-btn {
position: absolute !important;
bottom: 10px !important;
left: 56px !important;
width: 38px !important;
height: 38px !important;
min-width: 0 !important;
min-height: 0 !important;
border-radius: 50% !important;
background: #fff !important;
background-color: #fff !important;
border: 1px solid #ddd !important;
padding: 0 !important;
margin: 0 !important;
box-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
outline: none !important;
color: #111 !important;
}
.rosoa-card .rosoa-img-outer .rosoa-cart-btn svg,
.rosoa-card .rosoa-img-outer .roso-heart-btn svg {
display: block !important;
flex-shrink: 0 !important;
}  .woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
position: relative;
} .woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce ul.products li.product .added_to_cart,
.woocommerce-page ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product a.add_to_cart_button {
display: none !important;
} .woocommerce ul.products li.product .roso-woo-cart-btn {
position: absolute;
bottom: 76px;
left: 10px;
width: 38px;
height: 38px;
border-radius: 50%;
background: #fff;
border: 1px solid #ddd;
cursor: pointer;
display: flex !important;
align-items: center;
justify-content: center;
transition: background 0.2s, border-color 0.2s;
z-index: 5;
padding: 0;
box-shadow: 0 1px 4px rgba(0,0,0,.08);
outline: none;
}
.woocommerce ul.products li.product .roso-woo-cart-btn:hover {
background: #111;
border-color: #111;
}
.woocommerce ul.products li.product .roso-woo-cart-btn:hover svg { stroke: #fff; } .rosoa-card.rosoa-out-of-stock .rosoa-img-wrap img {
opacity: 0.55;
filter: grayscale(0.3);
}
.rosoa-card.rosoa-out-of-stock .rosoa-name,
.rosoa-card.rosoa-out-of-stock .rosoa-price-current {
opacity: 0.7;
}
.rosoa-oos-badge {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(17,17,17,0.82);
color: #fff;
font-size: 13px;
font-weight: 700;
padding: 8px 18px;
border-radius: 6px;
letter-spacing: 0.03em;
white-space: nowrap;
cursor: pointer;
z-index: 3;
font-family: 'Discovery', 'Assistant', sans-serif;
}
.rosoa-card-oos-btn {
flex: 1;
height: 42px;
padding: 0 10px;
border: 1.5px solid #ddd !important;
border-radius: 8px !important;
background: #f5f5f5 !important;
color: #888 !important;
font-size: 14px !important;
font-weight: 700 !important;
font-family: 'Discovery', 'Assistant', sans-serif;
cursor: pointer;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.18s, border-color 0.18s;
}
.rosoa-card-oos-btn:hover {
background: #ececec !important;
border-color: #ccc !important;
} .rosoa-oos-overlay {
position: fixed;
inset: 0;
background: rgba(0,0,0,.45);
z-index: 9100;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s;
}
.rosoa-oos-overlay.open { opacity: 1; pointer-events: all; }
.rosoa-oos-popup {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.94);
width: min(380px, 92vw);
background: #fff;
z-index: 9101;
border-radius: 14px;
padding: 32px 28px 24px;
box-shadow: 0 12px 48px rgba(0,0,0,.22);
direction: rtl;
text-align: center;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s, transform 0.3s cubic-bezier(.34,1.56,.64,1);
font-family: 'Discovery', 'Assistant', sans-serif;
}
.rosoa-oos-popup.open {
opacity: 1;
pointer-events: all;
transform: translate(-50%, -50%) scale(1);
}
.rosoa-oos-close {
position: absolute;
top: 12px;
left: 12px;
width: 30px; height: 30px;
border: none !important;
background: none !important;
font-size: 16px;
color: #999 !important;
cursor: pointer;
border-radius: 50%;
transition: background 0.15s, color 0.15s;
}
.rosoa-oos-close:hover { background: #f5f5f5 !important; color: #111 !important; }
.rosoa-oos-icon {
margin-bottom: 14px;
display: flex;
justify-content: center;
}
.rosoa-oos-title {
font-size: 19px;
font-weight: 700;
color: #111;
margin-bottom: 8px;
}
.rosoa-oos-text {
font-size: 14px;
color: #666;
line-height: 1.5;
margin-bottom: 22px;
}
.rosoa-oos-wishlist-btn {
width: 100%;
height: 46px;
background: #e53935 !important;
color: #fff !important;
border: none !important;
border-radius: 8px !important;
font-size: 15px !important;
font-weight: 700 !important;
font-family: 'Discovery', 'Assistant', sans-serif;
cursor: pointer;
transition: opacity 0.18s, background 0.18s;
margin-bottom: 10px;
}
.rosoa-oos-wishlist-btn:hover { opacity: 0.88; }
.rosoa-oos-wishlist-btn.added { background: #27ae60 !important; }
.rosoa-oos-contact-btn {
display: block;
width: 100%;
height: 46px;
line-height: 46px;
background: #001C47 !important;
color: #fff !important;
border: 1.5px solid #001C47 !important;
border-radius: 8px !important;
font-size: 15px !important;
font-weight: 700 !important;
font-family: 'Discovery', 'Assistant', sans-serif;
cursor: pointer;
text-align: center;
text-decoration: none;
box-sizing: border-box;
transition: opacity 0.18s;
margin-bottom: 10px;
}
.rosoa-oos-contact-btn:hover { opacity: 0.88; }
.rosoa-oos-qty-wrap button {
color: #111 !important;
border-color: #111 !important;
font-weight: 700;
}
.rosoa-oos-cancel {
width: 100%;
height: 40px;
background: none !important;
color: #999 !important;
border: none !important;
font-size: 13px !important;
font-family: 'Discovery', 'Assistant', sans-serif;
cursor: pointer;
text-decoration: underline;
}
.rosoa-oos-cancel:hover { color: #555 !important; } .rosoa-price-oos {
font-size: 15px;
font-weight: 700;
color: #e53935;
letter-spacing: 0.02em;
} .rosoa-quote-badge {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #e53935;
color: #fff;
font-size: 13px;
font-weight: 700;
padding: 8px 18px;
border-radius: 6px;
letter-spacing: 0.03em;
white-space: nowrap;
cursor: pointer;
z-index: 3;
text-decoration: none;
transition: background 0.18s;
}
.rosoa-quote-badge:hover { background: #c62828; }
.rosoa-card-quote-btn {
flex: 1;
height: 42px;
padding: 0 10px;
border: none;
border-radius: 8px;
background: #e53935;
color: #fff;
font-size: 14px;
font-weight: 700;
cursor: pointer;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
transition: opacity 0.18s, transform 0.12s;
}
.rosoa-card-quote-btn:hover { opacity: 0.88; transform: translateY(-1px); }
.rosoa-card-quote-wrap {
display: flex;
flex-direction: column;
gap: 6px;
width: 100%;
}
.rosoa-card-qty-wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}
.rosoa-card-qty-minus,
.rosoa-card-qty-plus {
width: 28px;
height: 28px;
border: 1.5px solid #111;
border-radius: 6px;
background: #fff;
color: #111;
font-weight: 700;
font-size: 15px;
line-height: 1;
cursor: pointer;
}
.rosoa-card-qty-minus:hover,
.rosoa-card-qty-plus:hover { background: #f5f5f5; }
.rosoa-card-qty-val {
min-width: 20px;
text-align: center;
font-weight: 700;
font-size: 14px;
color: #111;
}
.rosoa-price-quote {
font-size: 15px;
font-weight: 700;
color: #e53935;
letter-spacing: 0.02em;
} .rosoa-card.rosoa-quote { opacity: 1; }