/**
 * NB Cookie Consent Pro - Classic Banner (bottom)
 * Display Type: banner
 * Version: 1.8.9
 */

/* Classic Banner (bottom) - Edge-to-edge, 100% width */
.cookie-consent-banner {
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
}

.cookie-consent-banner .cookie-consent-content {
    max-width: none;  /* Override default max-width: 500px */
    width: 100%;      /* Force 100% width */
    max-height: 50vh; /* Prevent taking up too much vertical space */
    border-radius: 0; /* Sharp corners for edge-to-edge feel */
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* Top shadow only */
}

/* Classic Banner - Adjust button spacing */
.cookie-consent-banner .cookie-consent-buttons {
    gap: 5px;
}

/* Banner: 1-button mode gets centered */
.cookie-consent-banner .cookie-consent-buttons.button-mode-1 {
    justify-content: center;
}

/* Desktop: buttons width for multi-button modes */
@media (min-width: 769px) {
    /* Classic Banner - Desktop: 40% width centered container */
    .cookie-consent-banner .cookie-consent-buttons.button-mode-2,
    .cookie-consent-banner .cookie-consent-buttons.button-mode-3 {
        width: 40%;
        margin: 0 auto;
    }

    /* 2-button mode: each button takes equal space */
    .cookie-consent-banner .cookie-consent-buttons.button-mode-2 button {
        flex: 1;
        max-width: none;
    }

    /* 3-button mode: buttons share space equally */
    .cookie-consent-banner .cookie-consent-buttons.button-mode-3 button {
        flex: 1;
        max-width: none;
    }
}

/* Mobile Responsive */
@media (max-width: 600px) {
    /* Classic Banner on mobile - keep 100% width */
    .cookie-consent-banner {
        bottom: 0;
        left: 0;
        right: 0;
        padding: 0;
    }

    .cookie-consent-banner .cookie-consent-content {
        margin: 0;
        padding: 18px 16px;
        padding-top: 40px;
        max-width: none;
        width: 100%;
    }

    /* Classic Banner mobile - buttons match message width exactly */
    .cookie-consent-banner .cookie-consent-buttons.button-mode-2,
    .cookie-consent-banner .cookie-consent-buttons.button-mode-3 {
        display: flex;
        justify-content: space-between;
    }

    .cookie-consent-banner .cookie-consent-buttons.button-mode-2 button,
    .cookie-consent-banner .cookie-consent-buttons.button-mode-3 button {
        flex: 1;
        min-width: 80px;
        padding: 10px 12px;
        font-size: 12px;
    }

    /* 1-Button Mode on mobile: adjust size */
    .cookie-consent-banner .cookie-consent-buttons.button-mode-1 button {
        min-width: 180px;
        max-width: 250px;
    }
}