/* ========================================
   STREAMLIT CHATBOT PAGE STYLES
   Based on style.css - Dark mode only
   Uses style.css for all navigation styling
   ======================================== */

/* Override body padding for full-screen iframe */
body { 
    padding-top: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    height: 100vh !important;
}

html {
    overflow: hidden !important;
    height: 100vh !important;
}

/* Override nav to be fixed at top with no gaps */
nav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 !important;
}

/* Main content directly below nav with no gaps */
main {
    position: fixed !important;
    top: 70px !important; /* Height of nav bar on mobile */
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Adjust main top position for tablet/desktop nav sizes */
@media (min-width: 900px) {
    main {
        top: 78px !important; /* nav padding: 1.25rem = ~20px top + ~20px bottom + content ~38px */
    }
}

@media (min-width: 1024px) {
    main {
        top: 86px !important; /* nav padding: 1.5rem = ~24px top + ~24px bottom + content ~38px */
    }
}

/* Iframe fills main completely */
#chatbot-iframe {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   CONSENT MODAL
   ======================================== */
#consent-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.consent-modal {
    background: #0b1220;
    color: #F9FAFB;
    max-width: 720px;
    width: 92%;
    max-height: 90vh;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    border: 1px solid #1F293B;
    overflow-y: auto;
    overflow-x: hidden;
}

.consent-modal h2 {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px;
}

.consent-modal p {
    line-height: 1.6;
    margin: 0 0 12px;
}

.consent-modal p:first-of-type {
    color: #D1D5DB;
}

.consent-modal p:last-of-type {
    color: #9CA3AF;
    margin-bottom: 16px;
}

.consent-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    align-items: center;
}

.consent-actions a {
    color: #9CA3AF;
    text-decoration: none;
}

.consent-actions a:hover {
    color: #D1D5DB;
}

#consent-accept {
    background: #3B82F6;
    color: #fff;
    border: none;
    padding: 10px 14px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    transition: background 0.3s ease;
}

#consent-accept:hover {
    background: #2563eb;
}