/*
 * @author    TEMA S.r.l. Development Team
 * @copyright 2026-present TEMA S.r.l. Automazione
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0
 *
 * TEMA S.r.l. Automazione
 * Via Carlo Juker 28, 20025 Legnano (Milano), Italy
 * Tel. +39 0331 467111 - tema@temanet.it
 */

/* Base banner container: colors and dimensions come from CSS custom
   properties set inline by the template, values are chosen in the back
   office. */
#athena-cookiebanner {
    position: fixed;
    z-index: 99999;
    font-size: 14px;
    background: var(--acb-bg, #222222);
    color: var(--acb-text, #ffffff);
    border: 1px solid var(--acb-border, #444444);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}

#athena-cookiebanner.athena-cookiebanner-hidden {
    display: none;
}

#athena-cookiebanner a {
    color: inherit;
    text-decoration: underline;
}

.athena-cookiebanner-inner {
    padding: var(--acb-padding, 16px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
}

.athena-cookiebanner-text {
    flex: 1 1 280px;
}

.athena-cookiebanner-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.athena-cookiebanner-actions button {
    cursor: pointer;
    border: 1px solid transparent;
    background: transparent;
    color: inherit;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    transition: opacity .15s ease;
}

/* Hover: darkens the merchant's own button color, no extra setting. */
.athena-cookiebanner-actions button:hover {
    filter: brightness(0.88);
}

#athena-cookiebanner-customize {
    background: var(--acb-customize-bg, #222222);
    color: var(--acb-customize-text, inherit);
    border-color: currentColor;
}

#athena-cookiebanner-reject {
    background: var(--acb-reject-bg, #222222);
    color: var(--acb-reject-text, inherit);
    border-color: currentColor;
}

#athena-cookiebanner-accept {
    background: var(--acb-accept-bg, #ffffff);
    color: var(--acb-accept-text, #222222);
}

#athena-cookiebanner-save {
    background: var(--acb-save-bg, #ff6600);
    color: var(--acb-save-text, #ffffff);
}

/* --- Positions ---------------------------------------------------- */

#athena-cookiebanner.acb-position-bottom {
    left: 0;
    right: 0;
    bottom: 0;
}

#athena-cookiebanner.acb-position-top {
    left: 0;
    right: 0;
    top: 0;
}

#athena-cookiebanner.acb-position-floating_bc,
#athena-cookiebanner.acb-position-floating_tc,
#athena-cookiebanner.acb-position-floating_bl,
#athena-cookiebanner.acb-position-floating_br,
#athena-cookiebanner.acb-position-floating_tl,
#athena-cookiebanner.acb-position-floating_tr {
    max-width: min(var(--acb-max-width, 1200px), calc(100vw - 32px));
}

/* Centered floating positions: horizontally centered with a transform
   instead of left/right, so they stay centered regardless of their
   (variable, back-office-configured) width. */
#athena-cookiebanner.acb-position-floating_bc,
#athena-cookiebanner.acb-position-floating_tc {
    left: 50%;
    transform: translateX(-50%);
}

#athena-cookiebanner.acb-position-floating_bc {
    bottom: 16px;
}

#athena-cookiebanner.acb-position-floating_tc {
    top: 16px;
}

#athena-cookiebanner.acb-position-floating_bl {
    left: 16px;
    bottom: 16px;
}

#athena-cookiebanner.acb-position-floating_br {
    right: 16px;
    bottom: 16px;
}

#athena-cookiebanner.acb-position-floating_tl {
    left: 16px;
    top: 16px;
}

#athena-cookiebanner.acb-position-floating_tr {
    right: 16px;
    top: 16px;
}

/* --- Shapes --------------------------------------------------------- */

#athena-cookiebanner.acb-shape-bar {
    border-radius: 0;
    border-width: 2px 0 0 0;
}

#athena-cookiebanner.acb-position-top.acb-shape-bar {
    border-width: 0 0 2px 0;
}

/* Full-width positions (top/bottom) always keep the inner content centered
   and capped at the configured max width, regardless of shape - otherwise
   a "Box" or "Pill" shape would stretch edge-to-edge and lose its intended
   compact look. Floating positions already constrain the outer container
   itself (see the acb-position-floating_* rules above), so they don't need
   this rule too. */
#athena-cookiebanner.acb-position-top .athena-cookiebanner-inner,
#athena-cookiebanner.acb-position-bottom .athena-cookiebanner-inner {
    max-width: var(--acb-max-width, 1200px);
    margin: 0 auto;
}

#athena-cookiebanner.acb-shape-box {
    border-radius: var(--acb-radius, 8px);
}

#athena-cookiebanner.acb-shape-pill {
    border-radius: 999px;
}

#athena-cookiebanner.acb-shape-pill .athena-cookiebanner-inner {
    padding-left: calc(var(--acb-padding, 16px) * 1.5);
    padding-right: calc(var(--acb-padding, 16px) * 1.5);
}

/* --- Preferences modal ----------------------------------------------- */

#athena-cookiebanner-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .55);
    background: color-mix(in srgb, var(--acb-overlay, #000000) 55%, transparent);
}

#athena-cookiebanner-modal.athena-cookiebanner-hidden {
    display: none;
}

.athena-cookiebanner-modal-box {
    position: relative;
    background: var(--acb-modal-bg, #ffffff);
    color: #222222;
    padding: 24px;
    border-radius: var(--acb-radius, 8px);
    max-width: 400px;
    width: 90%;
    max-height: 85vh;
    overflow-y: auto;
}

.athena-cookiebanner-modal-box h3 {
    margin: 0 0 16px 0;
    padding-right: 24px;
    font-size: 16px;
}

/* Modal close button. Inherits the modal text color. */
.athena-cookiebanner-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: none;
    background: transparent;
    color: inherit;
    font-size: 20px;
    border-radius: 4px;
}

.athena-cookiebanner-modal-close:hover {
    /* Tint from currentColor: readable on light and dark backgrounds. */
    background: color-mix(in srgb, currentColor 15%, transparent);
}

.athena-cookiebanner-cat-row {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 8px;
    margin-bottom: 14px;
}

.athena-cookiebanner-cat-row input {
    margin-top: 3px;
}

.athena-cookiebanner-cat-label {
    font-weight: 600;
    display: block;
}

.athena-cookiebanner-cat-desc {
    display: block;
    grid-column: 2;
    font-size: 12px;
    opacity: .75;
}

.athena-cookiebanner-modal-box .athena-cookiebanner-actions {
    margin-top: 8px;
    justify-content: flex-end;
}