/*
 * Style « Verre » : surfaces translucides et floutées, reflets lumineux,
 * navigation flottante.
 */

:root,
[data-theme="default"] {
    --rb-border-global: 18px;
    --rb-border-button: 12px;
    --rb-glass-bg: hsla(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l), .38);
    --rb-glass-border: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), .14);
    --rb-glass-shadow: 0 10px 34px rgba(0, 0, 0, .35), inset 0 1px 0 hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), .08);
}

html body .banner,
html body .card,
html body .table--custom .table-row,
html body .accordion-item,
html body .list-group-item,
html body .dropdown-menu,
html body .modal-content,
html body .alert {
    border: 1px solid var(--rb-glass-border);
    background-color: var(--rb-glass-bg);
    background-image: linear-gradient(135deg, hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), .06), transparent 45%);
    box-shadow: var(--rb-glass-shadow);
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
}

html body .card,
html body .banner,
html body .modal-content {
    border-radius: var(--rb-border-global);
}

html body .alert.alert-success { background-color: hsla(var(--color-success-h), var(--color-success-s), var(--color-success-l), .55); }
html body .alert.alert-warning { background-color: hsla(var(--color-warning-h), var(--color-warning-s), var(--color-warning-l), .55); }
html body .alert.alert-danger { background-color: hsla(var(--color-error-h), var(--color-error-s), var(--color-error-l), .55); }
html body .alert.alert-info { background-color: hsla(var(--color-info-h), var(--color-info-s), var(--color-info-l), .55); }

/* Bandeaux de titre : reflet et liseré lumineux */
html body .banner {
    position: relative;
}

html body .banner::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: 0;
    left: 18px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
    opacity: .8;
}

html body .card-header,
html body .card-footer {
    border-color: var(--rb-glass-border);
    background-color: transparent;
}

/* Boutons : dégradé et halo */
html body .btn {
    border-radius: var(--rb-border-button);
}

html body .btn-primary {
    border-color: transparent;
    background-image: linear-gradient(135deg, var(--color-primary-light), var(--color-primary-dark));
    box-shadow: 0 6px 20px -6px hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), .7);
}

html body .btn-primary:hover {
    background-image: linear-gradient(135deg, var(--color-primary), var(--color-primary-darker));
}

/* Navigation flottante */
html body .header .navbar {
    margin: 10px auto 0;
    width: calc(100% - 24px);
    border: 1px solid var(--rb-glass-border);
    border-radius: 18px;
    background-image: none;
    background-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), .55);
    box-shadow: var(--rb-glass-shadow);
    backdrop-filter: blur(16px) saturate(150%);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
}

html body .footer .footer--top {
    border-top: 1px solid var(--rb-glass-border);
    background-color: var(--rb-glass-bg);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

html body .form-control,
html body .form-select {
    border-color: var(--rb-glass-border);
    border-radius: 12px;
    background-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), .5);
}