* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            -webkit-tap-highlight-color: transparent;
        }

        /* FAB Container */
        .fab-container {
            position: fixed;
bottom: 77px;
    right: 32px;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            z-index: 9999;
        }

        /* Options Wrapper */
        .fab-options-wrapper {
            background: #fff;
            border-radius: 28px;
            box-shadow: 0 20px 35px -12px rgba(0,0,0,0.25);
            margin-bottom: 16px;
            overflow: hidden;
            width: 110px;
            padding: 8px 0;
            opacity: 0;
            visibility: hidden;
            transform: scale(0.9);
            transition: opacity 0.2s, visibility 0s linear 0.2s, transform 0.2s;
        }

        .fab-container.active .fab-options-wrapper {
            opacity: 1;
            visibility: visible;
            transform: scale(1);
            transition: visibility 0s, opacity 0.2s, transform 0.25s;
        }

        /* Option Card */
        .option-card {
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 10px 8px;
            cursor: pointer;
            /* background: white; */
            font-family: 'Poppins', sans-serif;
            transition: background 0.2s;
            opacity: 0;
            transform: translateY(10px);
            visibility: hidden;
            transition: opacity 0.3s cubic-bezier(0.2,0.9,0.4,1.2), transform 0.3s, visibility 0s linear 0.3s;
        }

        .fab-container.active .option-card {
            opacity: 1;
            transform: translateY(0);
            visibility: visible;
        }

        .option-card:not(:last-child) { border-bottom: 1px solid #e2e8f0; }
        .option-card:hover { background: #faf9fe; }

        .option-card .card-icon { font-size:38px; color: #dc2626; margin-bottom: 6px; }
        .option-card .card-label { font-weight: 600; font-size: 11px; color: #0f172a; text-align: center; }

        /* FAB Main Button */
        .fab-main {
            width: 50px;
            height: 50px;
            background: #E60000;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            box-shadow: 0 10px 20px -5px rgba(190,18,60,0.4);
            color: white;
            font-size: 1.6rem;
            transition: transform 0.2s;
            border:1px solid #fff;
        }
        .fab-main:active { transform: scale(0.94); }
        .fab-container.active .fab-main i { transform: rotate(45deg); }
        .fab-main i { transition: transform 0.3s; }

        .fab-container.active .option-card:nth-child(1) { transition-delay: 0.15s; }
        .fab-container.active .option-card:nth-child(2) { transition-delay: 0.1s; }
        .fab-container.active .option-card:nth-child(3) { transition-delay: 0.05s; }
        .fab-container.active .option-card:nth-child(4) { transition-delay: 0s; }

        /* WhatsApp Popup */
        .popup-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.5);
            backdrop-filter: blur(3px);
            z-index: 200;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.3s, visibility 0s linear 0.3s;
        }
        .popup-overlay.active { opacity: 1; visibility: visible; transition: opacity 0.3s, visibility 0s; z-index: 99999; }

        .whatsapp-card, .support-card {
            position: absolute;
            bottom: 80px;
            right: 20px;
            width: 360px;
            max-width: calc(100vw - 40px);
            background: #fff;
            border-radius: 20px;
            box-shadow: 0 25px 50px -12px rgba(0,0,0,0.4);
            overflow: hidden;
            animation: slideUp 0.3s ease;
            display: flex;
            flex-direction: column;
        }
        .support-card { width: 360px; bottom:5px;}

        @keyframes slideUp {
            from { opacity: 0; transform: translateY(30px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* WhatsApp Header */
        .wa-header, .support-header {
            background: #b40c00;
            padding: 16px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: white;
        }
        .wa-left { display: flex; align-items: center; gap: 12px; }
        .wa-icon {
            width: 40px;
            height: 40px;
            background: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .wa-icon i { font-size: 24px; color: #25D366; }
        .wa-title { font-weight: 700; font-size: 22px; }
        .wa-badge { font-size: 10px; opacity: 0.9; }
        .close-icon { cursor: pointer; font-size: 18px; padding: 4px; }

        /* Messages */
        .messages-area {
            background: #f6f6f5;
            height: 280px;
            overflow-y: auto;
            padding: 16px;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }
        .bubble {
            background: white;
            padding: 10px 14px;
            border-radius: 16px;
            max-width: 80%;
            width: fit-content;
            font-size: 13px;
            font-family: 'Poppins', sans-serif;
            box-shadow: 0 1px 2px rgba(0,0,0,0.05);
            color:#000;
        }
        .bubble.user {
            background: #dcf8c5;
            align-self: flex-end;
        }
        .input-area {
            display: flex;
            padding: 12px;
            border-top: 1px solid #e4e4e7;
            gap: 10px;
        }
        .input-area input {
            flex: 1;
            border: none;
            outline: none;
            padding: 8px 0;
            font-family: 'Poppins', sans-serif;
        }
        .send-btn {
            color: #b40c00;
            font-size: 22px;
            cursor: pointer;
        }

        /* Support Form */
        .support-card .support-header { padding: 14px 16px; }
        .support-card .support-header span { font-weight: 700; font-size: 20px; }
        .form-content { padding: 20px 20px 10px 20px; background: #f6f6f5; }
        .welcome-text { font-size: 13px; margin-bottom: 16px; color: #333; }
        .input-line { border-bottom: 1px solid #000; margin-bottom: 18px; }
        .input-line input, .input-line textarea {
            width: 100%;
            border: none;
            background: transparent;
            padding: 8px 4px;
            font-family: 'Poppins', sans-serif;
            outline: none;
            font-size: 13px;
        }
        .input-line textarea { resize: none; }
        .select-wrapper { position: relative; margin-bottom: 18px; }
.custom-select-2 {
    border-bottom: 1px solid #000;
    padding: 8px 24px 8px 4px;  /* ← add right padding to make room for arrow */
    display: flex;
    justify-content: space-between;
    cursor: pointer;
    font-size: 13px;
    font-family: 'Poppins', sans-serif;
    color: gray;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23808080' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-size: 16px 16px !important;  /* ← explicit width AND height */
    background-repeat: no-repeat !important; /* ← must have !important to override */
    background-position: right 4px top 50% !important; /* ← most explicit form */
}
        /* Black when an actual option is selected */
        #selectedInquiry{
            color:gray;
        }
#selectedInquiry.selected {
  color: #000000;
}
        .dropdown-options {
            position: absolute;
            top: 100%;
            left: 0;
            right: 0;
            background: white;
            border: 1px solid #ddd;
            display: none;
            z-index: 30;
        }
        .dropdown-options div { padding: 8px 12px; font-size: 12px; cursor: pointer; }
        .submit-btn {
            background: #b40c00;
            color: white;
            text-align: center;
            padding: 12px;
            border-radius: 40px;
            font-weight: 600;
            font-size: 12px;
            letter-spacing: 1.5px;
            margin: 16px 0 12px;
            cursor: pointer;
        }
        .secure { font-size: 8px; color: #a50020; text-align: center; border-top: 1px solid #ccc; padding-top: 12px; margin-top: 4px; }

        @media (max-width: 480px) {
            .whatsapp-card { width: 100%; }
            .support-card { width: 300px; }
            .wa-title { font-size: 18px; }}
.dropdown-placeholder {
    color: #999;
    cursor: default;
    pointer-events: none;
}
#selectedGrade {
    color: gray;
}
#selectedGrade.selected {
    color: #000000;
}