/* ==========================================================================
   Modern Buttons (SaaS Moderno) - Global Helpdesk Styles
   Applies across Admin & Public views while explicitly leaving .modal
   dialogs, SweetAlert2 modals, and specialized custom buttons untouched.
   ========================================================================== */

/* Base modernization for standard Bootstrap buttons outside modals */
.btn:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template) {
    border-radius: 8px;
    font-weight: 500;
    background-image: none;
    text-shadow: none;
    transition: background-color 0.18s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.18s cubic-bezier(0.4, 0, 0.2, 1),
                color 0.18s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-sm:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template) {
    border-radius: 7px;
}

.btn-xs:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template) {
    border-radius: 6px;
}

.btn.fileinput-button:not(.modal *) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* Subtle hover lift only for standalone interactive buttons */
.btn:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template, .disabled, [disabled]):hover {
    transform: translateY(-1px);
}

.btn:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template, .disabled, [disabled]):active {
    transform: translateY(0) scale(0.985);
}

.btn:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit):focus,
.btn:not(.modal *, .swal2-container *, .btn-box-tool, .btn-link, .dropdown-submit):active:focus {
    outline: none;
}

/* Neutral (.btn-default) */
.btn-default:not(.modal *, .swal2-container *, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template) {
    background-color: #ffffff;
    border-color: #cbd5e1;
    color: #334155;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.btn-default:not(.modal *, .swal2-container *, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template):hover,
.btn-default:not(.modal *, .swal2-container *, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template):focus {
    background-color: #f8fafc;
    border-color: #94a3b8;
    color: #0f172a;
    box-shadow: 0 4px 10px -2px rgba(15, 23, 42, 0.09);
}

.btn-default:not(.modal *, .swal2-container *, [id="reloadToggleBtn"], .btn-convert-note-ai, .btn-insert-checklist-template):active,
.btn-default.active:not(.modal *, .swal2-container *, [id="reloadToggleBtn"]),
.open > .dropdown-toggle.btn-default:not(.modal *, .swal2-container *) {
    background-color: #f1f5f9;
    border-color: #94a3b8;
    color: #0f172a;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08);
}

/* Primary (.btn-primary) */
.btn-primary:not(.modal *, .swal2-container *) {
    background-color: #0284c7;
    background-image: linear-gradient(180deg, #0ea5e9 0%, #0284c7 100%);
    border-color: #0284c7;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(2, 132, 199, 0.24);
}

.btn-primary:not(.modal *, .swal2-container *):hover,
.btn-primary:not(.modal *, .swal2-container *):focus {
    background-color: #0369a1;
    background-image: linear-gradient(180deg, #0284c7 0%, #0369a1 100%);
    border-color: #0369a1;
    color: #ffffff;
    box-shadow: 0 5px 12px rgba(2, 132, 199, 0.34);
}

.btn-primary:not(.modal *, .swal2-container *):active,
.btn-primary.active:not(.modal *, .swal2-container *),
.open > .dropdown-toggle.btn-primary:not(.modal *, .swal2-container *) {
    background-color: #0369a1;
    background-image: none;
    border-color: #075985;
    color: #ffffff;
}

/* Success (.btn-success) */
.btn-success:not(.modal *, .swal2-container *) {
    background-color: #059669;
    background-image: linear-gradient(180deg, #10b981 0%, #059669 100%);
    border-color: #059669;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(5, 150, 105, 0.24);
}

.btn-success:not(.modal *, .swal2-container *):hover,
.btn-success:not(.modal *, .swal2-container *):focus {
    background-color: #047857;
    background-image: linear-gradient(180deg, #059669 0%, #047857 100%);
    border-color: #047857;
    color: #ffffff;
    box-shadow: 0 5px 12px rgba(5, 150, 105, 0.34);
}

.btn-success:not(.modal *, .swal2-container *):active,
.btn-success.active:not(.modal *, .swal2-container *),
.open > .dropdown-toggle.btn-success:not(.modal *, .swal2-container *) {
    background-color: #047857;
    background-image: none;
    border-color: #065f46;
    color: #ffffff;
}

/* Info (.btn-info) */
.btn-info:not(.modal *, .swal2-container *) {
    background-color: #0891b2;
    background-image: linear-gradient(180deg, #06b6d4 0%, #0891b2 100%);
    border-color: #0891b2;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(8, 145, 178, 0.22);
}

.btn-info:not(.modal *, .swal2-container *):hover,
.btn-info:not(.modal *, .swal2-container *):focus {
    background-color: #0e7490;
    background-image: linear-gradient(180deg, #0891b2 0%, #0e7490 100%);
    border-color: #0e7490;
    color: #ffffff;
    box-shadow: 0 5px 12px rgba(8, 145, 178, 0.32);
}

.btn-info:not(.modal *, .swal2-container *):active,
.btn-info.active:not(.modal *, .swal2-container *),
.open > .dropdown-toggle.btn-info:not(.modal *, .swal2-container *) {
    background-color: #0e7490;
    background-image: none;
    border-color: #155e75;
    color: #ffffff;
}

/* Warning (.btn-warning) */
.btn-warning:not(.modal *, .swal2-container *) {
    background-color: #d97706;
    background-image: linear-gradient(180deg, #f59e0b 0%, #d97706 100%);
    border-color: #d97706;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(217, 119, 6, 0.22);
}

.btn-warning:not(.modal *, .swal2-container *):hover,
.btn-warning:not(.modal *, .swal2-container *):focus {
    background-color: #b45309;
    background-image: linear-gradient(180deg, #d97706 0%, #b45309 100%);
    border-color: #b45309;
    color: #ffffff;
    box-shadow: 0 5px 12px rgba(217, 119, 6, 0.32);
}

.btn-warning:not(.modal *, .swal2-container *):active,
.btn-warning.active:not(.modal *, .swal2-container *),
.open > .dropdown-toggle.btn-warning:not(.modal *, .swal2-container *) {
    background-color: #b45309;
    background-image: none;
    border-color: #92400e;
    color: #ffffff;
}

/* Danger (.btn-danger) */
.btn-danger:not(.modal *, .swal2-container *) {
    background-color: #dc2626;
    background-image: linear-gradient(180deg, #ef4444 0%, #dc2626 100%);
    border-color: #dc2626;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(220, 38, 38, 0.22);
}

.btn-danger:not(.modal *, .swal2-container *):hover,
.btn-danger:not(.modal *, .swal2-container *):focus {
    background-color: #b91c1c;
    background-image: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%);
    border-color: #b91c1c;
    color: #ffffff;
    box-shadow: 0 5px 12px rgba(220, 38, 38, 0.32);
}

.btn-danger:not(.modal *, .swal2-container *):active,
.btn-danger.active:not(.modal *, .swal2-container *),
.open > .dropdown-toggle.btn-danger:not(.modal *, .swal2-container *) {
    background-color: #b91c1c;
    background-image: none;
    border-color: #991b1b;
    color: #ffffff;
}

/* ==========================================================================
   Ticket Header Action Bar & Semantic Hierarchy
   ========================================================================== */
.ticket-header-buttons .btn:not(.modal *) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 8px;
    border-color: #e2e8f0;
    font-weight: 500;
    padding: 6px 12px;
}

.ticket-header-buttons .btn#editticket:hover,
.ticket-header-buttons .btn#editticket:focus {
    background-color: #fffbeb;
    border-color: #fde68a;
    color: #b45309;
}

.ticket-header-buttons .btn.btn-default.btn-audit-ticket {
    background-color: #f0f9ff;
    border-color: #bae6fd;
    color: #0369a1;
}

.ticket-header-buttons .btn.btn-default.btn-audit-ticket:hover,
.ticket-header-buttons .btn.btn-default.btn-audit-ticket:focus {
    background-color: #e0f2fe;
    border-color: #7dd3fc;
    color: #0c4a6e;
}

.ticket-header-buttons .btn#addtoknow:hover,
.ticket-header-buttons .btn#addtoknow:focus {
    background-color: #fefce8;
    border-color: #fde047;
    color: #854d0e;
}

.ticket-header-buttons .btn.btn-default.btn-close-ticket {
    background-color: #059669;
    background-image: linear-gradient(180deg, #10b981 0%, #059669 100%);
    border-color: #059669;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(5, 150, 105, 0.28);
}

.ticket-header-buttons .btn.btn-default.btn-close-ticket i {
    color: #ffffff !important;
}

.ticket-header-buttons .btn.btn-default.btn-close-ticket:hover,
.ticket-header-buttons .btn.btn-default.btn-close-ticket:focus {
    background-color: #047857;
    background-image: linear-gradient(180deg, #059669 0%, #047857 100%);
    border-color: #047857;
    color: #ffffff;
    box-shadow: 0 5px 12px rgba(5, 150, 105, 0.36);
}

.ticket-header-buttons .btn.btn-default.btn-reopen-ticket {
    background-color: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
    font-weight: 600;
}

.ticket-header-buttons .btn.btn-default.btn-reopen-ticket:hover,
.ticket-header-buttons .btn.btn-default.btn-reopen-ticket:focus {
    background-color: #d1fae5;
    border-color: #6ee7b7;
    color: #065f46;
}

/* Message / Reply inline action buttons */
.timeline-footer.ticket-message-bottom .text-right,
.timeline-footer.ticket-message-bottom .pull-right {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.timeline-footer.ticket-message-bottom .btn.btn-convert-msg-to-checklist-note:hover,
.timeline-footer.ticket-message-bottom .btn.btn-convert-msg-to-checklist-note:focus {
    background-color: #f5f3ff;
    border-color: #ddd6fe;
    color: #6d28d9;
}

.timeline-footer.ticket-message-bottom .btn.btn-resend-email-notification:hover,
.timeline-footer.ticket-message-bottom .btn.btn-resend-email-notification:focus {
    background-color: #f0f9ff;
    border-color: #bae6fd;
    color: #0369a1;
}

.timeline-footer.ticket-message-bottom .btn.btn-delete-ticket-post:hover,
.timeline-footer.ticket-message-bottom .btn.btn-delete-ticket-post:focus {
    background-color: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}

/* ==========================================================================
   Dark AdminLTE Sidebar (.main-sidebar) - Slate Glass Buttons & Selectpicker
   ========================================================================== */
body:not([class*="-light"]) .main-sidebar .ticket-info .btn.btn-default:not(.modal *, [id="reloadToggleBtn"]) {
    background-color: rgba(255, 255, 255, 0.08);
    background-image: none;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 7px;
    color: #e2e8f0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}

body:not([class*="-light"]) .main-sidebar .ticket-info .btn.btn-default:not(.modal *, [id="reloadToggleBtn"]):hover,
body:not([class*="-light"]) .main-sidebar .ticket-info .btn.btn-default:not(.modal *, [id="reloadToggleBtn"]):focus {
    background-color: rgba(56, 189, 248, 0.16);
    border-color: rgba(56, 189, 248, 0.48);
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.28);
}

body:not([class*="-light"]) .main-sidebar .ticket-info .btn.btn-default:not(.modal *, [id="reloadToggleBtn"]):active {
    background-color: rgba(56, 189, 248, 0.24);
    border-color: rgba(56, 189, 248, 0.6);
    color: #ffffff;
}

body:not([class*="-light"]) .main-sidebar .ticket-info .btn.btn-default:not(.modal *, [id="reloadToggleBtn"]) i {
    color: #38bdf8;
    margin-right: 2px;
}

/* Keep Programado para (Cambiar + Posponer + Borrar) on one single compact row */
.main-sidebar .due-date-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 3px;
    flex-wrap: nowrap;
}

.main-sidebar .due-date-actions .btn-sm {
    padding: 4px 7px;
    font-size: 11.5px;
    line-height: 1.3;
    white-space: nowrap;
}

.main-sidebar .due-date-actions #delete-due-date-button {
    padding: 4px 7px;
}

/* Reset .form-control wrapper styling on bootstrap-select so no white box bleeds behind rounded toggles */
.bootstrap-select.form-control:not(.modal *) {
    background-color: transparent;
    background-image: none;
    border: none;
    box-shadow: none;
    padding: 0;
    height: auto;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select .btn.btn-default:not(.modal *) {
    background-color: #1b252a;
    background-image: none;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 7px;
    color: #cbd5e1;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    height: 32px;
    padding: 5px 25px 5px 10px;
    font-size: 12.5px;
    line-height: 1.4;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select .btn.btn-default:not(.modal *):hover,
body:not([class*="-light"]) .main-sidebar .bootstrap-select .btn.btn-default:not(.modal *):focus,
body:not([class*="-light"]) .main-sidebar .bootstrap-select.open .btn.btn-default:not(.modal *) {
    background-color: #243239;
    border-color: rgba(56, 189, 248, 0.55);
    color: #ffffff;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.16);
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select .btn.btn-default:not(.modal *) .caret {
    color: #94a3b8;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu {
    background-color: #1e2930;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.45);
    margin-top: 4px;
    padding: 4px 0;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu .bs-searchbox {
    padding: 4px 8px 6px;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu .bs-searchbox .form-control {
    background-color: #151e24;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    color: #f1f5f9;
    font-size: 12.5px;
    height: 30px;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu .bs-searchbox .form-control:focus {
    border-color: #38bdf8;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.18);
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu ul.dropdown-menu.inner {
    background-color: transparent;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu li > a {
    color: #e2e8f0;
    font-size: 12.5px;
    padding: 6px 12px;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu li > a:hover,
body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu li.active > a {
    background-color: rgba(56, 189, 248, 0.18);
    color: #ffffff;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu li.disabled > a {
    color: #64748b;
}

body:not([class*="-light"]) .main-sidebar .bootstrap-select > .dropdown-menu li.no-results {
    background-color: transparent;
    color: #94a3b8;
    font-size: 12px;
}

/* Light-surface Bootstrap-Select dropdown buttons (outside sidebar & modals) */
.bootstrap-select:not(.main-sidebar *, .modal *) .btn.btn-default {
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    color: #334155;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.bootstrap-select:not(.main-sidebar *, .modal *) .btn.btn-default:hover {
    background-color: #f8fafc;
    border-color: #94a3b8;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06);
}

.bootstrap-select:not(.main-sidebar *, .modal *) .btn.btn-default:focus,
.bootstrap-select:not(.main-sidebar *, .modal *).open .btn.btn-default {
    background-color: #ffffff;
    border-color: #0284c7;
    box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.14);
}

/* ==========================================================================
   Preserve seamless joints and prevent hover shift on grouped controls
   ========================================================================== */
.btn-group:not(.modal *) > .btn:hover,
.btn-group:not(.modal *) > .btn:active,
.input-group-btn:not(.modal *) > .btn:hover,
.input-group-btn:not(.modal *) > .btn:active,
.bootstrap-select:not(.modal *) > .btn:hover,
.bootstrap-select:not(.modal *) > .btn:active {
    transform: none;
}

.btn-group:not(.modal *, .bootstrap-select) > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle),
.btn-group:not(.modal *, .bootstrap-select) > .btn-group:not(:first-child):not(:last-child) > .btn {
    border-radius: 0;
}

.btn-group:not(.modal *, .bootstrap-select) > .btn:first-child:not(:last-child),
.btn-group:not(.modal *, .bootstrap-select) > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group:not(.modal *, .bootstrap-select) > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group:not(.modal *, .bootstrap-select) > .btn:last-child:not(:first-child),
.btn-group:not(.modal *, .bootstrap-select) > .dropdown-toggle:not(:first-child),
.btn-group:not(.modal *, .bootstrap-select) > .btn-group:last-child:not(:first-child) > .btn:first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group-btn:not(.modal *):first-child > .btn,
.input-group-btn:not(.modal *):first-child > .btn-group > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group-btn:not(.modal *):last-child > .btn,
.input-group-btn:not(.modal *):last-child > .btn-group > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}