.salinas-cart-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; height: 100dvh; background: rgba(18, 18, 16, 0.45); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); z-index: 1000000; opacity: 0; visibility: hidden; transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s ease; } .salinas-cart-overlay.is-active { opacity: 1; visibility: visible; } .salinas-cart-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: clamp(340px, 92vw, 440px); height: 100vh; max-height: 100vh; height: 100dvh; max-height: 100dvh; background: #ffffff; z-index: 1000001; box-shadow: -15px 0 40px rgba(0, 0, 0, 0.12); transform: translateX(100%); transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden; font-family: var(--i2-sans, 'Object Sans', -apple-system, BlinkMacSystemFont, sans-serif); } .salinas-cart-drawer.is-active { transform: translateX(0); } body.salinas-cart-is-open #pojo-a11y-toolbar, body.salinas-cart-is-open #db-back-to-top, body.salinas-cart-is-open #salinas-floating-cart-btn { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } .salinas-cart-inner { display: flex; flex-direction: column; height: 100%; max-height: 100vh; max-height: 100dvh; width: 100%; box-sizing: border-box; overflow: hidden; } .salinas-cart-header { position: relative; padding: 20px 24px; border-bottom: 1px solid #e5e5e5; flex-shrink: 0; background: #ffffff; display: flex; align-items: center; justify-content: center; } .salinas-cart-header-center { display: flex; align-items: center; justify-content: center; gap: 10px; } .salinas-cart-header-icon-box { position: relative; display: inline-flex; align-items: center; justify-content: center; } .salinas-cart-header-count { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -15%); font-size: 11px; font-weight: 800; color: #ffffff; line-height: 1; } .salinas-cart-header-title-text { margin: 0; font-size: 1.18rem; font-weight: 600; color: #121210; letter-spacing: -0.01em; } .salinas-cart-close { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); background: none; border: none; font-size: 26px; line-height: 1; color: #555555; cursor: pointer; padding: 4px 8px; transition: color 0.2s; } .salinas-cart-close:hover { color: #000000; } .salinas-cart-items-list { flex: 1 1 auto; overflow-y: auto; min-height: 0; padding: 0 24px; -webkit-overflow-scrolling: touch; } .salinas-cart-item { display: grid; grid-template-columns: 85px 1fr auto; gap: 18px; padding: 22px 0; border-bottom: 1px solid #e5e5e5; align-items: start; } .salinas-cart-col-img { display: flex; flex-direction: column; align-items: center; } .salinas-cart-item-img-link { width: 80px; height: 80px; display: flex; align-items: center; justify-content: center; background: #ffffff; overflow: hidden; } .salinas-cart-item-img-link img { max-width: 100%; max-height: 100%; object-fit: contain; } .salinas-cart-item-remove { margin-top: 10px; background: none; border: none; color: #121210; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer; padding: 2px 4px; transition: opacity 0.2s, color 0.2s; } .salinas-cart-item-remove:hover { color: #d32f2f; opacity: 0.8; } .salinas-cart-col-info { display: flex; flex-direction: column; gap: 6px; padding-top: 4px; min-width: 0; } .salinas-cart-item-title { margin: 0; font-size: 0.96rem; font-weight: 700; line-height: 1.35; color: #121210; } .salinas-cart-item-title a { color: #121210; text-decoration: none; } .salinas-cart-item-title a:hover { color: #444; } .salinas-cart-item-unit-price { font-size: 0.92rem; color: #121210; font-weight: 500; } .salinas-cart-qty-ctrl { display: inline-flex; align-items: center; border: 1px solid #dfdeda; border-radius: 9999px; height: 30px; width: fit-content; padding: 0 3px; margin-top: 4px; background: #fafafa; user-select: none; touch-action: manipulation; } .salinas-cart-qty-ctrl .qty-btn { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: none; background: transparent; color: #121210; font-size: 15px; font-weight: 600; line-height: 1; cursor: pointer; border-radius: 50%; transition: background-color 0.15s ease, color 0.15s ease; padding: 0; touch-action: manipulation; } .salinas-cart-qty-ctrl .qty-btn:hover { background: #121210; color: #ffffff; } .salinas-cart-qty-ctrl .qty-num { display: inline-block; min-width: 22px; text-align: center; font-size: 12px; font-weight: 700; color: #121210; padding: 0 4px; line-height: 1; } .salinas-cart-col-price { padding-top: 4px; text-align: right; } .salinas-cart-item-line-total { font-size: 0.96rem; font-weight: 600; color: #121210; white-space: nowrap; } .salinas-cart-footer { padding: 20px 24px calc(24px + env(safe-area-inset-bottom, 0px)) 24px; border-top: 1px solid #e5e5e5; background: #ffffff; flex-shrink: 0; margin-top: auto; text-align: center; } .salinas-cart-total-row { font-size: 1.25rem; font-weight: 800; color: #121210; margin-bottom: 6px; display: flex; align-items: center; justify-content: center; gap: 6px; } .salinas-cart-free-shipping-note { font-size: 0.92rem; color: #222222; margin-bottom: 18px; font-weight: 500; } .salinas-cart-free-shipping-note .free-shipping-success { color: #1a7f37; font-weight: 700; } .salinas-cart-buttons-group { display: flex; flex-direction: column; gap: 8px; } .salinas-btn-stack { display: block; width: 100%; height: 46px; line-height: 46px; text-align: center; background: #000000; color: #ffffff !important; border: none; border-radius: 0; font-size: 0.95rem; font-weight: 700; text-decoration: none !important; text-transform: none; letter-spacing: 0.02em; transition: background 0.2s, opacity 0.2s; cursor: pointer; box-sizing: border-box; padding: 0; } .salinas-btn-stack:hover { background: #262626; color: #ffffff !important; } .salinas-btn-stack:active { background: #111111; } .salinas-cart-empty-state { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 24px; text-align: center; } .salinas-cart-empty-state .empty-icon { margin-bottom: 16px; } .salinas-cart-empty-state h4, .salinas-cart-empty-state .empty-title { font-size: 1.15rem; color: #121210; margin: 0 0 8px; font-weight: 700; } .salinas-cart-empty-state p { font-size: 0.92rem; color: #666; margin: 0 0 24px; line-height: 1.5; } .salinas-has-flip { position: relative; overflow: hidden; } .salinas-has-flip img.salinas-prod-img-flip { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; visibility: hidden; transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); transform: scale(0.97); pointer-events: none; z-index: 2; } @media (hover: hover) and (pointer: fine) { .i2-product-card:hover .salinas-has-flip img.salinas-prod-img-flip, .db-product-card:hover .salinas-has-flip img.salinas-prod-img-flip, .product:hover .salinas-has-flip img.salinas-prod-img-flip { opacity: 1; visibility: visible; transform: scale(1); } } .salinas-floating-cart-btn { position: fixed; bottom: 25px; right: 25px; width: 58px; height: 58px; border-radius: 50%; background: #ffffff; border: none; box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16); z-index: 999990; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; outline: none; opacity: 1; visibility: visible; transform: scale(1); transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s; } .salinas-floating-cart-btn.is-visible { opacity: 1; visibility: visible; transform: scale(1); } .salinas-floating-cart-btn:hover { transform: scale(1.06); box-shadow: 0 6px 24px rgba(0, 0, 0, 0.22); } .salinas-floating-cart-btn:active { transform: scale(0.96); } .salinas-floating-cart-icon-box { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } .salinas-floating-cart-badge { position: absolute; top: -6px; left: -6px; background: #000000; color: #ffffff; font-size: 13px; font-weight: 700; width: 24px; height: 24px; min-width: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; border: none; line-height: 1; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; } body.woocommerce-cart #salinas-floating-cart-btn, body.woocommerce-checkout #salinas-floating-cart-btn { display: none !important; } @media (max-width: 768px) { .salinas-floating-cart-btn { bottom: calc(18px + env(safe-area-inset-bottom, 0px)); right: 16px; width: 52px; height: 52px; } .salinas-floating-cart-badge { top: -4px; left: -4px; width: 21px; height: 21px; min-width: 21px; font-size: 11px; } body:not(.woocommerce-cart):not(.woocommerce-checkout) .db-back-to-top { bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important; right: 22px !important; } } @media (max-width: 480px) { .salinas-cart-drawer { width: 92vw; max-width: 92vw; } .salinas-cart-header { padding: 16px 18px; } .salinas-cart-items-list { padding: 0 18px; } .salinas-cart-item { grid-template-columns: 68px 1fr auto; gap: 12px; padding: 16px 0; } .salinas-cart-item-img-link { width: 66px; height: 66px; } .salinas-cart-item-title { font-size: 0.9rem; } .salinas-cart-item-unit-price { font-size: 0.85rem; } .salinas-cart-item-line-total { font-size: 0.9rem; } .salinas-cart-footer { padding: 16px 18px calc(20px + env(safe-area-inset-bottom, 0px)) 18px; } .salinas-cart-total-row { font-size: 1.15rem; } .salinas-btn-stack { height: 44px; line-height: 44px; font-size: 0.9rem; } }
/*# sourceURL=salinas-shop-enhancements-inline-css */