/* Geenius Cookie Consent - Base styles (variables CSS provided by inline dynamic CSS) */

.gn-consent {
    font-family: var(--gcc-font, inherit);
    box-sizing: border-box;
}

.gn-consent *,
.gn-consent *::before,
.gn-consent *::after {
    box-sizing: border-box;
}

/* Overlay */
.gn-consent__overlay {
    position: fixed;
    inset: 0;
    background: var(--gcc-overlay);
    z-index: var(--gcc-z-overlay, 99998);
    display: none;
}
.gn-consent__overlay.is-open { display: block; }

/* Overlay solo en mobile/desktop */
@media (max-width: 640px) {
    .gn-overlay-desktop-only.is-open { display: none !important; }
}
@media (min-width: 641px) {
    .gn-overlay-mobile-only.is-open { display: none !important; }
}

/* Panel */
.gn-consent__panel {
    background: var(--gcc-bg);
    color: var(--gcc-text);
    border-radius: var(--gcc-radius);
    padding: var(--gcc-padding);
    box-shadow: var(--gcc-shadow);
    display: flex;
    flex-direction: column;
    gap: var(--gcc-gap);
    height: var(--gcc-height, auto);
    max-height: 100vh;
    overflow-y: auto;
}

/* El contenido tambien usa el gap entre titulo / texto / acciones */
.gn-consent__content {
    display: flex;
    flex-direction: column;
    gap: var(--gcc-gap);
    text-align: var(--gcc-content-align, left);
    align-items: var(--gcc-content-align-items, stretch);
    justify-content: var(--gcc-content-justify, flex-start);
    flex: 1;
}

@media (max-width: 640px) {
    .gn-consent__panel {
        height: var(--gcc-mobile-height, var(--gcc-height, auto));
    }
}

/* Hidden panels (vista que no es la activa) */
.gn-consent__panel[hidden] {
    display: none !important;
}

/* Title */
.gn-consent h2 {
    margin: 0;
    font-size: var(--gcc-fs-title);
    font-weight: var(--gcc-fw-title);
    color: var(--gcc-text);
    line-height: 1.3;
}

/* Text */
.gn-consent p {
    margin: 0;
    font-size: var(--gcc-fs-text);
    font-weight: var(--gcc-fw-text);
    line-height: var(--gcc-lh-text);
    color: var(--gcc-text-muted);
}

.gn-consent a {
    color: var(--gcc-link);
    text-decoration: underline;
}

/* Actions */
.gn-consent__actions {
    display: flex;
    flex-direction: var(--gcc-actions-direction, row);
    gap: var(--gcc-btn-gap, 8px);
    justify-content: var(--gcc-actions-justify, flex-end);
    flex-wrap: wrap;
    margin-top: 0;
}

/* Credit (Desarrollado por...) */
.gn-consent__credit {
    margin-top: 4px;
    font-size: 11px;
    color: var(--gcc-credit-color, var(--gcc-text-muted));
    opacity: 0.75;
    line-height: 1.4;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: opacity .2s;
}

.gn-consent__credit:hover { opacity: 1; }

.gn-consent__credit a {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.gn-consent__credit a:hover {
    text-decoration: underline;
}

.gn-consent__credit-logo {
    height: 14px;
    width: auto;
    object-fit: contain;
    display: inline-block;
    vertical-align: middle;
}

.gn-credit-align-left   { justify-content: flex-start; }
.gn-credit-align-center { justify-content: center; }
.gn-credit-align-right  { justify-content: flex-end; }

/* Buttons */
.gn-btn {
    display: inline-block;
    padding: var(--gcc-btn-py) var(--gcc-btn-px);
    border-radius: var(--gcc-btn-radius);
    border-width: var(--gcc-btn-border-w);
    border-style: solid;
    font-size: var(--gcc-fs-button);
    font-weight: var(--gcc-fw-button);
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
    line-height: 1;
    font-family: inherit;
}

.gn-btn--primary {
    background: var(--gcc-btn-pri-bg);
    color: var(--gcc-btn-pri-color);
    border-color: var(--gcc-btn-pri-border);
}
.gn-btn--primary:hover {
    background: var(--gcc-btn-pri-bg-hover);
}

.gn-btn--ghost {
    background: var(--gcc-btn-sec-bg);
    color: var(--gcc-btn-sec-color);
    border-color: var(--gcc-btn-sec-border);
}
.gn-btn--ghost:hover {
    background: var(--gcc-btn-sec-bg-hover);
}

/* Config view (toggles) */
.gn-consent__group {
    padding: 12px 0;
    border-top: 1px solid var(--gcc-border);
}
.gn-consent__group:first-child {
    border-top: 0;
    padding-top: 0;
}

.gn-toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.gn-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.gn-toggle__track {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    background: #cbd5e1;
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}

.gn-toggle__track::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 50%;
    transition: transform .2s;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}

.gn-toggle input:checked + .gn-toggle__track {
    background: var(--gcc-btn-pri-bg);
}

.gn-toggle input:checked + .gn-toggle__track::before {
    transform: translateX(18px);
}

.gn-toggle input:disabled + .gn-toggle__track {
    background: #94a3b8;
}
.gn-toggle input:disabled + .gn-toggle__track::before {
    transform: translateX(18px);
}

.gn-toggle__label {
    font-size: var(--gcc-fs-text);
    color: var(--gcc-text);
}

.gn-consent__group p {
    margin: 6px 0 0 52px;
    font-size: 13px;
    color: var(--gcc-text-muted);
}

/* Hidden state */
.gn-consent[aria-hidden="true"]:not(.is-open) {
    display: none;
}

/* Accessibility */
.gn-btn:focus-visible {
    outline: 2px solid var(--gcc-btn-pri-bg);
    outline-offset: 2px;
}