/* static/css/components/footer.css */
/* Footer customization */
footer {
    background-color: var(--hoa-deep-purple);
    color: var(--bm-light-gray);
    padding: 2rem 0;
    margin-top: 2rem;
}

footer a.text-white:hover {
    color: var(--hoa-green-light) !important;
    text-decoration: none;
}

/* App footer - Dashboard specific styling */
footer.app-footer {
    padding: 1rem 0;
    background-color: var(--hoa-deep-purple);
    margin-top: auto;
    position: relative;
    z-index: 10;
}

/* Dashboard layout footer positioning */
@media (min-width: 768px) {
    /* Position footer to the right of sidebar */
    footer.app-footer {
        margin-left: 240px;
        width: calc(100% - 240px);
        background-color: var(--hoa-deep-purple);
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        position: relative;
        clear: both;
    }
}

@media (min-width: 1411px) {
    /* Large screens with wider sidebar */
    footer.app-footer {
        margin-left: 280px;
        width: calc(100% - 280px);
        position: relative;
        clear: both;
    }
}

@media (max-width: 767px) {
    /* Mobile - full width footer */
    footer.app-footer {
        margin-left: 0;
        width: 100%;
        position: relative;
        clear: both;
    }
}

/* Ensure footer is visible and properly positioned on board dashboard */
body.board-dashboard-page footer.app-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    clear: both !important;
    color: var(--bm-light-gray) !important;
    background-color: var(--hoa-deep-purple) !important;
}

body.board-dashboard-page footer.app-footer p,
body.board-dashboard-page footer.app-footer a {
    color: var(--bm-light-gray) !important;
}

body.board-dashboard-page footer.app-footer a.text-white {
    color: #ffffff !important;
}

/* Board dashboard doesn't use sidebar layout, so footer should be full-width */
@media (min-width: 768px) {
    body.board-dashboard-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (min-width: 1411px) {
    body.board-dashboard-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* Ensure footer is visible and properly positioned on emails dashboard */
body.emails-dashboard-page footer.app-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    clear: both !important;
    color: var(--bm-light-gray) !important;
    background-color: var(--hoa-deep-purple) !important;
}

body.emails-dashboard-page footer.app-footer p,
body.emails-dashboard-page footer.app-footer a {
    color: var(--bm-light-gray) !important;
}

body.emails-dashboard-page footer.app-footer a.text-white {
    color: #ffffff !important;
}

/* Emails dashboard doesn't use sidebar layout, so footer should be full-width */
@media (min-width: 768px) {
    body.emails-dashboard-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (min-width: 1411px) {
    body.emails-dashboard-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* Ensure footer is visible and properly positioned on emails templates page */
body.emails-templates-page footer.app-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    clear: both !important;
    color: var(--bm-light-gray) !important;
    background-color: var(--hoa-deep-purple) !important;
}

body.emails-templates-page footer.app-footer p,
body.emails-templates-page footer.app-footer a {
    color: var(--bm-light-gray) !important;
}

body.emails-templates-page footer.app-footer a.text-white {
    color: #ffffff !important;
}

/* Emails templates page doesn't use sidebar layout, so footer should be full-width */
@media (min-width: 768px) {
    body.emails-templates-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (min-width: 1411px) {
    body.emails-templates-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* Ensure footer is visible and properly positioned on emails test page */
body.emails-test-page footer.app-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    clear: both !important;
    color: var(--bm-light-gray) !important;
    background-color: var(--hoa-deep-purple) !important;
}

body.emails-test-page footer.app-footer p,
body.emails-test-page footer.app-footer a {
    color: var(--bm-light-gray) !important;
}

body.emails-test-page footer.app-footer a.text-white {
    color: #ffffff !important;
}

/* Emails test page doesn't use sidebar layout, so footer should be full-width */
@media (min-width: 768px) {
    body.emails-test-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (min-width: 1411px) {
    body.emails-test-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* Ensure footer is visible and properly positioned on emails bulk page */
body.emails-bulk-page footer.app-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    clear: both !important;
    color: var(--bm-light-gray) !important;
    background-color: var(--hoa-deep-purple) !important;
}

body.emails-bulk-page footer.app-footer p,
body.emails-bulk-page footer.app-footer a {
    color: var(--bm-light-gray) !important;
}

body.emails-bulk-page footer.app-footer a.text-white {
    color: #ffffff !important;
}

/* Emails bulk page doesn't use sidebar layout, so footer should be full-width */
@media (min-width: 768px) {
    body.emails-bulk-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (min-width: 1411px) {
    body.emails-bulk-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

/* Ensure footer is visible and properly positioned on emails preview all page */
body.emails-preview-all-page footer.app-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 0 !important;
    width: 100% !important;
    position: relative !important;
    clear: both !important;
    color: var(--bm-light-gray) !important;
    background-color: var(--hoa-deep-purple) !important;
}

body.emails-preview-all-page footer.app-footer p,
body.emails-preview-all-page footer.app-footer a {
    color: var(--bm-light-gray) !important;
}

body.emails-preview-all-page footer.app-footer a.text-white {
    color: #ffffff !important;
}

/* Emails preview all page doesn't use sidebar layout, so footer should be full-width */
@media (min-width: 768px) {
    body.emails-preview-all-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}

@media (min-width: 1411px) {
    body.emails-preview-all-page footer.app-footer {
        margin-left: 0 !important;
        width: 100% !important;
    }
}