#chatbot-modal-body h2 {
    position: relative;
    padding-left: 185px; /* leave room for the logo */
    margin-top: -0.1px;
    display: flex;
    color: #005ea5;
    align-items: center;
}

#chatbot-modal-body h2::before {
    content: "";
    background: url('/themes/custom/ita/logo.svg') no-repeat left center;
    background-size: 163px auto;
    width: 180px;
    height: 70px; /* adjust depending on your logo's height ratio */
    position: absolute;
    left: 0;
}
.webchat__bubble__content {
    width: 1000px !important;
}

div.webchat__bubble__content {
    display: none !important;
}

.ac-container, .ac-adaptiveCard {
    display: none;
}
/* Keep your existing h3 style (slim, centered) */
h3 {
    font-family: "Condensed Thin", Arial, Verdana, sans-serif !important;
    font-weight: 700;
    font-style: normal;
    line-height: 1.5;
    color: #000000;
    font-size: 24px;
    text-align: left;
}

/* Body text sizes (preserve baseline, slightly tuned) */
#chatbot-disclaimer-text,
#chatbot-disclaimer-text-second {
    font-weight: 400;
    font-size: 13px; /* slightly larger for readability */
    line-height: 1.45;
    color: #222;
    margin: 0 0 12px 0;
}

/* Modal overlay: dark + blur backdrop */
.chatbot-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;

    /* darker overlay */
    background-color: rgba(0, 0, 0, 0.65);

    /* blur background when supported (progressive enhancement) */
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);

    /* ensure overlay intercepts clicks */
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* Modal content: rounded, generous padding, elegant shadow */
.chatbot-modal-content {
    background-color: #fff;
    margin: 6% auto;           /* move a bit higher on the screen */
    padding: 22px 26px;
    border-radius: 12px;       /* rounded corners */
    border: 1px solid rgba(136,136,136,0.15);
    width: 90%;
    /*max-width: 720px;*/
    box-shadow: 0 10px 30px rgba(0,0,0,0.35); /* deeper, softer shadow */
    transition: transform .18s ease, opacity .18s ease;
    transform-origin: center top;
    font-family: "Arial", "Helvetica", sans-serif;
    color: #111;
    box-sizing: border-box;
}

/* Slight scale effect when shown (if you add via JS you can toggle a class) */
.chatbot-modal.show .chatbot-modal-content {
    transform: translateY(0) scale(1);
    opacity: 1;
}

/* Close button: larger hit area and clearer */
.chatbot-modal-close {
    color: #666;
    float: right;
    font-size: 26px;
    font-weight: 700;
    cursor: pointer;
    padding: 6px;
    line-height: 1;
    border-radius: 6px;
}
.chatbot-modal-close:hover,
.chatbot-modal-close:focus {
    color: #222;
    background: rgba(0,0,0,0.04);
    text-decoration: none;
    outline: none;
}

/* Muted first-step disclaimer (soft gray + subtle blur/opacity) */
#chatbot-disclaimer-text {
    color: #6b6b6b;          /* gray color */
    opacity: 0.95;
    font-size: 12.5px;
    /* very subtle softening — tiny blur is optional; keep minimal */
    filter: blur(0.2px);
    -webkit-filter: blur(0.2px);
    margin-bottom: 14px;
}

/* Second-step disclaimer: crisp/normal (override any muted styling) */
#chatbot-disclaimer-text-second {
    color: #222;
    opacity: 1;
    filter: none;
    -webkit-filter: none;
    font-size: 13px;
    margin-bottom: 14px;
}

/* Recaptcha container spacing */
#chatbot-recaptcha-form {
    margin-top: 6px;
    margin-bottom: 12px;
}

/* Buttons layout inside form — keep visible and accessible */
.disclaimer-actions, .disclaimer-buttons, .disclaimer-buttons .form-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 14px;
}

/* Generic button styling that doesn't conflict with Drupal theme */
.chatbot-modal-content input[type="submit"],
.chatbot-modal-content button,
.chatbot-modal-content .button {
    padding: 10px 16px;
    font-size: 13px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    background-color: #0b69ff; /* primary blue, tweak to match site if needed */
    color: #fff;
    box-shadow: 0 3px 8px rgba(11,105,255,0.18);
    transition: transform .08s ease, box-shadow .12s ease, background-color .12s ease;
}
.chatbot-modal-content input[type="submit"]:hover,
.chatbot-modal-content button:hover,
.chatbot-modal-content .button:hover {
    transform: translateY(-1px);
    background-color: #0858d6;
}

/* Cancel button: ghost style */
.chatbot-modal-content button.chatbot-cancel,
.chatbot-modal-content input.chatbot-cancel[type="button"] {
    background-color: transparent;
    color: #444;
    border: 1px solid rgba(0,0,0,0.08);
    box-shadow: none;
}
.chatbot-modal-content button.chatbot-cancel:hover {
    background-color: rgba(0,0,0,0.03);
}

/* Ensure recaptcha control area is clearly visible on mobile */
@media (max-width: 480px) {
    .chatbot-modal-content {
        margin: 8% 12px;
        padding: 18px;
    }
    .chatbot-modal-content input[type="submit"],
    .chatbot-modal-content button {
        width: auto;
        padding: 10px 14px;
        font-size: 14px;
    }
    #chatbot-disclaimer-text,
    #chatbot-disclaimer-text-second {
        font-size: 12px;
    }
}

/* Accessibility: focus outlines for keyboard users */
.chatbot-modal-content a:focus,
.chatbot-modal-content button:focus,
.chatbot-modal-content input:focus {
    outline: 3px solid rgba(11,105,255,0.18);
    outline-offset: 2px;
}

/* Minor helper: center modal vertically on larger screens */
@media (min-width: 900px) {
    .chatbot-modal-content {
        margin: 6% auto;
    }
}

/* Keep old rules as a fallback if anything else references them */
.chatbot-modal .chatbot-modal-content {
    /* intentionally left to keep compatibility */
}
/* Expand chatbot container */
.chatbot-container {
    width: 90% !important;
    max-width: 90% !important;
    height: 700px !important;
    margin: 0 auto;
    display: block;
}

/* First step disclaimer styling */
#chatbot-disclaimer-text {
    color: #999;           /* Light gray text */
    filter: blur(1.2px);   /* Slight blur */
    opacity: 0.7;          /* Make it lighter */
    line-height: 1.4em;
    font-size: 12px;
    margin-bottom: 15px;
}

/* Center the reCAPTCHA inside the modal */
#chatbot-recaptcha-form {
    display: flex;
    justify-content: center;  /* horizontal center */
    margin-top: 15px;         /* optional spacing above */
    margin-bottom: 15px;      /* optional spacing below */
}

/* Center the action buttons (Cancel + Continue) */
#chatbot-disclaimer-form-container .disclaimer-wrapper {
    display: flex;
    justify-content: center;  /* center horizontally */
    gap: 15px;                /* space between buttons */
    margin-top: 15px;         /* optional spacing from text above */
}

/* Modal Close Button */
.chatbot-modal-close {
    display: inline-block;
    background-color: #f5f5f5;
    color: #333;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-weight: bold;
    padding: 2px 8px;
    cursor: pointer;
    text-align: center;
    float: right;
}

.chatbot-modal-close:hover,
.chatbot-modal-close:focus {
    background-color: #e0e0e0;
    color: #000;
    text-decoration: none;
}

/* v1.6.0: chatbot iframe sizing inside modal */
.ita-pva-chatbot-iframe {
    width: 100% !important;
    height: 600px !important;
    border: none !important;
}
.ita-pva-chatbot-wrapper {
    width: 1000px;
    max-width: 100%;
    box-sizing: border-box;
}

/* Step 3 full-window cosy modal */
.step3-popup {
    position: fixed;
    top: 5%;
    left: 50%;
    transform: translateX(-50%);
    width: 90vw;          /* almost full width */
    height: 90vh;         /* almost full height */
    background: #fff;
    border-radius: 1rem;  /* cosy rounded corners */
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.3);
    padding: 2rem;
    overflow-y: auto;     /* make content scrollable */
    scrollbar-gutter: stable; /* keeps space for scrollbar */
    z-index: 1000;
}

/* Obvious right-side scrollbar styling */
.step3-popup::-webkit-scrollbar {
    width: 14px;
}
.step3-popup::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 8px;
}
.step3-popup::-webkit-scrollbar-thumb {
    background: #bbb;
    border-radius: 8px;
}
.step3-popup::-webkit-scrollbar-thumb:hover {
    background: #999;
}