/*
 * Système de boutons SOV3.
 * Référence : CHARTE_GRAPHIQUE.md.
 * Cette feuille est chargée après les styles historiques sur le site public
 * et dans l'administration afin de neutraliser leurs couleurs héritées.
 */
:root {
    --sdo-orange: #f47206;
    --sdo-orange-hover: #ff8520;
    --sdo-orange-dark: #d95f00;
    --sdo-page: #3f3f3f;
    --sdo-surface: #303030;
    --sdo-surface-deep: #272421;
    --sdo-border: #5b5b5b;
    --sdo-text: #f5f1ec;
    --sdo-text-muted: #d0cbc5;
}

body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]) {
    min-height: 44px;
    padding: .6rem 1rem;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    background-image: none !important;
    box-shadow: none !important;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none !important;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

body .sdo-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
}

body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]):hover {
    text-decoration: none !important;
    transform: translateY(-2px);
}

body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]):active,
body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]).active {
    transform: translateY(1px);
}

body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]):focus-visible {
    outline: 3px solid var(--sdo-orange-hover) !important;
    outline-offset: 3px;
}

body :is(.btn-sm, .sdo-btn--compact) {
    min-height: 36px;
    padding: .4rem .75rem;
}

body :is(.sdo-btn--icon, .convention-icon-button) {
    min-width: 40px;
    padding-right: .65rem;
    padding-left: .65rem;
}

/* Action principale : enregistrer, ajouter, valider, contacter. */
body :is(.sdo-btn--primary, .btn-primary, .btn-success, .btn-ored) {
    border-color: var(--sdo-orange) !important;
    background-color: var(--sdo-orange) !important;
    color: #fff !important;
}

body :is(.sdo-btn--primary, .btn-primary, .btn-success, .btn-ored):hover,
body :is(.sdo-btn--primary, .btn-primary, .btn-success, .btn-ored):focus {
    border-color: var(--sdo-orange-hover) !important;
    background-color: var(--sdo-orange-hover) !important;
    color: #fff !important;
}

body :is(.sdo-btn--primary, .btn-primary, .btn-success, .btn-ored):active,
body :is(.sdo-btn--primary, .btn-primary, .btn-success, .btn-ored).active {
    border-color: var(--sdo-orange-dark) !important;
    background-color: var(--sdo-orange-dark) !important;
}

/* Action secondaire : voir, modifier, revenir et actions de contexte. */
body :is(.sdo-btn--secondary, .btn-info, .btn-warning, .btn-outline-warning, .btn-outline-primary) {
    border-color: var(--sdo-orange) !important;
    background-color: var(--sdo-surface-deep) !important;
    color: var(--sdo-text) !important;
}

body :is(.sdo-btn--secondary, .btn-info, .btn-warning, .btn-outline-warning, .btn-outline-primary):hover,
body :is(.sdo-btn--secondary, .btn-info, .btn-warning, .btn-outline-warning, .btn-outline-primary):focus {
    border-color: var(--sdo-orange-hover) !important;
    background-color: var(--sdo-orange) !important;
    color: #fff !important;
}

body :is(.sdo-btn--secondary, .btn-info, .btn-warning, .btn-outline-warning, .btn-outline-primary):active,
body :is(.sdo-btn--secondary, .btn-info, .btn-warning, .btn-outline-warning, .btn-outline-primary).active {
    border-color: var(--sdo-orange-dark) !important;
    background-color: var(--sdo-orange-dark) !important;
    color: #fff !important;
}

/* Action neutre : annuler et fermer. */
body :is(.sdo-btn--neutral, .btn-secondary, .btn-light) {
    border-color: var(--sdo-border) !important;
    background-color: transparent !important;
    color: var(--sdo-text-muted) !important;
}

body :is(.sdo-btn--neutral, .btn-secondary, .btn-light):hover,
body :is(.sdo-btn--neutral, .btn-secondary, .btn-light):focus {
    border-color: var(--sdo-text-muted) !important;
    background-color: var(--sdo-surface-deep) !important;
    color: var(--sdo-text) !important;
}

body :is(.sdo-btn--neutral, .btn-secondary, .btn-light):active,
body :is(.sdo-btn--neutral, .btn-secondary, .btn-light).active {
    border-color: var(--sdo-orange) !important;
    background-color: var(--sdo-surface-deep) !important;
    color: var(--sdo-text) !important;
}

/*
 * Déclencheur de suppression : graphite, contour orange et pictogramme.
 * L'action finale du modal utilise séparément .sdo-btn--delete-confirm.
 */
body :is(.sdo-btn--delete-trigger, .btn-danger, .btn-outline-danger, .maintenance-admin__button--danger-soft, .admin-dog-photo__delete) {
    border-color: var(--sdo-orange) !important;
    background-color: var(--sdo-surface-deep) !important;
    color: var(--sdo-text) !important;
}

body :is(button.btn-danger, a.btn-danger, button.btn-outline-danger, a.btn-outline-danger) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    white-space: nowrap;
}

body :is(.sdo-btn--delete-trigger, .btn-danger, .btn-outline-danger, .maintenance-admin__button--danger-soft, .admin-dog-photo__delete):hover,
body :is(.sdo-btn--delete-trigger, .btn-danger, .btn-outline-danger, .maintenance-admin__button--danger-soft, .admin-dog-photo__delete):focus {
    border-color: var(--sdo-orange-hover) !important;
    background-color: var(--sdo-orange) !important;
    color: #fff !important;
}

body :is(.sdo-btn--delete-trigger, .btn-danger, .btn-outline-danger, .maintenance-admin__button--danger-soft, .admin-dog-photo__delete):active,
body :is(.sdo-btn--delete-trigger, .btn-danger, .btn-outline-danger, .maintenance-admin__button--danger-soft, .admin-dog-photo__delete).active {
    border-color: var(--sdo-orange-dark) !important;
    background-color: var(--sdo-orange-dark) !important;
    color: #fff !important;
}

body .dropdown-item.sdo-delete-menu-item {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--sdo-text-muted) !important;
}

body .dropdown-item.sdo-delete-menu-item:hover,
body .dropdown-item.sdo-delete-menu-item:focus {
    background-color: var(--sdo-surface-deep) !important;
    color: var(--sdo-orange-hover) !important;
}

/* Menus d’actions des vues de liste : même géométrie et mêmes états partout. */
body .admin-list-action-dropdown {
    display: inline-flex;
    margin: 0;
    vertical-align: middle;
}

body .admin-list-action-toggle {
    display: inline-flex;
    min-width: 40px;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    margin: 0;
    padding: .4rem .7rem;
    border-color: var(--sdo-orange) !important;
    background-color: var(--sdo-surface-deep) !important;
    color: var(--sdo-text) !important;
}

body .admin-list-action-toggle:hover,
body .admin-list-action-toggle:focus,
body .admin-list-action-dropdown.show > .admin-list-action-toggle.dropdown-toggle,
body .admin-list-action-dropdown.show > .admin-list-action-toggle.dropdown-toggle:focus {
    border-color: var(--sdo-orange-hover) !important;
    background-color: var(--sdo-orange) !important;
    color: #fff !important;
    box-shadow: none !important;
}

body .admin-list-action-toggle:active,
body .admin-list-action-toggle.active {
    border-color: var(--sdo-orange-dark) !important;
    background-color: var(--sdo-orange-dark) !important;
    color: #fff !important;
}

body .admin-list-action-menu {
    min-width: 245px;
    max-width: min(300px, calc(100vw - 24px));
    margin-top: 6px;
    padding: .4rem;
    overflow: hidden;
    border: 1px solid var(--sdo-border);
    border-top: 3px solid var(--sdo-orange);
    border-radius: 4px;
    background: var(--sdo-surface-deep);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .34) !important;
}

body .admin-list-action-menu__label {
    display: block;
    padding: .35rem .75rem .45rem;
    color: var(--sdo-text-muted);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1.3;
    text-transform: uppercase;
}

body .admin-list-action-menu .dropdown-item {
    display: flex;
    min-height: 40px;
    align-items: center;
    gap: .55rem;
    padding: .58rem .75rem;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: 3px;
    background: transparent !important;
    color: var(--sdo-text-muted) !important;
    font-family: "Open Sans", sans-serif;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.35;
    text-align: left;
    text-transform: none;
    white-space: normal;
}

body .admin-list-action-menu .dropdown-item:hover,
body .admin-list-action-menu .dropdown-item:focus,
body .admin-list-action-menu .dropdown-item:active,
body .admin-list-action-menu .dropdown-item.active {
    border-left-color: var(--sdo-orange);
    background: var(--sdo-surface) !important;
    color: var(--sdo-text) !important;
    outline: 0;
}

body .admin-list-action-menu .dropdown-item .fa {
    width: 18px;
    flex: 0 0 18px;
    margin: 0 !important;
    color: var(--sdo-orange-hover);
    text-align: center;
}

body .admin-list-action-menu form {
    margin: 0;
}

body .admin-list-action-menu .dropdown-divider {
    margin: .35rem .25rem;
    border-top-color: var(--sdo-border);
}

body .admin-list-action-menu .sdo-delete-menu-item:hover,
body .admin-list-action-menu .sdo-delete-menu-item:focus {
    background: var(--sdo-surface) !important;
    color: var(--sdo-text) !important;
}

/* Actions des cartes administratives : séparateur et alignement stable. */
body .admin-card-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    width: 100%;
    margin-top: .85rem;
    padding-top: .85rem;
    border-top: 1px solid var(--sdo-border);
}

body .admin-card-actions--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body .admin-card-actions > form {
    min-width: 0;
    margin: 0;
}

body .admin-card-actions .btn {
    display: inline-flex;
    width: 100%;
    min-width: 0;
    min-height: 38px;
    margin: 0;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: .4rem .3rem;
    font-size: .7rem;
    line-height: 1.15;
    white-space: nowrap;
}

/* Confirmation destructive : uniquement dans un contexte de confirmation explicite. */
body :is(.sdo-btn--delete-confirm, .admin-delete-modal__confirm) {
    border-color: var(--sdo-orange) !important;
    background-color: var(--sdo-orange) !important;
    color: #fff !important;
}

body :is(.sdo-btn--delete-confirm, .admin-delete-modal__confirm):hover,
body :is(.sdo-btn--delete-confirm, .admin-delete-modal__confirm):focus {
    border-color: var(--sdo-orange-hover) !important;
    background-color: var(--sdo-orange-hover) !important;
    color: #fff !important;
}

body :is(.sdo-btn--delete-confirm, .admin-delete-modal__confirm):active,
body :is(.sdo-btn--delete-confirm, .admin-delete-modal__confirm).active {
    border-color: var(--sdo-orange-dark) !important;
    background-color: var(--sdo-orange-dark) !important;
}

body :is(.btn, .sdo-btn, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-outline-warning, .btn-outline-primary, .btn-secondary, .btn-light, .btn-danger, .btn-outline-danger):disabled,
body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]).disabled,
body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"])[aria-disabled="true"] {
    border-color: var(--sdo-border) !important;
    background-color: var(--sdo-border) !important;
    color: var(--sdo-text-muted) !important;
    cursor: not-allowed !important;
    opacity: .7;
    transform: none !important;
}

body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]).is-loading {
    cursor: wait !important;
    pointer-events: none;
}

.sdo-btn__spinner {
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: sdo-button-spin .8s linear infinite;
}

/* Action éditoriale compacte des cartes de l'accueil. */
body .box_actu .btn_news {
    display: flex !important;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: .45rem .75rem;
    font-size: .875rem !important;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
}

@keyframes sdo-button-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 767px) {
    body :is(.btn-sm, .sdo-btn--compact, .sdo-btn--icon, .convention-icon-button) {
        min-width: 44px;
        min-height: 44px;
    }

    body .box_actu .btn_news {
        min-height: 44px;
    }

    body .admin-list-action-toggle,
    body .admin-list-action-menu .dropdown-item {
        min-height: 44px;
    }
}

@media (max-width: 575px) {
    body .admin-card-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body .admin-card-actions:not(.admin-card-actions--two) > form {
        grid-column: 1 / -1;
    }

    body .admin-card-actions .btn {
        min-height: 44px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body :is(.btn, .sdo-btn, button[class*="btn-"], input[class*="btn-"], a[class*="btn-"]) {
        transition: none;
    }

    .sdo-btn__spinner {
        animation: none;
    }
}
