/* ============================================================================
   KineticTherapy — Modern theme overlay
   ----------------------------------------------------------------------------
   Purely COSMETIC. Loaded AFTER the template's style.css. Restyles shared
   components (cards, buttons, forms, tables, modals, sidebar, etc.) across the
   whole app at once. No markup, JS, or logic is changed. Uses the template's
   own CSS variables (--primary / --bs-primary) so it adapts to light & dark.
   ========================================================================== */

:root {
    --kt-radius: 16px;
    --kt-radius-sm: 11px;
    --kt-radius-xs: 9px;
    --kt-shadow: 0 6px 22px rgba(2, 6, 23, .06);
    --kt-shadow-hover: 0 14px 36px rgba(2, 6, 23, .10);
    --kt-ring: 0 0 0 .2rem rgba(131, 203, 239, .30);
    --kt-ease: .18s cubic-bezier(.4, 0, .2, 1);
    --kt-border: rgba(0, 0, 0, .06);
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ---------- Cards ---------- */
.card {
    border: none;
    border-radius: var(--kt-radius);
    box-shadow: var(--kt-shadow);
    transition: box-shadow var(--kt-ease);
}
.card:hover { box-shadow: var(--kt-shadow-hover); }
.card .card-header {
    border-radius: var(--kt-radius) var(--kt-radius) 0 0;
    border-bottom: 1px solid var(--kt-border);
    padding: 1.15rem 1.45rem;
    background: transparent;
}
.card .card-body { padding: 1.45rem; }
.card .card-title { font-weight: 600; letter-spacing: -.01em; }

/* ---------- Buttons ---------- */
.btn {
    border-radius: var(--kt-radius-xs);
    font-weight: 500;
    transition: transform var(--kt-ease), box-shadow var(--kt-ease), filter var(--kt-ease), background-color var(--kt-ease);
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-rounded { border-radius: 999px; }
.btn-primary, .btn-secondary, .btn-success, .btn-info, .btn-danger, .btn-warning {
    box-shadow: 0 6px 16px rgba(2, 6, 23, .10);
}
.btn-primary:hover, .btn-secondary:hover, .btn-success:hover,
.btn-info:hover, .btn-danger:hover, .btn-warning:hover {
    box-shadow: 0 10px 22px rgba(2, 6, 23, .16);
    filter: brightness(1.03);
}
.btn-outline-primary, .btn-outline-secondary, .btn-outline-danger { box-shadow: none; }

/* ---------- Forms ---------- */
.form-control,
.form-select,
textarea.form-control,
.default-select .btn,
.dataTables_filter input,
.dataTables_length select {
    border-radius: var(--kt-radius-xs) !important;
    transition: border-color var(--kt-ease), box-shadow var(--kt-ease);
}
.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    border-color: var(--primary);
    box-shadow: var(--kt-ring);
}
.form-label, .col-form-label, .text-label { font-weight: 500; }

/* Select2 (used widely) */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-radius: var(--kt-radius-xs) !important;
    min-height: 42px;
}
.select2-dropdown { border-radius: var(--kt-radius-xs); overflow: hidden; }

/* ---------- Tables ---------- */
.table thead th,
table.dataTable thead th {
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .04em;
    font-weight: 600;
    border-bottom: 2px solid var(--kt-border);
}
.table tbody tr { transition: background-color var(--kt-ease); }
.table-hover tbody tr:hover,
#responsiveTable tbody tr:hover { background-color: rgba(131, 203, 239, .08); }
.table td, .table th { vertical-align: middle; }

/* DataTables controls */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border: 1px solid rgba(0, 0, 0, .12);
    padding: 5px 12px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: var(--kt-radius-xs) !important;
    margin: 0 2px !important;
    border: none !important;
    transition: background-color var(--kt-ease), color var(--kt-ease);
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: rgba(131, 203, 239, .18) !important;
    color: inherit !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--primary) !important;
    color: #08344a !important;
    box-shadow: 0 4px 12px rgba(131, 203, 239, .45);
}

/* ---------- Modals ---------- */
.modal-content {
    border: none;
    border-radius: var(--kt-radius);
    box-shadow: 0 28px 70px rgba(2, 6, 23, .28);
    overflow: hidden;
}
.modal-header, .modal-footer { padding: 1.1rem 1.45rem; border-color: var(--kt-border); }
.modal-body { padding: 1.45rem; }

/* ---------- Badges ---------- */
.badge { border-radius: 8px; font-weight: 600; padding: .42em .72em; letter-spacing: .02em; }

/* ---------- Breadcrumb / page titles ---------- */
.page-titles {
    border-radius: var(--kt-radius);
    box-shadow: var(--kt-shadow);
    padding: 1rem 1.4rem;
}
.breadcrumb { margin-bottom: 0; }
.breadcrumb-item a { text-decoration: none; }

/* ---------- Alerts ---------- */
.alert { border-radius: var(--kt-radius-sm); border: none; }

/* ---------- Sidebar (deznav) ---------- */
.deznav .metismenu > li > a {
    border-radius: var(--kt-radius-xs);
    margin: 2px 12px;
    transition: background-color var(--kt-ease), color var(--kt-ease), box-shadow var(--kt-ease);
}
.deznav .metismenu > li.mm-active > a,
.deznav .metismenu > li > a:hover,
.deznav .metismenu > li > a:focus {
    background-color: rgba(131, 203, 239, .14);
}
.deznav .metismenu ul a { transition: color var(--kt-ease); }

/* ---------- Header ---------- */
.header .header-content { transition: box-shadow var(--kt-ease); }

/* ---------- Misc ---------- */
a { transition: color var(--kt-ease); }
.plus-box { border-radius: var(--kt-radius); }

/* Subtle modern scrollbar */
* { scrollbar-width: thin; scrollbar-color: rgba(131, 203, 239, .5) transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: rgba(131, 203, 239, .45); border-radius: 999px; }
*::-webkit-scrollbar-thumb:hover { background: rgba(131, 203, 239, .7); }

/* ---------- Dark theme refinements ---------- */
[data-theme-version="dark"] .card {
    box-shadow: 0 6px 22px rgba(0, 0, 0, .28);
}
[data-theme-version="dark"] .card:hover { box-shadow: 0 14px 36px rgba(0, 0, 0, .40); }
[data-theme-version="dark"] .card .card-header,
[data-theme-version="dark"] .modal-header,
[data-theme-version="dark"] .modal-footer { border-color: rgba(255, 255, 255, .07); }
[data-theme-version="dark"] .page-titles { box-shadow: 0 6px 22px rgba(0, 0, 0, .28); }