/* ============================================================
   1. PREMIUM UNIFIED TOAST ENGINE
   ============================================================ */
.gtu-toast {
    position: fixed; bottom: -60px; left: 50%; transform: translateX(-50%);
    color: #ffffff !important; padding: 14px 28px !important; border-radius: 50px !important;
    font-size: 14px !important; font-weight: 600 !important; box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
    z-index: 999999999 !important; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    opacity: 0; pointer-events: none; text-align: center; max-width: 90vw; width: max-content;
}
.gtu-toast.show { bottom: 40px; opacity: 1; }

/* ============================================================
   2. CORE FRONTEND FUNNEL CARDS (12px Aesthetic)
   ============================================================ */
#gtu-core-funnel { margin: 25px 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.gtu-card {
    background: #ffffff !important; border: 1px solid #eaeaea !important;
    border-radius: 12px !important; padding: 20px !important; margin-bottom: 20px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.02) !important;
}
.gtu-card-title {
    font-size: 16px !important; font-weight: 700 !important; color: #111111 !important;
    margin-bottom: 15px !important; padding-bottom: 10px !important;
    border-bottom: 1px solid #f0f0f0 !important; display: flex !important; align-items: center !important; gap: 8px !important;
}
.gtu-yn-btn {
    flex: 1; background: #f8f9fa !important; border: 1px solid #dddddd !important; color: #444444 !important;
    padding: 12px !important; border-radius: 8px !important; transition: all 0.2s ease !important;
    font-weight: 600 !important; cursor: pointer !important;
}
.gtu-yn-btn.active {
    background: #d2232a !important; border-color: #d2232a !important; color: #ffffff !important; font-weight: 700 !important;
}
.gtu-input-wrap { margin-top: 15px !important; animation: gtuFadeIn 0.3s ease-out !important; }
@keyframes gtuFadeIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* ============================================================
   3. PRE-CART CROSS-SELL OVERLAY MATRIX (PREMIUM RESPONSIVE GRID)
   ============================================================ */
#gt-upsell-overlay {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.6) !important; z-index: 999999999 !important;
    display: none; align-items: center; justify-content: center; backdrop-filter: blur(4px);
}
#gt-upsell-content {
    width: 92%; max-width: 540px; max-height: 85vh; border-radius: 16px !important;
    overflow: hidden; display: flex; flex-direction: column; background: #ffffff;
    box-shadow: 0 20px 50px rgba(0,0,0,0.25) !important; animation: gtuPopUp 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
@keyframes gtuPopUp { 0% { transform: scale(0.92); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
.gt-upsell-header { padding: 22px !important; text-align: center !important; border-bottom: 1px solid #eeeeee !important; }
.gt-upsell-header h3 { margin: 0 0 6px !important; font-size: 20px !important; font-weight: 800 !important; color: #111111 !important; line-height: 1.3 !important; }

/* Dynamic Grid Execution */
.gt-upsell-grid { 
    padding: 20px !important; overflow-y: auto !important; flex: 1 !important; 
    display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 15px !important; 
}
.gt-upsell-card {
    background: #ffffff !important; border: 1px solid #eaeaea !important; border-radius: 12px !important;
    padding: 15px 10px !important; cursor: pointer !important; transition: all 0.2s ease !important;
    display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important;
    position: relative !important; box-sizing: border-box !important;
}
.gt-upsell-card .gt-upsell-check {
    position: absolute !important; top: 12px !important; right: 12px !important; margin: 0 !important; padding: 0 !important;
}
.gt-upsell-card:hover { border-color: #cccccc !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important; }
.gt-upsell-card.is-selected { border-color: #28a745 !important; background: #f4fdf6 !important; box-shadow: 0 0 0 1px #28a745 !important; }

.gt-upsell-img-wrap { width: 65px !important; height: 65px !important; margin: 0 auto 10px !important; flex-shrink: 0 !important; }
.gt-upsell-img-wrap img { width: 100% !important; height: 100% !important; border-radius: 8px !important; object-fit: cover !important; display: block !important; }

.gt-upsell-title { font-size: 14px !important; margin: 0 0 6px !important; color: #111111 !important; font-weight: 700 !important; line-height: 1.3 !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gt-upsell-price { font-size: 14px !important; font-weight: bold !important; color: #d2232a !important; display: block !important; }

.gt-upsell-footer { padding: 20px !important; text-align: center !important; border-top: 1px solid #eeeeee !important; background: #ffffff !important; display: flex !important; gap: 10px !important; }

/* ============================================================
   4. DELIVERY WORKFLOW INPUTS
   ============================================================ */
.gtu-clean-input, .gtu-clean-select {
    display: block !important; width: 100% !important; height: 50px !important; padding: 10px 15px !important;
    font-size: 16px !important; border: 1px solid #cccccc !important; border-radius: 12px !important;
    background: #ffffff !important; color: #333333 !important; margin-bottom: 15px !important; pointer-events: auto !important;
}
.gtu-type-label {
    display: block !important; background: #ffffff !important; padding: 14px !important; border: 1px solid #dddddd !important;
    border-radius: 12px !important; cursor: pointer !important; font-weight: 600 !important; margin-bottom: 10px !important; transition: 0.2s !important;
}
.gtu-type-label:has(input:checked) { border-color: #d2232a !important; background: #fffafa !important; color: #d2232a !important; }
.gtu-type-label input { margin-right: 10px !important; accent-color: #d2232a !important; }

/* ============================================================
   5. HEADER SQUISH PROTECTION (MOBILE SAFE)
   ============================================================ */
.gt-user-greeting, .gt-user-greeting a, .gtu-header-location-btn { white-space: nowrap !important; word-break: keep-all !important; flex-shrink: 0 !important; }
@media (max-width: 768px) {
    .gtu-header-location-btn { max-width: 145px !important; }
    .gtu-header-pincode-text { max-width: 75px !important; overflow: hidden !important; text-overflow: ellipsis !important; }
    .gt-user-greeting { font-size: 12px !important; }
    .gt-upsell-grid { padding: 12px !important; grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
    #gt-upsell-content { width: 94% !important; }
}