/* Shared action-button icons and motion */

/* The JavaScript icon decorator is the single icon source. Disable older CSS pseudo-icons. */
.ui-icon-button::before {
    content: none !important;
    display: none !important;
}

.ui-icon-button {
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
    transform-origin: center;
}

.ui-icon-button:hover,
.ui-icon-button:focus-visible {
    transform: translateY(-1px) scale(1.025) !important;
}

.ui-action-icon {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    display: inline-grid;
    place-items: center;
    border-radius: 7px !important;
    background: rgba(15, 138, 97, .11);
    color: #087b4c;
    font-size: 14px;
    line-height: 1;
    font-style: normal;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.ui-icon-button:hover .ui-action-icon,
.ui-icon-button:focus-visible .ui-action-icon {
    transform: scale(1.18) rotate(-8deg);
    box-shadow: 0 5px 12px rgba(15, 23, 42, .14);
}

.button.primary .ui-action-icon,
.save-btn .ui-action-icon,
.approve-btn .ui-action-icon,
.submit-btn .ui-action-icon,
.login-btn .ui-action-icon {
    background: rgba(255, 255, 255, .20);
    color: #ffffff;
}

.button.danger .ui-action-icon,
.schedule-action-btn.delete .ui-action-icon,
.cancel-btn .ui-action-icon {
    background: rgba(239, 68, 68, .13);
    color: #dc2626;
}

.button.warning .ui-action-icon {
    background: rgba(245, 158, 11, .16);
    color: #b45309;
}

.button.secondary .ui-action-icon,
.mini-btn .ui-action-icon,
.schedule-action-btn.view .ui-action-icon,
.schedule-action-btn.edit .ui-action-icon,
.clear-btn .ui-action-icon,
.back-login-btn .ui-action-icon,
.btn .ui-action-icon {
    background: rgba(16, 185, 129, .12);
    color: #087b4c;
}

.button-label {
    min-width: 0;
}

.admin-modal-close,
.modal-close,
.password-toggle,
.sidebar-collapse-button,
.doctor-selected-remove {
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}

.admin-modal-close:hover,
.modal-close:hover,
.password-toggle:hover,
.sidebar-collapse-button:hover,
.doctor-selected-remove:hover {
    transform: scale(1.09) rotate(-7deg) !important;
}

@media (prefers-reduced-motion: reduce) {
    .ui-icon-button,
    .ui-action-icon,
    .admin-modal-close,
    .modal-close,
    .password-toggle,
    .sidebar-collapse-button,
    .doctor-selected-remove {
        transition: none !important;
    }

    .ui-icon-button:hover,
    .ui-icon-button:focus-visible,
    .ui-icon-button:hover .ui-action-icon,
    .ui-icon-button:focus-visible .ui-action-icon {
        transform: none !important;
    }
}