/* ── DraftShop Checkout UI ─────────────────────────────────────────────── */

/* Modal */
.draftshop-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:100000000;display:flex;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;overflow:hidden;}
.draftshop-modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);touch-action:none;}
.draftshop-modal-content{position:relative;background:#fff;width:100%;max-width:420px;border-radius:28px;box-shadow:0 25px 60px rgba(0,0,0,.2);animation:dsModalPop .3s cubic-bezier(.34,1.56,.64,1);max-height:90vh;display:flex;flex-direction:column;box-sizing:border-box !important;touch-action:pan-y;overflow:hidden;}
.draftshop-modal, .draftshop-modal *, .draftshop-modal-content, .draftshop-modal-content * { box-sizing:border-box !important; }
@keyframes dsModalPop{from{transform:scale(.9);opacity:0;}to{transform:scale(1);opacity:1;}}
.draftshop-modal-close{position:absolute !important;top:14px !important;right:14px !important;width:32px !important;height:32px !important;border-radius:50% !important;background:#fff !important;border:1px solid #eee !important;font-size:20px !important;cursor:pointer !important;display:flex !important;align-items:center !important;justify-content:center !important;z-index:10 !important;box-shadow:0 2px 8px rgba(0,0,0,.1) !important;padding:0 !important;margin:0 !important;color:#111 !important;line-height:1 !important;text-shadow:none !important;}
.draftshop-modal-body{padding:24px 24px 36px;text-align:center;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch !important;overscroll-behavior:contain;}
.draftshop-modal-img{width:140px;height:140px;margin:0 auto 18px;border-radius:14px;overflow:hidden;background:#f4f4f5;}
.draftshop-modal-img img{width:100%;height:100%;object-fit:cover;}
#draftshop-modal-title{font-size:1.3rem;font-weight:700;margin:0 0 6px;color:#111;}
#draftshop-modal-price{font-size:1.1rem;color:#71717a;margin:0 0 24px;}

/* Qty */
.draftshop-modal-section{margin-bottom:20px;text-align:center;}
.draftshop-modal-section label{display:block;font-size:.85rem;font-weight:600;color:#71717a;margin-bottom:8px;}
.draftshop-qty-selector{display:inline-flex !important;align-items:center !important;background:#fff !important;border:1px solid #e4e4e7 !important;border-radius:8px !important;overflow:hidden !important;box-shadow:none !important;padding:0 !important;margin:0 !important;}
.draftshop-qty-btn{width:44px !important;height:44px !important;border:none !important;background:transparent !important;cursor:pointer !important;font-size:20px !important;font-weight:700 !important;color:#71717a !important;display:flex !important;align-items:center !important;justify-content:center !important;padding:0 !important;margin:0 !important;line-height:1 !important;box-shadow:none !important;outline:none !important;border-radius:0 !important;text-shadow:none !important;letter-spacing:normal !important;user-select:none !important;-webkit-user-select:none !important;touch-action:none !important;}
.draftshop-qty-btn:hover{background:#f4f4f5 !important;color:#111 !important;}
.draftshop-qty-input{width:48px !important;border:none !important;border-left:1px solid #e4e4e7 !important;border-right:1px solid #e4e4e7 !important;text-align:center !important;font-size:17px !important;padding:0 !important;margin:0 !important;-moz-appearance:textfield !important;background:#fff !important;color:#111 !important;height:44px !important;box-shadow:none !important;outline:none !important;border-radius:0 !important;user-select:text !important;-webkit-user-select:text !important;touch-action:manipulation !important;pointer-events:auto !important;}
.draftshop-qty-input:focus{outline:none !important;box-shadow:none !important;border-left:1px solid #e4e4e7 !important;border-right:1px solid #e4e4e7 !important;background:#fff !important;color:#111 !important;}
.draftshop-qty-input::-webkit-outer-spin-button,.draftshop-qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.draftshop-modal input,.draftshop-modal select,.draftshop-modal textarea{font-size:17px !important;touch-action:manipulation !important;user-select:text !important;-webkit-user-select:text !important;}
.draftshop-modal input:focus,.draftshop-modal select:focus,.draftshop-modal textarea:focus{outline:none !important;border-color:#ddd !important;box-shadow:none !important;}

/* Buttons */
.draftshop-checkout-btn{display:inline-block !important;text-align:center !important;vertical-align:middle !important;align-self:center !important;box-sizing:border-box !important;background:#000;color:#fff;border:none !important;padding:11px 22px !important;margin:0 !important;border-radius:8px !important;font-size:.95rem !important;font-weight:700 !important;cursor:pointer !important;transition:background .15s !important;box-shadow:none !important;text-shadow:none !important;letter-spacing:normal !important;line-height:1.4 !important;outline:none !important;}
.draftshop-checkout-btn:hover{opacity:.88 !important;}
.draftshop-full-width{width:100% !important;padding:14px !important;font-size:1.05rem !important;}
 
/* Checkout bar */
.draftshop-checkout-bar{position:fixed !important;bottom:0 !important;left:0 !important;width:100% !important;background:rgba(255,255,255,.95) !important;backdrop-filter:blur(16px) !important;-webkit-backdrop-filter:blur(16px) !important;border-top:1px solid rgba(228,228,231,.6) !important;padding:14px 24px calc(14px + env(safe-area-inset-bottom)) !important;box-shadow:0 -4px 20px rgba(0,0,0,.08) !important;z-index:99999999 !important;animation:dsSlideUp .4s cubic-bezier(.16,1,.3,1) !important;box-sizing:border-box !important;}
@keyframes dsSlideUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);opacity:0;}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1;}}
.draftshop-checkout-inner{display:flex;align-items:center;justify-content:center;gap:32px;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box !important;}
.draftshop-cart-summary{display:flex;align-items:center;gap:8px;cursor:pointer;margin:0 !important;align-self:center !important;}
.draftshop-cart-summary-text{display:flex;flex-direction:column;}
#draftshop-cart-count{font-weight:600;font-size:.9rem;color:#111;margin:0 !important;line-height:1.2 !important;}
.draftshop-view-bag-text{font-size:.7rem;font-weight:700;color:#71717a;letter-spacing:.05em;margin:0 !important;line-height:1.2 !important;}
.draftshop-cart-summary-arrow{color:#71717a;transition:transform .2s ease;}
.draftshop-cart-summary:hover .draftshop-cart-summary-arrow{transform:translateY(-2px);}

body:has(#draftshop-checkout-bar) {
    padding-bottom: 90px !important;
}

body.draftshop-bg-dark .draftshop-checkout-bar {
    background: rgba(24,24,27,.95);
    border-top: 1px solid rgba(255,255,255,0.12);
}
body.draftshop-bg-dark #draftshop-cart-count {
    color: #fff;
}
body.draftshop-bg-dark .draftshop-view-bag-text,
body.draftshop-bg-dark .draftshop-cart-summary-arrow {
    color: #a1a1aa;
}

/* Cart modal */
.draftshop-cart-title{font-size:1.3rem;font-weight:700;margin:0 0 18px;}
#draftshop-cart-items{max-height:280px;overflow-y:auto;margin-bottom:16px;text-align:left;}
.draftshop-cart-item{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid #f4f4f5;}
.draftshop-cart-item-img{width:44px;height:44px;object-fit:cover;border-radius:8px;margin-right:12px;background:#f4f4f5;}
.draftshop-cart-item-info{display:flex;flex-direction:column;gap:2px;flex:1;}
.draftshop-cart-item-title{font-size:.9rem;font-weight:600;color:#111;}
.draftshop-cart-item-price{font-size:.82rem;color:#71717a;}
.draftshop-cart-item-actions{display:flex;align-items:center;gap:12px;}
.draftshop-cart-remove{width:24px !important;height:24px !important;background:#f4f4f5 !important;border:none !important;color:#71717a !important;border-radius:50% !important;font-size:18px !important;line-height:1 !important;cursor:pointer !important;display:flex !important;align-items:center !important;justify-content:center !important;transition:all .15s !important;padding:0 !important;margin:0 !important;box-shadow:none !important;text-shadow:none !important;}
.draftshop-cart-remove:hover{background:#fee2e2 !important;color:#ef4444 !important;}
.draftshop-cart-footer{border-top:1px solid #e4e4e7;padding-top:18px;}
.draftshop-cart-total-row{display:flex;justify-content:space-between;font-size:1.05rem;font-weight:700;margin-bottom:18px;}

/* Payment options */
.draftshop-payment-list{margin-bottom:16px;}
.draftshop-pay-option{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;background:#fff;border:1px solid #e4e4e7;border-radius:12px;margin-bottom:10px;cursor:pointer;transition:border-color .15s;}
.draftshop-pay-option:hover{border-color:var(--accent, #b8935a);}
.draftshop-pay-option:has(input:checked){border-color:var(--accent, #b8935a);background:#f8fafc;}
.draftshop-pay-option input[type=radio]{margin-right:10px;accent-color:var(--accent, #b8935a);}
.draftshop-pay-text{flex:1;font-size:.9rem;font-weight:600;color:#111;}

/* Shipping selector */
.draftshop-ship-box{margin-top:16px;padding:14px;background:#f9f9f9;border-radius:10px;}
.draftshop-ship-box label{display:block;font-size:.75rem;font-weight:700;color:#71717a;margin-bottom:8px;}
.draftshop-ship-box select{width:100%;padding:8px 10px;border-radius:8px;border:1px solid #ddd;}

/* ── Shop Grid ────────────────────────────────────────────────────────── */
.draftshop-shop-container { padding: 40px 24px; max-width: 1200px; margin-left: auto; margin-right: auto; box-sizing: border-box; width: 100%; }
.draftshop-shop-grid { 
    display: grid; 
    grid-template-columns: repeat(var(--ds-shop-cols, 3), 1fr) !important; 
    gap: 32px; 
}
.draftshop-shop-item { background: transparent; border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; height: 100%; }
.draftshop-shop-link { text-decoration: none !important; display: flex; flex-direction: column; flex: 1; color: inherit; height: 100%; }
.draftshop-shop-link:hover { text-decoration: none !important; }
.draftshop-shop-img { width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 16px; background: #f4f4f5; margin-bottom: 16px; flex-shrink: 0; }
.draftshop-shop-img img { width: 100%; height: 100%; object-fit: cover; }
.draftshop-shop-no-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #a1a1aa; font-weight: 600; }
.draftshop-shop-info { text-align: left; padding: 0 4px; display: flex; flex-direction: column; flex: 1; }
.draftshop-shop-header { display: flex; flex-direction: column; align-items: stretch; gap: 6px; margin-bottom: 20px; flex-grow: 1; }
.draftshop-shop-title { font-size: 1.05rem; font-weight: 700; margin: 0; line-height: 1.35; }
.draftshop-shop-price { font-size: 1.05rem; font-weight: 700; margin: 0; text-align: left; color: var(--accent, #b8935a); }
.draftshop-shop-price small { font-weight: 400; opacity: 0.8; margin-left: 2px; }

/* Buttons Shared */
.draftshop-shop-btn, .draftshop-btn-buy { 
    display: inline-block !important; text-align: center !important; vertical-align: middle !important;
    background: #000; color: #fff;
    padding: 11px 20px !important; border-radius: 10px !important; 
    font-size: 0.95rem !important; font-weight: 700 !important; 
    text-decoration:none !important; cursor:pointer; border: none !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
    white-space: normal !important;
}
.draftshop-shop-btn { background: #f4f4f5; color: #71717a; }
.draftshop-scheme-dark .draftshop-shop-btn { background: rgba(255,255,255,0.1); color: #fff; }


/* Page background only — separate class so no color/variable inheritance hits the header */
body.draftshop-bg-dark  { background: #000 !important; }
body.draftshop-bg-light { background: #fff !important; }

/* Scheme Support - Scoped internals */
.draftshop-scheme-dark { background: #000; color: #fff; --text: #fff; --text-2: #ccc; --accent: var(--ds-accent, #b8935a); --border: rgba(255,255,255,0.12); }
.draftshop-scheme-light { background: #fff; color: #111; --text: #111; --text-2: #71717a; --accent: var(--ds-accent, #b8935a); --border: rgba(0,0,0,0.1); }

.draftshop-scheme-dark .draftshop-shop-title, .draftshop-scheme-dark .draftshop-hero-title, .draftshop-scheme-dark .draftshop-section-title, .draftshop-scheme-dark .draftshop-faq-q { color: #fff !important; }
.draftshop-scheme-dark .draftshop-hero-desc, .draftshop-scheme-dark .draftshop-bullets li, .draftshop-scheme-dark .draftshop-faq-a-inner p { color: #bbb !important; }
.draftshop-scheme-dark .draftshop-shop-btn, .draftshop-scheme-dark .draftshop-btn-buy { border: 1px solid rgba(255,255,255,0.2) !important; }
.draftshop-scheme-light .draftshop-shop-title, .draftshop-scheme-light .draftshop-hero-title, .draftshop-scheme-light .draftshop-section-title, .draftshop-scheme-light .draftshop-faq-q { color: #111 !important; }
.draftshop-scheme-light .draftshop-hero-desc, .draftshop-scheme-light .draftshop-bullets li, .draftshop-scheme-light .draftshop-faq-a-inner p { color: #444 !important; }
.draftshop-scheme-light .draftshop-shop-btn, .draftshop-scheme-light .draftshop-btn-buy { border: none !important; }

/* WP Admin Bar Fix */
#wpadminbar { z-index: 999999 !important; }
.admin-bar .draftshop-shop-container { margin-top: 32px !important; }
@media screen and (max-width: 782px) {
    .admin-bar .draftshop-shop-container { margin-top: 46px !important; }
}

/* Long Description / Explanatory Text */
.draftshop-long-desc { font-size: 1rem; line-height: 1.8; margin-bottom: 40px; }
.draftshop-long-desc p { margin-bottom: 20px; }

.draftshop-mobile-txt { display: none; }

@media (max-width: 640px) {
    .draftshop-shop-grid { grid-template-columns: repeat(var(--ds-shop-cols-mobile, 1), 1fr) !important; gap: 24px; }
    .draftshop-desktop-txt { display: none !important; }
    .draftshop-mobile-txt { display: inline !important; }

    .draftshop-checkout-bar {
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) 16px !important;
    }
    .draftshop-checkout-inner {
        gap: 20px !important;
    }
    #draftshop-checkout-btn {
        width: 87% !important;
        max-width: 87% !important;
    }
    #draftshop-checkout-btn span {
        font-size: 0.95rem !important;
    }

    /* Cart modal — full-width bottom sheet on mobile */
    #draftshop-cart-modal {
        align-items: flex-end !important;
        padding: 0 !important;
    }
    #draftshop-cart-modal .draftshop-modal-content {
        max-width: 100% !important;
        width: 100% !important;
        border-radius: 24px 24px 0 0 !important;
        max-height: 88vh !important;
        animation: dsMobileSheetUp .3s cubic-bezier(.16,1,.3,1) !important;
    }
}
@keyframes dsMobileSheetUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* ── Theme Compatibility Fixes ──────────────────────────────────────────── */
/* Prevent horizontal overflow on product pages (any theme) */
main.draftshop-scheme-dark,
main.draftshop-scheme-light {
    overflow-x: hidden !important;
    max-width: 100% !important;
}
.draftshop-product-page {
    overflow-x: hidden !important;
}

/* FAQ button — reset theme hover styles (e.g. Elementor injects background on button:hover) */
.draftshop-faq-q:hover,
.draftshop-faq-q:focus,
.draftshop-faq-q:active {
    background: none !important;
    background-color: transparent !important;
    color: inherit !important;
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Hide proceed button when PayPal/other smart buttons are shown */
#draftshop-proceed-btn.ds-hidden {
    display: none !important;
}