main {padding:2rem;}
input[type="search"]:focus,input[type="text"]:focus {outline:none;border:2px solid #005bac;box-shadow:none;}
.title {font-size:29px;font-weight:bold;margin-bottom:1rem;color:#124675;}
.grid {display:grid;gap:1rem;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));}
.title-image {display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#005cac00;}
.title-image a {text-decoration:none;text-align:center;}
.pagination {margin-top:2rem;display:flex;justify-content:flex-end;gap:0.5rem;flex-wrap:wrap;list-style:none;padding:0;}
.pagination li {display:contents;}
.pagination li a {display:inline-block;padding:0.5rem 0.75rem;border:1px solid #005bac;background-color:white;color:#005bac;border-radius:4px;cursor:pointer;text-decoration:none;}
.pagination li a:hover {background-color:#005bac;color:white;}
@media (max-width:1100px) {
	.grid {grid-template-columns:1fr;}
	.search-producto {justify-content:center;}
	.popup-body {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;}
}
.ver-mas-btn {width:200px;height:48px;margin-top:1rem;padding:0.5rem 1rem;border:1px solid#124675;background-color:white;color:#124675;font-weight:bold;border-color:#124675;}
.ver-mas-btn:hover {background-color:#005bac;color:#ffffff;}
.hamburger {font-size:20px;}
@media (min-width:768px) {.popup-table {width:600px;}}
@media (min-width:1024px) {.popup-table {width:800px;}}
@media (min-width:1400px) {.popup-table {width:800px;}}
.aksi-filter-layout {display:flex;gap:1rem;}
.aksi-filter {background:#fff;border-right:1px solid #eee;width:280px;flex-shrink:0;padding:1rem;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;z-index:200;position:fixed;top:150px;right:0;left:0;z-index:999;padding:2rem;}
.aksi-filter__inner {display:flex;flex-direction:column;height:100%;}
.aksi-filter__head {display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;position:sticky;top:0;background:#fff;z-index:10;padding-bottom:0.5rem;border-bottom:1px solid #eee;}
.aksi-filter__title {font-size:1.2rem;font-weight:bold;color:#124675;}
.aksi-filter__close {background:none;border:none;font-size:1.5rem;cursor:pointer;display:none;}
.aksi-filter__body {overflow-y:auto;padding-right:0.5rem;flex:1;}
.aksi-filter__group {margin-bottom:2rem;}
.aksi-filter__group-title {font-size:1rem;font-weight:bold;margin-bottom:.5rem;border-bottom:2px solid #000;display:inline-block;}
.aksi-filter__options {list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem;}
.aksi-filter__options label {cursor:pointer;font-size:.9rem;}
.aksi-filter__price-range {margin:.5rem 0;}
.aksi-filter__btn {width:60%;border:1px solid #005bac;background-color:white;color:#005bac;border-radius:4px;cursor:pointer;text-decoration:none;}
.aksi-filter__btn:hover {background:#124675;color:#fff;border-color:#124675;}
.aksi-filter__fab {position:fixed;bottom:20px;left:20px;width:55px;height:55px;border-radius:50%;background:#124675;color:#fff;border:none;font-size:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 6px rgba(0,0,0,0.2);z-index:300;}
.range-slider {position:relative;width:100%;height:6px;margin:1rem 0;}
.range-slider input[type=range] {position:absolute;width:100%;pointer-events:none;--webkit-appearance:none;background:none;}
.range-slider input[type=range]::-webkit-slider-thumb {pointer-events:all;width:16px;height:16px;border-radius:50%;background:#124675;border:2px solid #000;cursor:pointer;-webkit-appearance:none;}
.range-slider .range-track,.range-slider .range-range {position:absolute;height:6px;border-radius:3px;}
.range-slider .range-track {width:100%;background:#eee;top:0;}
.range-slider .range-range {background:#124675;top:0;}
@media(min-width:992px) {
.aksi-filter-layout {display:flex;}
.aksi-filter {position:sticky;transform:none !important;}
.aksi-filter__close {display:none;}
.aksi-filter__fab {display:none;}
}
@media(max-width:991px) {
.aksi-filter-layout {display:block;}
.aksi-filter {position:fixed;top:0;left:0;height:100%;max-width:300px;transform:translateX(-100%);box-shadow:2px 0 6px rgba(0,0,0,0.3);}
.aksi-filter.active {transform:translateX(0);}
.aksi-filter__close {display:block;}
}
.filtro-overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:998;display:none;}
.burbuja-abierta + .filtro-overlay {display:block;}
.filtro-overlay {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:99;}
.filtro-burbuja.burbuja-abierta {z-index:100;}
.range-range {position:absolute;height:4px;background:#f00;top:50%;transform:translateY(-50%);border-radius:2px;}
input[type="range"]::-webkit-slider-thumb {-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #f00;margin-top:-6px;cursor:pointer;position:relative;z-index:2;}
input[type="range"]::-moz-range-thumb {width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #f00;cursor:pointer;position:relative;z-index:2;}
input[type="range"]::-webkit-slider-runnable-track {height:4px;background:#ccc;border-radius:2px;}
input[type="range"]::-moz-range-track {height:4px;background:#ccc;border-radius:2px;}
#aksi-price-label {font-size:15px;}

.toolbar-top {display:flex;justify-content:space-between;align-items:center;gap:0.5rem;flex-wrap:wrap;}
.toolbar-bottom {display:flex;justify-content:space-between;align-items:center;gap:0.5rem;flex-wrap:wrap;}
.order-link {color:#333;text-decoration:underline;}
.search-input {padding:0.4rem 0.6rem;border:1px solid #ccc;border-radius:4px;min-width:150px;}
.pagination {display:flex;gap:0.3rem;flex-wrap:wrap;flex-direction:row;}
.pagination .active a {background:#124675 !important;color:white !important;font-weight:bold !important;}
.page-btn {background-color:white;color:#1d3f72;border:1px solid #1d3f72;padding:0.3rem 0.6rem;border-radius:3px;cursor:pointer;}
@media (max-width:765px) {
	.toolbar-top a {padding-bottom:20px;}
	.toolbar-top,.toolbar-bottom {flex-direction:column;align-items:stretch;}
	.pagination {justify-content:flex-start;}
}
.scroll-table {max-height:300px;overflow-y:scroll;overflow-x:hidden;border:1px solid #ccc;padding-right:10px;}
.loader {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border:4px solid #f3f3f3;border-top:4px solid #555;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite;}
.box img {display:block;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 0.5s ease;}
.loaded img {opacity:1;}
.loader {display:none;}
@keyframes spin {0% { transform:translate(-50%, -50%) rotate(0deg);}100% { transform:translate(-50%, -50%) rotate(360deg);}}
.no-products-container {display:flex;justify-content:center;align-items:center;height:250px;background-color:#f9f9f9;border-radius:10px;text-align:center;}
.no-products-message {max-width:400px;padding:20px;}
.no-products-icon {width:80px;margin-bottom:20px;opacity:0.7;}
.no-products-message p {font-size:1.2rem;color:#2b2b2b;margin-bottom:20px;}
.btn-regresar {display:inline-block;padding:10px 20px;background-color:#1b3c6b;color:#fff;border-radius:6px;text-decoration:none;font-weight:bold;transition:background-color 0.3s;}
.btn-regresar:hover {background-color:#0f2a4c;}
main {width:100%;padding:1rem;}
.aksi-filter__wrapper {max-height:250px;overflow-y:auto;padding-right:5px;margin-bottom:25px;}
.aksi-filter__scroll {display:flex;flex-direction:column;gap:1rem;}
.aksi-filter__group {border-bottom:1px solid #ddd;padding-bottom:10px;}
.aksi-filter-overlay {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:99;}
#aksi-filter.active {z-index:100;}
.box {width:100%;overflow:hidden;border-radius:1rem;position:relative;background-color:#ffffff;aspect-ratio:1 / 1;border-radius:8px;cursor:pointer;}
.box .control-image {width:100%;height:100%;object-fit:contain;object-position:center center;display:block;}
.title-products {display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;width:200px;font-weight:400;line-height:1.5em;word-break:break-word;min-height:calc(1.5em * 4);}
.contenedor-filtro {display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;background-color:white;padding-bottom:50px;}
.titulo-categoria {display:flex;align-items:flex-start;background-color:white;}
.opcion-filtro {display:flex;}

.filtro-orden-wrapper {position:relative;display:inline-block;width:100%;max-width:300px;}
.filtro-orden-select {appearance:none;width:100%;padding:1rem 1rem 1rem 1rem;font-size:1rem;border:1px solid #d1d5db;border-radius:1rem;background-color:#fff;color:#374151;box-shadow:0 2px 6px rgba(0, 0, 0, 0.08);transition:all 0.2s ease-in-out;}
.filtro-orden-wrapper .filtro-icon {position:absolute;right:1rem;top:50%;transform:translateY(-50%);pointer-events:none;font-size:1.2rem;color:#374151;display:none;}

@media (max-width:883px) {
.filtro-orden-wrapper .filtro-icon {display:inline-block;}
.filtro-orden-select {padding-right:2.5rem;}
}

@media (min-width:884px) {
.filtro-orden-wrapper .filtro-icon {display:none;}
.filtro-orden-select {padding-right:1rem;}
}

.aksi-filter__group {margin-bottom:10px;}
.aksi-filter__parent-title {display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:15px;font-weight:600;padding:10px;background:#f5f5f5;border-radius:6px;user-select:none;transition:background 0.3s ease;}
.aksi-filter__parent-title:hover {background:#e8e8e8;}
.toggle-icon {display:inline-block;transition:transform 0.4s cubic-bezier(0.68,-0.55,0.27,1.55);color:#124675;}
.aksi-filter__group.open .toggle-icon {transform:rotate(180deg);}
.aksi-filter__subgroup {max-height:0;opacity:0;overflow:hidden;transform:scaleY(0.9);transform-origin:top;transition:max-height 0.5s ease,opacity 0.4s ease,transform 0.4s ease,padding 0.3s ease;padding:0;}
.aksi-filter__group.open .aksi-filter__subgroup {max-height:500px;opacity:1;transform:scaleY(1);padding:10px 0;}
.producto-loading {text-align:center;padding:20px;font-size:14px;color:#555;display:none;}

.categoria-dropdown {position:relative;display:inline-block;}
.categoria-btn {border:1px solid #005bac;background-color:white;color:#005bac;padding:10px 16px;font-size:16px;border-radius:4px;cursor:pointer;text-decoration:none;}
.categoria-btn:hover {background-color:#005bac;color:white;}
.categoria-menu {display:none;position:absolute;top:100%;left:0;background-color:#fff;min-width:240px;box-shadow:0px 8px 16px rgba(0,0,0,0.2);border-radius:4px;z-index:9999;border:1px solid #ddd;}
.categoria-menu a {color:#333;padding:10px 14px;text-decoration:none;display:block;border-bottom:1px solid #eee;}
.categoria-menu a:hover {background-color:#005bac;color:#fff;}
.categoria-menu.categoria-show {display:block;}

.orden-dropdown {position:relative;display:inline-block;}
.orden-btn {border:1px solid #005bac;background-color:white;color:#005bac;padding:10px 16px;font-size:16px;border-radius:4px;cursor:pointer;text-decoration:none;}
.orden-btn:hover {background-color:#005bac;color:white;}
.orden-menu {display:none;position:absolute;top:100%;left:auto;right:0;background-color:#fff;min-width:240px;box-shadow:0px 8px 16px rgba(0,0,0,0.2);border-radius:4px;z-index:9999;border:1px solid #ddd;}
.orden-menu a {color:#333;padding:10px 14px;text-decoration:none;display:block;border-bottom:1px solid #eee;}
.orden-menu a:hover {background-color:#005bac;color:#fff;}
.orden-menu.orden-show {display:block;}

.filtro-btn {border:1px solid #005bac;background-color:white;color:#005bac;padding:1rem 2.5rem 1rem 1rem;font-size:1rem;border-radius:1rem;cursor:pointer;text-decoration:none;box-shadow:0 2px 6px rgba(0, 0, 0, 0.08);transition:all 0.2s ease-in-out;}
.filtro-btn:hover {background-color:#005bac;color:white;}
.filtro-orden-arrow {color:#005bac;transition:color 0.2s ease-in-out;}
.filtro-orden-select:hover + .filtro-orden-arrow {color:white;}