.wf-catgrid-wrapper{position:relative;width:100%;}
.wf-catgrid{
 display:grid;
 gap:12px;
 padding:10px 0;
 grid-template-columns:repeat(var(--wf-cols-d,3),1fr);
}
.wf-catgrid-card{
 position:relative;
 overflow:hidden;
 border-radius:12px;
 cursor:pointer;
 aspect-ratio:1 / 1;
 background:#111;
 outline:none;
 transition:transform 0.3s ease,box-shadow 0.3s ease;
}
.wf-catgrid-card:hover,
.wf-catgrid-card:focus-visible{
 transform:scale(1.03);
 box-shadow:0 8px 30px rgba(0,0,0,0.5);
}
.wf-catgrid-card:focus-visible{outline:2px solid #c9a84c;outline-offset:2px;}
.wf-catgrid-card-media{position:absolute;inset:0;overflow:hidden;}
.wf-catgrid-card-media video,
.wf-catgrid-card-media img{
 width:100%;height:100%;object-fit:cover;display:block;transform-origin:center center;
}
.wf-catgrid-card-overlay{
 position:absolute;inset:0;
 display:flex;align-items:center;justify-content:center;
 background:linear-gradient(0deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.35) 100%);
 z-index:2;padding:15px;transition:background 0.3s ease;
}
.wf-catgrid-card:hover .wf-catgrid-card-overlay{
 background:linear-gradient(0deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.1) 40%,rgba(0,0,0,.25) 100%);
}
.wf-catgrid-card-title{
 color:#fff;font-size:clamp(14px,2.5vw,24px);font-weight:700;
 text-align:center;text-shadow:0 2px 8px rgba(0,0,0,.7);
 margin:0;line-height:1.3;letter-spacing:0.02em;
}
.wf-catgrid-overlay{
 position:fixed;
 top:0;left:0;width:100%;height:100%;
 z-index:99999;
 background:#1a1a1a;
 display:flex;
 flex-direction:column;
 transform:translateX(-100%);
 opacity:0;visibility:hidden;pointer-events:none;
 transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),opacity 0.4s cubic-bezier(0.4,0,0.2,1),visibility 0s 0.4s;
}
.wf-catgrid-overlay--abierto{
 transform:translateX(0);
 opacity:1;visibility:visible;pointer-events:auto;
 transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),opacity 0.4s cubic-bezier(0.4,0,0.2,1),visibility 0s 0s;
}
.wf-catgrid-overlay--cerrando{
 transform:translateX(100%);
 opacity:0;visibility:visible;pointer-events:none;
 transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),opacity 0.35s cubic-bezier(0.4,0,0.2,1),visibility 0s 0.45s;
}
.wf-catgrid-close{
 position:absolute;
 top:3px;right:12px;
 z-index:100;
 background:rgba(0,0,0,0.8);color:#fff;
 border:2px solid #fff;border-radius:50%;
 width:44px;height:44px;font-size:26px;
 cursor:pointer;
 display:flex;align-items:center;justify-content:center;
 padding:0;margin:0;
 transition:all 0.2s ease;
 box-shadow:0 2px 10px rgba(0,0,0,0.4);
 outline:none;line-height:1;
 font-family:Arial,sans-serif;
 -webkit-tap-highlight-color:transparent;
 user-select:none;
}
.wf-catgrid-close:hover{background:rgba(255,255,255,0.2);transform:scale(1.05);}
.wf-catgrid-close:active{transform:scale(1.1);}
.wf-catgrid-close:focus{box-shadow:0 0 0 3px rgba(255,255,255,0.3),0 2px 10px rgba(0,0,0,0.4);}
.wf-catgrid-sticky-bar{
 flex-shrink:0;
 background:#1a1a1a;
 padding:10px 64px 8px 14px;
 border-bottom:1px solid rgba(255,255,255,0.1);
 z-index:10;
}
.wf-catgrid-filters{
 display:flex;gap:8px;
 overflow-x:auto;
 -webkit-overflow-scrolling:touch;
 scrollbar-width:none;
 scroll-behavior:smooth;
 mask-image:linear-gradient(90deg,transparent 0%,#000 2%,#000 98%,transparent 100%);
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 2%,#000 98%,transparent 100%);
 padding:2px 0;
}
.wf-catgrid-filters::-webkit-scrollbar{display:none;}
.wf-catgrid-filter-btn{
 display:inline-flex;align-items:center;
 padding:7px 18px;border-radius:22px;
 border:1px solid rgba(255,255,255,0.3);
 background:rgba(255,255,255,0.08);
 color:#ddd;font-size:13px;font-weight:500;
 cursor:pointer;white-space:nowrap;flex-shrink:0;
 transition:all 0.3s ease;
}
.wf-catgrid-filter-btn:hover{
 background:rgba(255,255,255,0.15);color:#fff;
}
.wf-catgrid-filter-btn.current{
 background:rgba(65,116,72,0.25);
 border-color:rgba(65,116,72,0.5);
 color:#b8d8bc;
 font-weight:600;
}
.wf-catgrid-filter-btn.active{
 background:rgb(65,116,72);
 color:#fff;
 border-color:rgb(65,116,72);
 font-weight:600;
 box-shadow:0 2px 8px rgba(65,116,72,0.4);
}
.wf-catgrid-overlay-scroll{
 flex:1;
 overflow-y:auto;
 overflow-x:hidden;
 -webkit-overflow-scrolling:touch;
}
.wf-group-separator{
 display:flex;
 align-items:center;
 gap:12px;
 padding:14px 4px 8px;
}
.wf-group-separator{
 grid-column:1 / -1;
}
.wf-group-separator-text{
 color:rgba(255,255,255,0.5);
 font-size:13px;
 font-weight:600;
 text-transform:uppercase;
 letter-spacing:0.08em;
 white-space:nowrap;
}
.wf-group-separator::after{
 content:'';
 flex:1;
 height:1px;
 background:rgba(255,255,255,0.1);
}
.wf-catgrid-overlay-items{
 display:flex;
 flex-direction:column;
 gap:12px;
 padding:12px 14px 100px;
}
.wf-catgrid-overlay-items article.dp-dfg-item{
 background:#00303b;
 border-radius:10px;
 overflow:hidden;
 border:1px solid rgba(255,255,255,0.1);
 transition:opacity 0.25s ease;
}
.wf-list-top{
 display:flex;
 gap:0;
 min-height:200px;
}
.wf-list-media{
 flex-shrink:0;
 width:150px;
 height:200px;
 margin:.2em;
 overflow:hidden;
 background:#000;
 border-radius:10px;
}
.wf-list-media img,
.wf-list-media video{
 width:100% !important;
 height:100% !important;
 object-fit:cover !important;
 display:block !important;
}
.wf-list-info{
 flex:1;
 min-width:0;
 display:flex;
 flex-direction:column;
 justify-content:flex-start;
 padding:10px 5px;
}
.wf-list-info .dp-dfg-header{
 padding:0 !important;
}
body .wf-list-info .dp-dfg-header h4{
 padding:0 !important;
 font-size:20px !important;
}
body .wf-list-info .dp-dfg-header p span{
 font-size:16px !important;
 line-height:1.2 !important;
}
.wf-list-info .entry-title{
 font-size:15px;
 line-height:1.3;
 margin:0 0 6px;
 color:#fff;
 font-weight:700;
}
.wf-list-info .dp-dfg-cf-descripcion_del_plato{
 margin-bottom:6px !important;
}
.wf-list-info .dp-dfg-cf-descripcion_del_plato .dp-dfg-custom-field-value{
 font-size:16px !important;
 line-height:1.2 !important;
 color:rgba(255,255,255,0.7);
}
.wf-list-info .alergenos-toggle-btn{
 font-size:12px !important;
 padding:3px 10px !important;
 margin-left:0 !important;
}
.wf-list-bottom{
 padding:10px !important;
}
.wf-list-bottom .opciones-precio{
 display:grid !important;
 grid-template-columns:1fr 1fr;
 gap:6px;
 margin-bottom:8px !important;
}
body .wf-list-bottom .opcion-precio{
 margin:0 !important;
 width:100%;
 max-width:100%;
}
.wf-list-bottom .opcion-precio label{
 font-size:13px;
}
.wf-list-bottom .btn-agregar-pedido{
 width:100%;
 text-align:center;
 box-sizing:border-box;
}
.wf-list-bottom .categoria-descripcion{
 margin-bottom:6px;
}
.wf-list-bottom .categoria-descripcion p{
 font-size:12px;
 color:rgba(255,255,255,0.6);
 margin:0;
 line-height:1.4;
}
.wf-list-bottom .wf-contenedor-video-oculto{
 display:none !important;
}
.wf-catgrid-overlay--abierto .dp-dfg-item{
 animation:wf-listIn 0.3s ease both;
}
@keyframes wf-listIn{
 from{opacity:0;transform:translateX(-15px);}
 to{opacity:1;transform:translateX(0);}
}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(1){animation-delay:0.08s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(2){animation-delay:0.11s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(3){animation-delay:0.14s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(4){animation-delay:0.17s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(5){animation-delay:0.20s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(6){animation-delay:0.23s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(7){animation-delay:0.26s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(8){animation-delay:0.29s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(9){animation-delay:0.32s;}
.wf-catgrid-overlay--abierto .dp-dfg-item:nth-child(10){animation-delay:0.35s;}
.wf-catgrid-overlay--abierto .wf-group-separator{
 animation:wf-sepIn 0.3s ease both;
}
@keyframes wf-sepIn{
 from{opacity:0;}
 to{opacity:1;}
}
.wf-alerg-modal{
 position:fixed;
 top:0;left:0;width:100%;height:100%;
 z-index:9999990;
 display:flex;
 align-items:center;justify-content:center;
 opacity:0;visibility:hidden;pointer-events:none;
 transition:opacity 0.25s ease,visibility 0s 0.25s;
}
.wf-alerg-modal--visible{
 opacity:1;visibility:visible;pointer-events:auto;
 transition:opacity 0.25s ease,visibility 0s 0s;
}
.wf-alerg-modal-bg{
 position:absolute;inset:0;
 background:rgba(0,0,0,0.7);
 -webkit-backdrop-filter:blur(4px);
 backdrop-filter:blur(4px);
}
.wf-alerg-modal-box{
 position:relative;
 background:#00303b;
 border:1px solid rgba(255,255,255,0.15);
 border-radius:14px;
 padding:20px;
 max-width:360px;
 width:90%;
 max-height:80vh;
 overflow-y:auto;
 z-index:2;
 box-shadow:0 10px 40px rgba(0,0,0,0.5);
}
.alergenos-p{
 font-size:16px;
 line-height:1.2;
 margin:0 0 1em 0;
}
.wf-alerg-modal-close{
 position:absolute;top:10px;right:12px;
 background:transparent;color:#aaa;border:none;
 font-size:24px;cursor:pointer;line-height:1;
 padding:4px;transition:color 0.2s;
}
.wf-alerg-modal-close:hover{color:#fff;}
.wf-alerg-modal-title{
 color:#fff;font-size:16px;font-weight:700;
 margin:0 0 14px;text-align:center;
}
.wf-alerg-modal-body{
 display:flex;
 flex-wrap:wrap;
 gap:12px;
 justify-content:center;
 background:#00303b;
}
.wf-alerg-modal-body .wf-alerg-img{
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:4px;
 width:60px;
}
.wf-alerg-modal-body .wf-alerg-img img{
 width:40px;height:40px;object-fit:contain;
 border-radius:50%;background:rgba(255,255,255,0.1);
 padding:4px;
}
.wf-alerg-modal-body .wf-alerg-label{
 font-size:10px;color:rgba(255,255,255,0.8);
 text-align:center;line-height:1.2;
}
@media (min-width:1024px){
 .wf-catgrid{grid-template-columns:repeat(var(--wf-cols-d,3),1fr);}
 .wf-catgrid-overlay-items{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:14px;
 padding:14px 20px 100px;
}
 .wf-group-separator{grid-column:1 / -1;}
}
@media (min-width:601px) and (max-width:1023px){
 .wf-catgrid{grid-template-columns:repeat(var(--wf-cols-t,2),1fr);}
}
@media (max-width:600px){
 .wf-catgrid{
 grid-template-columns:repeat(var(--wf-cols-m,1),1fr);
 gap:10px;
}
 .wf-catgrid-card-title{font-size:18px;}
 .wf-catgrid-close{top:3px;right:8px;width:38px;height:38px;font-size:22px;}
 .wf-catgrid-sticky-bar{padding:8px 52px 6px 10px;}
 .wf-catgrid-filter-btn{padding:6px 14px;font-size:12px;}
 .wf-list-top{min-height:170px;}
 .wf-list-info{padding:8px 5px;}
 .wf-list-info .entry-title{font-size:14px;}
 .wf-list-info .dp-dfg-custom-field-value{font-size:11px !important;}
 .wf-catgrid-overlay-items{padding:10px 10px 100px;gap:10px;}
 .wf-list-bottom .opciones-precio{
 grid-template-columns:1fr 1fr;
 gap:4px;
}
 .wf-group-separator{padding:12px 2px 6px;}
 .wf-group-separator-text{font-size:12px;}
}
@media (prefers-reduced-motion:reduce){
 .wf-catgrid-overlay{
 transition:opacity 0.15s ease,visibility 0s !important;
 transform:none !important;
}
 .wf-catgrid-overlay--abierto,
 .wf-catgrid-overlay--cerrando{transform:none !important;}
 .wf-catgrid-card{transition:none !important;}
 .wf-catgrid-img{animation:none !important;}
 .wf-catgrid-overlay--abierto .dp-dfg-item{animation:none !important;}
 .wf-catgrid-overlay--abierto .wf-group-separator{animation:none !important;}
}