/* PedidosClick · Estudio de plantillas */
.sf-studio-intro{background:linear-gradient(135deg,#111111,#242424 66%,#6F2B08);color:#fff;border-radius:24px;padding:22px;margin-bottom:18px;display:flex;justify-content:space-between;gap:18px;align-items:center;box-shadow:0 14px 36px rgba(11,31,58,.15)}
.sf-studio-intro h2{margin:0 0 6px}.sf-studio-intro p{margin:0;color:#E7D7CA;line-height:1.55}.sf-pillar-badge{background:#fff;color:#181818;padding:9px 12px;border-radius:999px;font-weight:900;white-space:nowrap}
.sf-template-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}
.sf-template-card{border:2px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;cursor:pointer;transition:.18s;position:relative;box-shadow:0 7px 22px rgba(23,29,45,.04)}
.sf-template-card:hover{transform:translateY(-2px);border-color:#E8B58E}.sf-template-card.selected{border-color:var(--p);box-shadow:0 0 0 4px rgba(245,107,22,.12),0 12px 30px rgba(23,29,45,.08)}
.sf-template-card.selected:after{content:"✓ Seleccionada";position:absolute;top:10px;right:10px;background:var(--p);color:#fff;border-radius:999px;padding:6px 9px;font-size:.7rem;font-weight:900}
.sf-template-visual{height:150px;background:#f2f5f8;position:relative;overflow:hidden;padding:12px}
.sf-template-visual .vtop{height:16px;border-radius:7px;background:#18283c;margin-bottom:9px;width:100%}.sf-template-visual .vhero{height:55px;border-radius:10px;background:linear-gradient(135deg,#d7e4ef,#8099ae);margin-bottom:8px;position:relative}.sf-template-visual .vhero:after{content:"";position:absolute;left:8px;top:12px;width:52%;height:8px;border-radius:4px;background:#fff;box-shadow:0 14px 0 #ffffffb8}.sf-template-visual .vchips{display:flex;gap:5px;margin-bottom:7px}.sf-template-visual .vchips i{height:9px;width:42px;border-radius:999px;background:#cfd8e2}.sf-template-visual .vproducts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.sf-template-visual .vproducts i{height:34px;border-radius:7px;background:#fff;border:1px solid #dfe6ee}
.sf-template-card[data-id*="fastfood"] .vhero,.sf-template-card[data-id*="express"] .vhero,.sf-template-card[data-id*="outlet"] .vhero{background:linear-gradient(135deg,#f59e0b,#ef4444)}
.sf-template-card[data-id*="dark"] .sf-template-visual{background:#11151b}.sf-template-card[data-id*="dark"] .vtop{background:#030507}.sf-template-card[data-id*="dark"] .vproducts i{background:#202631;border-color:#303948}
.sf-template-card[data-id*="coffee"] .vhero,.sf-template-card[data-id*="boutique"] .vhero,.sf-template-card[data-id*="beauty"] .vhero{border-radius:26px;background:linear-gradient(135deg,#f1dfcf,#c28c78)}
.sf-template-card[data-id*="fresh"] .vhero,.sf-template-card[data-id*="super"] .vhero{background:linear-gradient(135deg,#bfe9ce,#4ca66c)}
.sf-template-card[data-id*="pharmacy"] .vhero,.sf-template-card[data-id*="tech"] .vhero{background:linear-gradient(135deg,#dbeafe,#60a5fa)}
.sf-template-card[data-id*="fashion"] .vhero,.sf-template-card[data-id*="showroom"] .vhero{height:82px;border-radius:0;background:linear-gradient(135deg,#dadada,#7c7c7c)}
.sf-template-card[data-id*="carta"] .vproducts,.sf-template-card[data-id*="qr"] .vproducts,.sf-template-card[data-id*="abarrotes"] .vproducts{grid-template-columns:1fr}.sf-template-card[data-id*="carta"] .vproducts i,.sf-template-card[data-id*="qr"] .vproducts i,.sf-template-card[data-id*="abarrotes"] .vproducts i{height:11px}
.sf-template-info{padding:14px}.sf-template-info b{display:block;font-size:1rem;margin-bottom:5px}.sf-template-info small{display:block;color:var(--muted);line-height:1.45;min-height:40px}.sf-template-tag{display:inline-flex;margin-top:9px;border-radius:999px;background:#eef2ff;color:#3730a3;padding:5px 8px;font-size:.68rem;font-weight:900}
.sf-config-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.sf-settings .grid3{margin-bottom:12px}.sf-switch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}.sf-switch-card{border:1px solid var(--line);border-radius:12px;padding:11px;display:flex;align-items:center;gap:9px;font-weight:800;background:#fafcff}.sf-switch-card input{width:auto}
.sf-preview-shell{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#eef2f7;box-shadow:0 13px 35px rgba(23,29,45,.08)}.sf-preview-browser{height:26px;background:#dce3eb;display:flex;gap:5px;align-items:center;padding:0 9px}.sf-preview-browser i{width:7px;height:7px;border-radius:50%;background:#9aa8b7}.sf-live-preview{background:#fff;min-height:380px;color:#172033;overflow:hidden}.sf-live-top{height:36px;background:#12233a;display:flex;align-items:center;justify-content:space-between;padding:0 12px;color:#fff;font-size:.7rem;font-weight:900}.sf-live-hero{height:130px;background:linear-gradient(135deg,#526f8b,#172a3e);padding:23px 18px;color:#fff;display:flex;align-items:center}.sf-live-hero div{width:62%}.sf-live-hero b{display:block;font-size:1.35rem;line-height:1.05;margin-bottom:7px}.sf-live-hero span{display:block;height:5px;background:#ffffffb8;border-radius:5px;width:80%;box-shadow:0 10px 0 #ffffff75}.sf-live-cats{display:flex;gap:6px;padding:12px;overflow:hidden}.sf-live-cats i{height:18px;min-width:55px;border-radius:999px;background:#edf1f6}.sf-live-products{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:0 12px 14px}.sf-live-product{border:1px solid #e1e7ee;border-radius:11px;overflow:hidden;background:#fff}.sf-live-product img{width:100%;height:70px;object-fit:cover;background:#eef2f6;display:block}.sf-live-product div{padding:7px}.sf-live-product b{display:block;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sf-live-product small{font-size:.6rem;color:#728095}.sf-live-preview.preview-dark{background:#0d1117;color:#fff}.sf-live-preview.preview-dark .sf-live-top{background:#020304}.sf-live-preview.preview-dark .sf-live-product{background:#171c24;border-color:#2a3340}.sf-live-preview.preview-dark .sf-live-product small{color:#aab2bf}.sf-live-preview.preview-fashion .sf-live-hero{height:180px}.sf-live-preview.preview-minimal .sf-live-top{background:#fff;color:#111;border-bottom:1px solid #ddd}.sf-live-preview.preview-rounded .sf-live-hero{border-radius:0 0 34px 34px}.sf-live-preview.preview-bold .sf-live-product{border:2px solid #111;box-shadow:3px 3px 0 #111;border-radius:0}
.sf-current-template{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;background:#f8fafc;border:1px solid var(--line);margin-bottom:14px}.sf-current-template strong{display:block}.sf-current-template small{color:var(--muted)}
@media(max-width:1200px){.sf-template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sf-config-grid{grid-template-columns:1fr}}
@media(max-width:680px){.sf-template-grid{grid-template-columns:1fr}.sf-studio-intro{align-items:flex-start;flex-direction:column}.sf-switch-grid{grid-template-columns:1fr}}

/* ============================================================
   PedidosClick Storefront Studio V2 · selector visual + modal
   ============================================================ */
.sf-template-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.sf-template-card{border-radius:22px;overflow:hidden}
.sf-template-visual{height:250px;padding:14px;background:#eef2f6;border-bottom:1px solid var(--line)}
.sf-template-visual .vtop{height:22px;margin:0 0 9px;display:flex;align-items:center;gap:5px;padding:0 8px;background:#18283c;border-radius:7px}
.sf-template-visual .vtop i{width:5px;height:5px;border-radius:50%;background:#fff8}.sf-template-visual .vtop b{width:42px;height:5px;border-radius:3px;background:#fff8}.sf-template-visual .vtop em{width:26px;height:9px;border-radius:5px;background:#fff;margin-left:auto}
.sf-template-visual .vmock{height:178px;display:grid;grid-template-columns:1fr;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 8px 22px #18283c16}
.sf-template-visual .vside{display:none;padding:8px;background:#f7f8fa;border-right:1px solid #e5e8ec;gap:5px;align-content:start}.sf-template-visual .vside i{height:9px;border-radius:4px;background:#d5dae1}
.sf-template-visual .vmain{min-width:0;overflow:hidden}.sf-template-visual .vhero{height:70px;margin:0;border-radius:0;background:linear-gradient(135deg,#d7e4ef,#8099ae);padding:15px;position:relative}.sf-template-visual .vhero span{display:block;width:45%;height:7px;border-radius:5px;background:#fff}.sf-template-visual .vhero b{display:block;width:30%;height:5px;border-radius:5px;background:#ffffff9c;margin-top:9px}
.sf-template-visual .vchips{display:flex;gap:5px;padding:8px;margin:0}.sf-template-visual .vchips i{height:8px;width:35px;border-radius:99px;background:#d5dbe2}
.sf-template-visual .vproducts{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:0 8px 8px}.sf-template-visual .vproducts i{height:52px;border-radius:6px;background:linear-gradient(#dfe5eb 58%,#fff 58%);border:1px solid #dfe4ea}
.sf-layout-label{position:absolute;left:24px;bottom:18px;background:#111827;color:#fff;padding:6px 9px;border-radius:999px;font-size:.66rem;font-weight:900;box-shadow:0 5px 14px #0002}
.sf-template-info{padding:16px}.sf-template-info>div:first-child{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:7px}.sf-template-info>div:first-child b{margin:0}.sf-template-info small{min-height:44px}.sf-template-tag{margin:0}.sf-floating-preview-btn{width:100%;border:0;background:#111827;color:#fff;border-radius:12px;padding:10px 12px;font-weight:900;margin-top:12px;cursor:pointer}.sf-floating-preview-btn:hover{transform:translateY(-1px)}

/* miniaturas estructurales: las 24 se leen distinto */
.sf-mock-gourmet .vmock{grid-template-columns:1fr}.sf-mock-gourmet .vhero{height:105px;width:58%;margin:10px;background:#30231e;border-radius:0}.sf-mock-gourmet .vproducts{grid-template-columns:2fr 1fr 1fr}
.sf-mock-fastfood .vhero{background:linear-gradient(135deg,#fb8c00,#ef4444);clip-path:polygon(0 0,100% 0,100% 86%,0 100%)}.sf-mock-fastfood .vproducts{grid-template-columns:2fr 1fr 1fr}.sf-mock-fastfood .vproducts i{border:2px solid #111;box-shadow:2px 2px 0 #111}
.sf-mock-carta .vmock{grid-template-columns:62px 1fr}.sf-mock-carta .vside{display:grid}.sf-mock-carta .vhero{height:42px}.sf-mock-carta .vproducts{grid-template-columns:1fr 1fr}.sf-mock-carta .vproducts i{height:30px;background:linear-gradient(90deg,#dfe5eb 28%,#fff 28%);border-radius:2px}
.sf-mock-dark-kitchen .vmock{background:#0d1117}.sf-mock-dark-kitchen .vhero{background:#202631}.sf-mock-dark-kitchen .vchips i{background:#303846}.sf-mock-dark-kitchen .vproducts i{background:linear-gradient(#29313e 58%,#171c24 58%);border-color:#303a48}
.sf-mock-coffee .vhero{height:85px;border-radius:0 0 28px 28px;background:linear-gradient(135deg,#d7b89c,#815d46)}.sf-mock-coffee .vproducts{grid-template-columns:repeat(3,1fr);gap:9px}.sf-mock-coffee .vproducts i{height:62px;border-radius:14px}.sf-mock-coffee .vproducts i:nth-child(2){transform:translateY(12px)}
.sf-mock-parrilla .vhero{background:linear-gradient(135deg,#4a2a20,#111)}.sf-mock-parrilla .vproducts{grid-template-columns:1fr 1fr}.sf-mock-parrilla .vproducts i{height:42px;background:linear-gradient(90deg,#8d6b5b 43%,#fff 43%);border-radius:2px}
.sf-mock-street .vhero{background:linear-gradient(135deg,#facc15,#f43f5e);clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}.sf-mock-street .vproducts{grid-template-columns:repeat(4,1fr)}.sf-mock-street .vproducts i{border:2px solid #111;border-radius:2px;box-shadow:2px 2px 0 #111}.sf-mock-street .vproducts i:first-child{grid-column:span 2}
.sf-mock-qr-table .vhero{height:38px}.sf-mock-qr-table .vchips{padding:4px 8px}.sf-mock-qr-table .vproducts{grid-template-columns:1fr 1fr}.sf-mock-qr-table .vproducts i{height:29px;background:linear-gradient(90deg,#dfe5eb 25%,#fff 25%)}

.sf-mock-supermarket .vmock{grid-template-columns:62px 1fr}.sf-mock-supermarket .vside{display:grid}.sf-mock-supermarket .vhero{height:50px;background:linear-gradient(135deg,#4caf70,#bfe9ce)}.sf-mock-supermarket .vproducts{grid-template-columns:repeat(4,1fr)}.sf-mock-supermarket .vproducts i{height:45px}
.sf-mock-minimarket .vhero{height:40px}.sf-mock-minimarket .vproducts{grid-template-columns:repeat(5,1fr);gap:3px}.sf-mock-minimarket .vproducts i{height:39px;border-radius:3px}
.sf-mock-express .vhero{height:46px;background:linear-gradient(135deg,#ff7a00,#ef2b2b)}.sf-mock-express .vproducts{grid-template-columns:2fr 1fr 1fr}.sf-mock-express .vproducts i{height:48px;border:2px solid #f05b24}
.sf-mock-fresh .vhero{height:78px;border-radius:0 0 25px 25px;background:linear-gradient(135deg,#9dd6a4,#3c9852)}.sf-mock-fresh .vchips i{height:24px;border-radius:9px}.sf-mock-fresh .vproducts i{border-radius:14px}
.sf-mock-pharmacy .vhero{height:38px;background:linear-gradient(135deg,#dbeafe,#60a5fa)}.sf-mock-pharmacy .vproducts{grid-template-columns:1fr 1fr}.sf-mock-pharmacy .vproducts i{height:31px;background:linear-gradient(90deg,#dbeafe 30%,#fff 30%)}
.sf-mock-bodega .vhero{height:88px;background:linear-gradient(135deg,#5a342a,#b58b72)}.sf-mock-bodega .vproducts{grid-template-columns:repeat(4,1fr);gap:10px}.sf-mock-bodega .vproducts i{height:65px;background:linear-gradient(#e8dfd6 70%,#fff 70%);border-radius:0}
.sf-mock-abarrotes .vmock{grid-template-columns:55px 1fr}.sf-mock-abarrotes .vside{display:grid}.sf-mock-abarrotes .vhero{height:28px}.sf-mock-abarrotes .vproducts{grid-template-columns:1fr}.sf-mock-abarrotes .vproducts i{height:17px;background:linear-gradient(90deg,#dfe5eb 18%,#fff 18%);border-radius:2px}
.sf-mock-wholesale .vhero{height:28px;background:#18283c}.sf-mock-wholesale .vproducts{grid-template-columns:1fr}.sf-mock-wholesale .vproducts i{height:18px;background:linear-gradient(90deg,#ccd4dd 16%,#fff 16%,#fff 74%,#d7dce2 74%);border-radius:0}

.sf-mock-fashion .vhero{height:115px;border-radius:0;background:linear-gradient(135deg,#d4d4d4,#6f6f6f)}.sf-mock-fashion .vchips{border-bottom:1px solid #ddd}.sf-mock-fashion .vproducts{grid-template-columns:repeat(4,1fr);gap:5px}.sf-mock-fashion .vproducts i{height:70px;border-radius:0;background:linear-gradient(#c9c9c9 76%,#fff 76%)}
.sf-mock-tech .vmock{grid-template-columns:62px 1fr}.sf-mock-tech .vside{display:grid}.sf-mock-tech .vhero{height:43px;background:linear-gradient(135deg,#0f4c81,#60a5fa)}.sf-mock-tech .vproducts i{height:54px;background:linear-gradient(#eaf2fb 55%,#fff 55%)}
.sf-mock-boutique .vhero{height:100px;background:linear-gradient(135deg,#d8c3ad,#8f7660)}.sf-mock-boutique .vproducts{grid-template-columns:repeat(3,1fr);gap:13px}.sf-mock-boutique .vproducts i{height:68px;border-radius:0;background:linear-gradient(#dfd5cc 73%,#fff 73%)}
.sf-mock-catalog .vmock{grid-template-columns:58px 1fr}.sf-mock-catalog .vside{display:grid}.sf-mock-catalog .vhero{height:42px}.sf-mock-catalog .vproducts{grid-template-columns:repeat(3,1fr)}
.sf-mock-home .vhero{height:75px;background:linear-gradient(135deg,#cbbba8,#8e806f)}.sf-mock-home .vproducts{grid-template-columns:repeat(4,1fr)}.sf-mock-home .vproducts i:first-child{grid-column:span 2;grid-row:span 2;height:76px}.sf-mock-home .vproducts i{height:34px;border-radius:0}
.sf-mock-beauty .vhero{height:78px;border-radius:0 0 35px 35px;background:linear-gradient(135deg,#f7dfe8,#c98da6)}.sf-mock-beauty .vproducts i{border-radius:15px;background:linear-gradient(#f6e9ef 58%,#fff 58%)}
.sf-mock-outlet .vhero{height:42px;background:linear-gradient(135deg,#ef2b2b,#f59e0b)}.sf-mock-outlet .vproducts{grid-template-columns:2fr 1fr 1fr}.sf-mock-outlet .vproducts i{border:2px solid #111;border-radius:0}.sf-mock-outlet .vproducts i:first-child{height:70px}
.sf-mock-showroom .vhero{height:105px;border-radius:0;background:linear-gradient(135deg,#d5d5d5,#7d7d7d)}.sf-mock-showroom .vchips{display:none}.sf-mock-showroom .vproducts{grid-template-columns:1fr 1fr;gap:10px;padding-top:9px}.sf-mock-showroom .vproducts i{height:52px;border-radius:0}.sf-mock-showroom .vproducts i:first-child{grid-column:1/-1;height:38px}

/* Vista previa flotante REAL */
body.sf-preview-open{overflow:hidden}.sf-preview-modal{position:fixed;inset:0;z-index:9999;display:none}.sf-preview-modal.on{display:block}.sf-preview-backdrop{position:absolute;inset:0;background:rgba(8,15,28,.78);backdrop-filter:blur(8px)}.sf-preview-window{position:absolute;inset:3vh 2.5vw;background:#eef2f6;border-radius:22px;overflow:hidden;box-shadow:0 32px 100px #0007;display:flex;flex-direction:column;border:1px solid #ffffff44}.sf-preview-toolbar{height:68px;flex:0 0 auto;background:#fff;border-bottom:1px solid #dfe4ea;display:flex;align-items:center;gap:18px;padding:0 18px}.sf-preview-toolbar>div:first-child{min-width:210px}.sf-preview-toolbar small{display:block;color:#7b8795;font-size:.7rem;font-weight:900;text-transform:uppercase}.sf-preview-toolbar strong{display:block;font-size:1rem}.sf-device-switch{display:flex;background:#eef2f6;border-radius:12px;padding:4px;margin:auto}.sf-device-switch button{border:0;background:transparent;padding:8px 12px;border-radius:9px;font-weight:850;cursor:pointer}.sf-device-switch button.on{background:#fff;box-shadow:0 3px 10px #16263b16}.sf-preview-toolbar-actions{display:flex;align-items:center;gap:8px}.sf-preview-close{width:38px;height:38px;border:0;border-radius:50%;background:#111827;color:#fff;font-weight:900;cursor:pointer}.sf-preview-canvas{position:relative;flex:1;min-height:0;display:flex;align-items:stretch;justify-content:center;padding:16px;overflow:auto}.sf-preview-canvas iframe{border:0;background:#fff;box-shadow:0 14px 50px #17203329;transition:.2s;width:100%;height:100%;border-radius:10px}.sf-preview-canvas.mobile iframe{width:390px;min-width:390px;border-radius:28px;border:8px solid #111827}.sf-preview-loading{position:absolute;inset:0;display:grid;place-items:center;color:#6b7280;font-weight:850;pointer-events:none}.sf-preview-modal.loaded .sf-preview-loading{display:none}.sf-preview-foot{height:58px;flex:0 0 auto;background:#fff;border-top:1px solid #dfe4ea;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 18px;font-size:.82rem;color:#5e6877}
@media(max-width:1000px){.sf-template-grid{grid-template-columns:1fr}.sf-preview-window{inset:1.5vh 1.5vw}.sf-preview-toolbar>div:first-child{min-width:160px}.sf-preview-toolbar{gap:8px}.sf-preview-toolbar .btn{display:none}}
@media(max-width:680px){.sf-template-visual{height:225px}.sf-preview-window{inset:0;border-radius:0}.sf-preview-toolbar{height:auto;min-height:106px;flex-wrap:wrap;padding:10px}.sf-preview-toolbar>div:first-child{min-width:calc(100% - 50px)}.sf-device-switch{order:3;width:100%;justify-content:center}.sf-preview-toolbar-actions{margin-left:auto}.sf-preview-foot{height:auto;min-height:70px;padding:9px 12px;flex-wrap:wrap}.sf-preview-canvas{padding:8px}.sf-preview-canvas.mobile iframe{width:360px;min-width:360px}}


/* V9.6.0 Storefront Builder V3 */
.sf-settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.sf-settings-head h2{margin:0 0 4px}.sf-draft-status{color:#64748b;font-weight:800}.sf-draft-status.on{color:#b45309}.sf-master-card{box-shadow:0 0 0 2px #16a34a22,0 10px 30px #16263b10}.sf-master-tag,.sf-evolving-tag{display:inline-flex;border-radius:999px;padding:4px 7px;font-size:.56rem;font-weight:950;letter-spacing:.04em}.sf-master-tag{background:#dcfce7;color:#166534}.sf-evolving-tag{background:#f1f5f9;color:#64748b}.sf-order-block{margin-top:20px;border-top:1px solid var(--line);padding-top:18px}.sf-order-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.sf-order-head h3{margin:0 0 4px}.sf-order-head p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.45}.sf-section-order{display:grid;gap:8px;margin-top:12px}.sf-order-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px 11px;background:#fff}.sf-order-grip{width:38px;height:38px;border-radius:10px;background:#f6f7f9;display:grid;place-items:center}.sf-order-item b{display:block}.sf-order-item small{display:block;color:var(--muted);font-size:.72rem;margin-top:2px}.sf-order-actions{display:flex;gap:5px}.sf-order-actions button{width:34px;height:34px;border:1px solid var(--line);background:#fff;border-radius:9px;font-weight:900;cursor:pointer}.sf-order-actions button:disabled{opacity:.25;cursor:not-allowed}@media(max-width:680px){.sf-settings-head,.sf-order-head{flex-direction:column}.sf-order-item{grid-template-columns:38px minmax(0,1fr) auto}.sf-order-actions button{width:32px;height:32px}}
.sf-mock-fashion-pro .vhero{height:100px;border-radius:0;background:linear-gradient(90deg,#f5eee9 48%,#b1a398 48%)}.sf-mock-fashion-pro .vchips{justify-content:center}.sf-mock-fashion-pro .vproducts{grid-template-columns:repeat(3,1fr);gap:6px}.sf-mock-fashion-pro .vproducts i{height:64px;border-radius:0;background:linear-gradient(#beb4ab 78%,#fff 78%)}.sf-mock-fashion-pro .vproducts i:first-child{grid-column:span 2;background:linear-gradient(90deg,#9d8c80 48%,#ece7e1 48%)}

.sf-mock-visual .vhero{height:100px;border-radius:9px;background:linear-gradient(90deg,#f6dce4 42%,#c77b91 42%)}.sf-mock-visual .vchips{background:#c77b91;padding:6px;border-radius:0}.sf-mock-visual .vproducts{grid-template-columns:repeat(4,1fr);gap:5px}.sf-mock-visual .vproducts i{height:82px;background:linear-gradient(#efe7e7 58%,#fff 58%,#fff 78%,#c77b91 78%,#c77b91 86%,#fff 86%);border-radius:7px}

/* V11.6 · Identidad visual compartida Diseño + Plantillas */
.sf-design-template-bridge,.sf-brand-bridge{display:grid;grid-template-columns:minmax(0,1.35fr) auto auto;gap:18px;align-items:center;border:1px solid color-mix(in srgb,var(--p) 20%,var(--line));background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--p) 4%,#fff));border-radius:20px;padding:18px 20px;margin-bottom:18px;box-shadow:0 8px 26px rgba(23,29,45,.045)}
.sf-design-template-bridge small,.sf-brand-bridge-copy>small{display:block;color:var(--p);font-size:.7rem;font-weight:950;letter-spacing:.09em;margin-bottom:5px}.sf-design-template-bridge strong,.sf-brand-bridge h3{display:block;margin:0 0 5px;font-size:1.03rem}.sf-design-template-bridge span,.sf-brand-bridge p{display:block;margin:0;color:var(--muted);line-height:1.5;font-size:.86rem}.sf-brand-bridge-actions{display:grid;gap:9px;justify-items:end}.sf-brand-palette{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}.sf-brand-swatch{display:grid;justify-items:center;gap:4px;min-width:42px}.sf-brand-swatch i{width:30px;height:30px;border-radius:10px;border:2px solid #fff;box-shadow:0 0 0 1px rgba(17,24,39,.15),0 4px 12px rgba(17,24,39,.10)}.sf-brand-swatch small{font-size:.58rem!important;color:var(--muted)!important;letter-spacing:0!important;margin:0!important;text-transform:none!important;font-weight:800!important}.sf-template-brand-note{display:inline-flex;width:max-content;max-width:100%;margin-top:7px;padding:5px 8px;border-radius:999px;background:color-mix(in srgb,var(--sf-brand-p,#F56B16) 9%,#fff);color:color-mix(in srgb,var(--sf-brand-p,#F56B16) 78%,#111);font-size:.62rem;font-weight:900}

/* Las miniaturas conservan la distribución de cada plantilla, pero heredan la paleta del negocio. */
.sf-template-card{--sf-brand-p:#F56B16;--sf-brand-s:#111111;--sf-brand-a:#25d366;--sf-brand-bg:#FFFAF6;--sf-brand-tx:#181818;--sf-brand-r:18px}
.sf-template-card.selected{border-color:var(--sf-brand-p)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--sf-brand-p) 13%,transparent),0 12px 32px rgba(23,29,45,.10)!important}
.sf-template-card .sf-template-visual{background:var(--sf-brand-bg)!important;color:var(--sf-brand-tx)!important}
.sf-template-card .sf-template-visual .vtop{background:var(--sf-brand-s)!important}
.sf-template-card .sf-template-visual .vmock{background:color-mix(in srgb,var(--sf-brand-bg) 90%,#fff)!important}
.sf-template-card .sf-template-visual .vside{background:color-mix(in srgb,var(--sf-brand-bg) 82%,#fff)!important;border-color:color-mix(in srgb,var(--sf-brand-tx) 14%,transparent)!important}
.sf-template-card .sf-template-visual .vside i{background:color-mix(in srgb,var(--sf-brand-tx) 18%,var(--sf-brand-bg))!important}
.sf-template-card .sf-template-visual .vhero{background:linear-gradient(135deg,var(--sf-brand-p),var(--sf-brand-s))!important}
.sf-template-card .sf-template-visual .vchips i{background:color-mix(in srgb,var(--sf-brand-a) 30%,var(--sf-brand-bg))!important}
.sf-template-card .sf-template-visual .vproducts i{background:linear-gradient(color-mix(in srgb,var(--sf-brand-p) 10%,#fff) 58%,#fff 58%)!important;border-color:color-mix(in srgb,var(--sf-brand-tx) 13%,transparent)!important;border-radius:min(12px,var(--sf-brand-r))}
.sf-template-card .sf-template-visual .vtop em{background:var(--sf-brand-a)!important}
.sf-template-card .sf-layout-label{background:color-mix(in srgb,var(--sf-brand-s) 90%,transparent)!important;color:#fff!important}

/* La vista rápida usa exactamente la misma identidad visual. */
.sf-live-preview{--sf-brand-p:#F56B16;--sf-brand-s:#111111;--sf-brand-a:#25d366;--sf-brand-bg:#FFFAF6;--sf-brand-tx:#181818;--sf-brand-r:18px;background:var(--sf-brand-bg)!important;color:var(--sf-brand-tx)!important}
.sf-live-preview .sf-live-top,.sf-live-preview.preview-dark .sf-live-top,.sf-live-preview.preview-minimal .sf-live-top{background:var(--sf-brand-s)!important;color:#fff!important;border-bottom-color:color-mix(in srgb,var(--sf-brand-tx) 15%,transparent)!important}
.sf-live-preview .sf-live-hero{background:linear-gradient(135deg,var(--sf-brand-p),var(--sf-brand-s))!important}
.sf-live-preview .sf-live-cats i{background:color-mix(in srgb,var(--sf-brand-a) 20%,#fff)!important}
.sf-live-preview .sf-live-product,.sf-live-preview.preview-dark .sf-live-product{background:#fff!important;color:var(--sf-brand-tx)!important;border-color:color-mix(in srgb,var(--sf-brand-tx) 14%,transparent)!important;border-radius:var(--sf-brand-r)!important}
.sf-live-preview .sf-live-product small,.sf-live-preview.preview-dark .sf-live-product small{color:color-mix(in srgb,var(--sf-brand-tx) 62%,transparent)!important}
.sf-live-preview.preview-bold .sf-live-product{border-color:var(--sf-brand-s)!important;box-shadow:3px 3px 0 var(--sf-brand-s)!important}

@media(max-width:900px){.sf-design-template-bridge,.sf-brand-bridge{grid-template-columns:1fr}.sf-brand-bridge-actions{justify-items:start}}

/* V11.7 · Las tarjetas de plantilla muestran también su comportamiento funcional. */
.sf-template-behavior{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.sf-template-behavior span{display:inline-flex;align-items:center;min-height:25px;padding:5px 8px;border-radius:999px;background:#eef4ff;color:#294b76;font-size:.64rem;font-weight:900;border:1px solid #d9e6f7}.sf-template-card.selected .sf-template-behavior span{background:color-mix(in srgb,var(--sf-brand-p,#F56B16) 9%,#fff);color:color-mix(in srgb,var(--sf-brand-p,#F56B16) 78%,#111);border-color:color-mix(in srgb,var(--sf-brand-p,#F56B16) 20%,#fff)}
