/*------------------------------------
  KTDatatable Mobile Adapter
  Styles for .ktm-* classes
------------------------------------*/

/* Eredita font dal tema (escludi icone) */
.ktm-datatable-mobile,
.ktm-datatable-mobile *:not(i):not([class*="fa-"]):not([class*="la-"]):not([class*="icon"]) {
    font-family: inherit;
}

/* Container */
.ktm-datatable-mobile {
    width: 100%;
    padding: 0;
}

/* Card List */
.ktm-card-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Single Card */
.ktm-card {
    background: #fff;
    border: 1px solid #e4e6ef;
    border-radius: 12px;
    padding: 16px 14px;
    cursor: pointer;
    transition: background 0.15s, box-shadow 0.15s, transform 0.15s;
    animation: ktmFadeIn 0.25s ease-out both;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.ktm-card:hover {
    background: #f9fafb;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.ktm-card:active {
    background: #f3f6f9;
    transform: scale(0.985);
}

@keyframes ktmFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ktm-card-main {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Barra header con intestazioni */
.ktm-select-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #f8f9fc;
    border-radius: 6px;
    margin-bottom: 12px;
}

.ktm-select-all {
    margin: 0 !important;
    flex-shrink: 0;
}

.ktm-header-select {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    margin-left: 8px;
    padding: 8px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ktm-header-select:hover {
    opacity: 0.8;
}

.ktm-header-select i {
    font-size: 12px;
}

.ktm-header-status {
    font-size: 12px;
    font-weight: 600;
    color: #a1a5b7;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-right: 47px; /* Allinea con lo switch */
}

/* In modalità selezione, "Stato" si sposta a destra (penna nascosta) */
.ktm-select-mode .ktm-header-status {
    margin-right: 0;
}

/* Barra selezione (sotto intestazioni) */
.ktm-selection-bar {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #1e1e2d;
    border-radius: 6px;
    margin-bottom: 12px;
}

.ktm-selection-bar.visible {
    display: flex;
}

.ktm-selection-count {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
}

.ktm-selection-text {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
    flex: 1;
}

.ktm-selection-close {
    width: 28px;
    height: 28px;
    border: none;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.ktm-selection-close:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

/* Checkbox selezione batch */
.ktm-card-select {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    margin: -8px;
    margin-right: 0;
}

.ktm-card-checkbox {
    margin: 0 !important;
    padding: 8px !important;
}

.ktm-card-checkbox input[type="checkbox"] {
    width: 20px;
    height: 20px;
}

.ktm-card-content {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-align: left;
}

/* Layout con immagine (categorie) */
.ktm-card-with-image {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ktm-card-image {
    position: relative;
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: visible;
}

/* Layout categorie con checkbox (senza immagine) */
.ktm-card-with-checkbox {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ktm-card-check {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ktm-card-checkbox-cat {
    margin: 0 !important;
    padding: 8px !important;
}

.ktm-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ktm-card-text {
    flex: 1;
    min-width: 0;
}

.ktm-card-text-center {
    display: flex;
    flex-direction: column;
    justify-content: center;
}


/* Titolo non troncato (per categorie) */
.ktm-card-title-full {
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    display: block !important;
    overflow: visible !important;
    white-space: normal !important;
}

/* Layout categorie */
.ktm-card-cat-layout {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Checkbox nelle card: nascosto di default */
.ktm-card-cat-layout .ktm-card-checkbox {
    display: none;
    margin: 0 !important;
    flex-shrink: 0;
}

/* Modalità selezione attiva: mostra checkbox, nascondi penna */
.ktm-select-mode .ktm-card-cat-layout .ktm-card-checkbox,
.ktm-select-mode .ktm-card-voce-layout .ktm-card-checkbox {
    display: flex;
}

.ktm-select-mode .ktm-card-edit {
    display: none;
}

/* ===== LAYOUT VOCI MENU ===== */
.ktm-card-voce-layout {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

.ktm-card-voce-layout .ktm-card-checkbox {
    display: none;
    margin: 0 !important;
    flex-shrink: 0;
}

.ktm-card-voce-layout .ktm-card-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ktm-card-voce-layout .ktm-card-title-wrap {
    margin-bottom: 2px;
}

.ktm-card-voce-layout .ktm-card-subtitle {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ktm-card-cat-badge-wrap {
    margin-top: 3px;
}

.ktm-card-cat-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    color: #7e8299;
    background: #f3f6f9;
    padding: 3px 8px;
    border-radius: 4px;
}

/* Chip compatti per caratteristiche */
.ktm-caratteristiche-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ktm-char-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #f3f6f9;
    padding: 6px 10px;
    border-radius: 20px;
    font-size: 11px;
    color: #5e6278;
    text-transform: capitalize;
}

.ktm-char-chip img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

/* ===== LAYOUT SURVEY ===== */
.ktm-card-survey-layout {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

.ktm-card-survey-layout .ktm-card-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ktm-card-survey-pos-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #f3f6f9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ktm-card-survey-pos-icon img {
    width: 26px;
    height: 26px;
}

.ktm-card-survey-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.ktm-survey-completions {
    font-size: 11px;
    color: #7e8299;
    margin-top: 3px;
}

/* ===== LAYOUT ORDINI TAVOLO ===== */
.ktm-card-ordine-layout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

.ktm-card-ordine-layout .ktm-card-text {
    flex: 1;
    min-width: 0;
}

.ktm-card-date-wrap {
    margin-top: 4px;
}

.ktm-card-date-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    color: #7e8299;
    background: #f3f6f9;
    padding: 3px 8px;
    border-radius: 4px;
}

.ktm-card-status-wrap {
    margin-top: 4px;
}

/* Dropdown stampa per ordini */
.ktm-print-dropdown {
    position: relative;
    display: flex;
}

.ktm-print-dropdown > .ktm-action-btn {
    flex: 1;
    width: 100%;
    height: 100%;
}

.ktm-print-toggle {
    display: flex;
    align-items: center;
    gap: 4px;
}

.ktm-print-menu {
    display: none;
    position: fixed;
    left: 5%;
    right: 5%;
    width: 90%;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 30px rgba(0,0,0,0.25);
    padding: 12px 0;
    z-index: 10001;
}

.ktm-print-dropdown.open .ktm-print-menu {
    display: block;
}

.ktm-print-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    color: #3f4254;
    text-decoration: none;
    transition: background 0.2s;
}

.ktm-print-item:hover {
    background: #f3f6f9;
}

.ktm-print-item i {
    font-size: 18px;
    color: #7e8299;
}

.ktm-card-ordine-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.ktm-ordine-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #f3f6f9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #7e8299;
    text-decoration: none;
    transition: all 0.2s ease;
}

.ktm-ordine-btn:hover {
    background: #e4e6ef;
    color: #3f4254;
}

.ktm-ordine-btn i {
    font-size: 20px;
}

/* Nascondi penna edit per ordini tavolo */
.ktm-card-ordine .ktm-card-edit {
    display: none;
}

/* Evidenziazione voce appena modificata */
.ktm-card-highlighted {
    box-shadow: 0 0 0 2px #5d78ff, 0 4px 12px rgba(93, 120, 255, 0.25);
    animation: ktm-highlight-pulse 2s ease-out;
}

@keyframes ktm-highlight-pulse {
    0% { box-shadow: 0 0 0 4px rgba(93, 120, 255, 0.5), 0 4px 12px rgba(93, 120, 255, 0.3); }
    100% { box-shadow: 0 0 0 2px #5d78ff, 0 4px 12px rgba(93, 120, 255, 0.25); }
}


.ktm-card-price {
    font-size: 13px;
    font-weight: 600;
    color: #1dc455;
    margin-top: 2px;
}


.ktm-card-img {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
    background-color: #f3f6f9;
}

/* Icona sottocategoria */
.ktm-subcat-icon {
    color: #b5b5c3;
    font-size: 16px;
    font-weight: 300;
    display: inline-flex;
    align-items: center;
    align-self: center;
    margin-right: 2px;
}

/* Sottocategorie: titolo più piccolo */
.ktm-card-subcat .ktm-card-title {
    font-size: 13px;
}

/* Icona penna (modifica) */
.ktm-card-edit {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: #f3f6f9;
    margin-left: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #7e8299;
    margin-left: 4px;
    text-decoration: none;
}

.ktm-card-edit:hover {
    background: #e4e6ef;
    color: #3f4254;
}

.ktm-card-edit i {
    font-size: 12px;
}

/* Switch e edit compatti - dimensioni applicate globalmente */


.ktm-card-title-wrap {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 6px;
}

.ktm-card-title {
    font-size: 14px;
    font-weight: 600;
    color: #181c32;
    line-height: 1.35;
    /* Permetti wrap su 2 righe max */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
    min-width: 0;
}


.ktm-card-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 13px;
    color: #7e8299;
    line-height: 1.4;
    margin-bottom: 5px;
}

.ktm-card-line:last-child {
    margin-bottom: 0;
}

/* Nascondi i <br> nelle card per evitare interruzioni di riga indesiderate */
.ktm-card br {
    display: none;
}

/* Icone stato (tradotto/personalizzato) */
.ktm-status-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    font-size: 10px;
    flex-shrink: 0;
    margin-top: 1px;
}

.ktm-status-icon i {
    line-height: 1;
}

.ktm-status-translated {
    background: #e8fff3;
    color: #1dc455;
}

.ktm-status-customized {
    background: #fff8e1;
    color: #ffb300;
}


.ktm-card-label {
    font-weight: 600;
    color: #a1a5b7;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    flex-shrink: 0;
}

.ktm-card-value {
    color: #5e6278;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Link disabilitati nelle card */
.ktm-card-line a {
    /* color via kt-font-info class */
    text-decoration: none;
    pointer-events: none;
}

/* Badge allineati nelle card */
.ktm-card-line .kt-badge,
.ktm-card-value .kt-badge {
    font-size: 10px;
    padding: 2px 6px;
    vertical-align: middle;
    margin: 0 !important;
}

.ktm-card-switch {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-left: 0;
    padding: 2px;
}

.ktm-switch {
    display: block;
    text-decoration: none;
}

.ktm-switch-track {
    display: block;
    width: 36px;
    height: 20px;
    border-radius: 10px;
    background: #e4e6ef;
    position: relative;
    transition: background 0.2s ease;
}

.ktm-switch-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    transition: transform 0.2s ease;
}

.ktm-switch-on .ktm-switch-track {
    background: #1dc455;
}

.ktm-switch-on .ktm-switch-thumb {
    transform: translateX(16px);
}

.ktm-switch-off .ktm-switch-track {
    background: #c4c4d4;
}

.ktm-switch:active .ktm-switch-track {
    opacity: 0.8;
}

/* Switch nel drawer */
.ktm-switch-drawer {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.ktm-switch-label {
    font-size: 14px;
    font-weight: 500;
    color: #3f4254;
}

.ktm-switch-on .ktm-switch-label {
    color: #1dc455;
}

.ktm-switch-off .ktm-switch-label {
    color: #7e8299;
}

.ktm-card-arrow {
    flex-shrink: 0;
    color: #c4c4d4;
    display: flex;
    align-items: center;
    margin-left: 8px;
}

.ktm-empty {
    color: #b5b5c3;
}

/* No Results */
.ktm-no-results {
    text-align: center;
    padding: 40px 20px;
    color: #7e8299;
    font-size: 14px;
}

/* Pagination */
.ktm-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e4e6ef;
}

.ktm-pagination-info {
    font-size: 13px;
    color: #7e8299;
}

.ktm-pagination-buttons {
    display: flex;
    gap: 8px;
}

.ktm-pagination-btn {
    width: 36px;
    height: 36px;
    border: 1px solid #e4e6ef;
    border-radius: 6px;
    background: #fff;
    color: #3f4254;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, border-color 0.15s;
}

.ktm-pagination-btn:hover:not(:disabled) {
    background: #f3f6f9;
    border-color: #d1d3e0;
}

.ktm-pagination-btn:disabled,
.ktm-pagination-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.ktm-pagination-select {
    flex-shrink: 0;
}

.ktm-pagination-perpage {
    padding: 8px 12px;
    font-size: 13px;
    border: 1px solid #e4e6ef;
    border-radius: 6px;
    background: #fff;
    color: #3f4254;
    cursor: pointer;
    min-width: 60px;
}

.ktm-pagination-perpage:focus {
    border-color: #5867dd; /* kt-font--info */ /* kt-font--info */
    outline: none;
}

/* Drawer (Bottom Sheet) - Metronic Style */
.ktm-drawer {
    position: fixed;
    inset: 0;
    z-index: 1050; /* Bootstrap modal z-index */
    visibility: hidden;
    pointer-events: none;
    transition: visibility 0s 0.3s;
}

.ktm-drawer.open {
    visibility: visible;
    pointer-events: auto;
    transition: visibility 0s 0s;
}

.ktm-drawer-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: -100px; /* Extra per coprire oltre il safe area */
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.ktm-drawer.open .ktm-drawer-overlay {
    opacity: 1;
}

.ktm-drawer-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    max-height: 88vh;
    background: #fff;
    border-radius: 20px 20px 0 0;
    transform: translateY(100%);
    opacity: 0;
    /* Chiusura: prima scende (0.2s), poi fadeout (0.15s con delay 0.18s) */
    transition: transform 0.2s ease-in, opacity 0.15s ease 0.18s;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.15);
    /* Estendi sfondo bianco sotto per safe area iPhone */
    padding-bottom: env(safe-area-inset-bottom, 0);
}

.ktm-drawer.open .ktm-drawer-content {
    transform: translateY(0);
    opacity: 1;
    /* Apertura: solo slide up, no fadein */
    transition: transform 0.32s cubic-bezier(0.32, 0.72, 0, 1), opacity 0s;
}

.ktm-drawer-content::after {
    content: '';
    position: absolute;
    bottom: -100px;
    left: 0;
    right: 0;
    height: 100px;
    background: #fff;
}

.ktm-drawer-handle {
    width: 40px;
    height: 4px;
    background: #e4e6ef;
    border-radius: 2px;
    margin: 12px auto 4px;
    flex-shrink: 0;
}

.ktm-drawer-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 12px 20px 16px;
    border-bottom: 1px solid #ebedf3;
    flex-shrink: 0;
    background: linear-gradient(180deg, #fff 0%, #fafbfc 100%);
}

.ktm-drawer-title-wrapper {
    flex: 1;
    padding-right: 12px;
    min-width: 0;
}

.ktm-drawer-title {
    font-size: 18px;
    font-weight: 600;
    color: #181c32;
    line-height: 1.3;
}

.ktm-drawer-subtitle {
    font-size: 13px;
    color: #7e8299;
    margin-top: 4px;
}

.ktm-drawer-subtitle strong {
    color: #3f4254;
    font-weight: 600;
}

.ktm-drawer-close {
    width: 36px;
    height: 36px;
    border: none;
    background: #f3f6f9;
    border-radius: 8px;
    font-size: 20px;
    line-height: 1;
    color: #7e8299;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.ktm-drawer-close:hover {
    background: #e4e6ef;
    color: #3f4254;
}

.ktm-drawer-close:active {
    transform: scale(0.95);
}

.ktm-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    -webkit-overflow-scrolling: touch;
    background: #fff;
}

/* Immagine categoria nel drawer */
.ktm-drawer-cat-image {
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: center;
    border-radius: 10px;
    margin-bottom: 20px;
}

.ktm-drawer-fields {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ktm-drawer-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 0;
    border-bottom: 1px solid #f4f5f8;
}

.ktm-drawer-field:last-child {
    border-bottom: none;
}

/* Rimuovi border dall'ultimo field se seguito dal bottone delete */
.ktm-drawer-field:has(+ .ktm-drawer-delete) {
    border-bottom: none;
}

.ktm-drawer-field-label {
    font-size: 11px;
    font-weight: 700;
    color: #a1a5b7;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ktm-drawer-field-value {
    font-size: 14px;
    color: #181c32;
    word-break: break-word;
    line-height: 1.5;
}

/* Annulla tag <center> nei valori */
.ktm-drawer-field-value center {
    text-align: left;
}

.ktm-drawer-field-value a {
    /* color: inherit from kt-font-brand class */
    text-decoration: none;
    font-weight: 500;
}

.ktm-drawer-field-value a:hover {
    text-decoration: underline;
}

.ktm-drawer-field-value .kt-badge {
    display: inline-flex;
    align-items: center;
    height: auto;
    font-size: 11px;
    padding: 0.35rem 0.7rem;
    font-weight: 600;
}

/* Input/textarea nei drawer (editabili) */
.ktm-drawer-field-value input,
.ktm-drawer-field-value textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e4e6ef;
    border-radius: 8px;
    background: #fff;
    color: #3f4254;
    font-size: 14px;
    font-family: inherit;
}

.ktm-drawer-field-value input:focus,
.ktm-drawer-field-value textarea:focus {
    border-color: #5867dd; /* kt-font--info */ /* kt-font--info */
    outline: none;
    box-shadow: 0 0 0 3px rgba(54, 153, 255, 0.15);
}

.ktm-drawer-field-value textarea {
    min-height: 80px;
    resize: vertical;
}

.ktm-drawer-field-value .input-group {
    display: flex;
    align-items: stretch;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #e4e6ef;
    background: #fff;
}

.ktm-drawer-field-value .input-group input,
.ktm-drawer-field-value .input-group textarea {
    border: none;
    border-radius: 0;
    flex: 1;
    min-width: 0;
}

.ktm-drawer-field-value .input-group-prepend,
.ktm-drawer-field-value .input-group-append {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.ktm-drawer-field-value .input-group-prepend .input-group-text {
    border-right: 1px solid #e4e6ef;
    height: 100%;
}

.ktm-drawer-field-value .input-group-append .input-group-text {
    border-left: 1px solid #e4e6ef;
    height: 100%;
}

.ktm-drawer-field-value .input-group-text {
    padding: 8px 12px;
    background: #f5f8fa;
    border: none;
    font-size: 13px;
    color: #7e8299;
}

/* Safe area per iPhone con notch */
.ktm-drawer-body {
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0));
}

/* Barra Azioni sotto header del drawer */
.ktm-drawer-actions-bar {
    display: none;
    padding: 12px 20px;
    background: #f8f9fc;
    border-bottom: 1px solid #ebedf3;
}

.ktm-drawer-actions-bar .ktm-actions-buttons {
    display: flex;
    gap: 10px;
}

.ktm-drawer-actions-bar .ktm-actions-buttons .btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 10px;
    font-size: 13px;
    border-radius: 5px;
    background: #fff;
    border: 1px solid #e4e6ef;
    min-height: 44px;
    gap: 6px;
}

.ktm-drawer-actions-bar .ktm-actions-buttons .btn:hover {
    background: #f3f6f9;
}

.ktm-drawer-actions-bar .ktm-actions-buttons .btn i {
    font-size: 16px;
}

/* Bottoni azioni drawer - usa CSS Grid per colonne uguali */
.ktm-actions {
    display: grid;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    gap: 8px;
}

.ktm-action-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px 6px;
    background: #fff;
    border: 1px solid #e4e6ef;
    border-radius: 6px;
    min-height: 60px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.ktm-action-btn:hover {
    background: #f8f9fc;
    text-decoration: none;
}

.ktm-action-btn:active {
    transform: scale(0.97);
}

.ktm-action-btn i {
    font-size: 22px;
}

.ktm-action-btn span {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    text-align: center;
    width: 100%;
}

/* Colori ereditati da classi Metronic (kt-font-info, kt-font-brand, kt-font-warning) */
.ktm-action-btn span {
    color: inherit;
}

/* Bottone delete in fondo al drawer */
.ktm-drawer-delete {
    padding-top: 20px;
    margin-top: 10px;
    border-top: 1px solid #f4f5f8;
}

.ktm-drawer-delete .btn {
    padding: 12px 16px;
    font-size: 12px;
}

/* Colonna Opzioni con label */
.ktm-drawer-field[data-field="opzioni"] .ktm-drawer-field-value {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ktm-option-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #f8f9fc;
    border-radius: 6px;
}

.ktm-option-item i {
    font-size: 18px;
    width: 24px;
    text-align: center;
    flex-shrink: 0;
}

.ktm-option-label {
    font-size: 14px;
    font-weight: 500;
    color: #3f4254;
}

/* Azioni specifiche per traduzioni */
.ktm-traduzioni-actions {
    padding: 8px 0 14px !important;
    border-bottom: none !important;
}

.ktm-traduzioni-actions .btn-save {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

/* Azioni specifiche per stringhe */
.ktm-stringhe-actions {
    padding: 8px 0 14px !important;
    border-bottom: none !important;
}

.ktm-stringhe-actions .btn-save {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

/* Body lock when drawer is open */
body.ktm-drawer-open {
    overflow: hidden;
}

/* Fix toastr icon on mobile */
#toast-container > .toast {
    background-position: 15px center !important;
    background-size: 18px 18px !important;
    background-repeat: no-repeat !important;
    padding-left: 45px !important;
}

#toast-container > .toast::before {
    display: none !important;
}

/* ============================================
   ORDINI TAVOLO - Grid 2 Colonne Header
   ============================================ */

.ktm-ordine-grid {
    margin-bottom: 16px;
}

.ktm-ordine-grid-row {
    display: flex;
    border-bottom: 1px solid #f4f5f8;
}

.ktm-ordine-grid-row:last-child {
    border-bottom: none;
}

.ktm-ordine-grid-cell {
    flex: 1;
    padding: 14px 0;
}

.ktm-ordine-grid-cell:first-child {
    padding-right: 12px;
    border-right: 1px solid #f4f5f8;
}

.ktm-ordine-grid-cell:last-child {
    padding-left: 12px;
}

.ktm-ordine-grid-label {
    font-size: 11px;
    font-weight: 700;
    color: #a1a5b7;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}

.ktm-ordine-grid-value {
    font-size: 14px;
    color: #181c32;
}

.ktm-ordine-grid-value i {
    color: #7e8299;
    margin-right: 4px;
}

.ktm-ordine-grid-value a {
    text-decoration: none;
}

.ktm-ordine-grid-value a:hover {
    text-decoration: underline;
}

/* ============================================
   ORDINI TAVOLO - Sezione Ordine nel Drawer
   ============================================ */

.ktm-ordine-section {
    margin: 16px 0;
    padding: 0;
    border-radius: 8px;
    background: #f8f9fa;
    overflow: hidden;
}

.ktm-ordine-section-title {
    font-size: 12px;
    font-weight: 700;
    color: #181c32;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 14px 16px 10px;
    background: #f1f3f5;
    border-bottom: 1px solid #e9ecef;
}

/* Items dell'ordine */
.ktm-ordine-items {
    padding: 0;
}

.ktm-ordine-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 14px 16px;
    border-bottom: 1px solid #e9ecef;
    gap: 12px;
}

.ktm-ordine-item:last-child {
    border-bottom: none;
}

.ktm-ordine-item-info {
    flex: 1;
    min-width: 0;
}

.ktm-ordine-item-title {
    font-size: 14px;
    font-weight: 600;
    color: #181c32;
    line-height: 1.4;
    word-break: break-word;
}

.ktm-ordine-item-cat {
    font-size: 12px;
    color: #7e8299;
    margin-top: 2px;
}

/* Personalizzazioni - badge per ogni ingrediente */
.ktm-ordine-item-personalizzazioni {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 8px;
    width: 100%;
}

.ktm-personalizzazione-badge {
    display: inline-block;
    background: #f1f3f9;
    color: #5e6278;
    font-size: 10px;
    font-weight: 500;
    padding: 3px 8px;
    border-radius: 12px;
    white-space: nowrap;
}

/* Nota voce ordine - italic */
.ktm-ordine-item-nota {
    font-size: 11px;
    color: #7e8299;
    margin-top: 6px;
    font-style: italic;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    width: 100%;
}

.ktm-ordine-item-nota i {
    color: #a1a5b7;
    font-size: 10px;
    margin-top: 2px;
    font-style: normal;
}

.ktm-ordine-item-price {
    text-align: right;
    flex-shrink: 0;
}

.ktm-price-main {
    font-size: 14px;
    font-weight: 700;
    display: block;
}

.ktm-price-info {
    font-size: 11px;
    color: #a1a5b7;
    display: block;
    margin-top: 2px;
}

/* Separatore ordine (aggiunte) */
.ktm-ordine-separator {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    gap: 10px;
    font-size: 12px;
    font-weight: 600;
    color: #7e8299;
    background: #fff;
}

.ktm-ordine-separator span:first-child,
.ktm-ordine-separator span:last-child {
    flex: 1;
    height: 1px;
    background: #e4e6ef;
}

/* Subtotale */
.ktm-ordine-subtotale {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
}

.ktm-ordine-subtotale-left {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ktm-ordine-subtotale-label {
    font-size: 13px;
    font-weight: 700;
    color: #181c32;
    text-transform: uppercase;
}

.ktm-ordine-subtotale-desc {
    font-size: 12px;
    color: #7e8299;
}

.ktm-ordine-subtotale-value {
    font-size: 16px;
    font-weight: 700;
    color: #181c32;
}

/* Servizi Aggiuntivi */
.ktm-ordine-servizi {
    background: #fff;
    border: 1px solid #e9ecef;
}

.ktm-ordine-servizi .ktm-ordine-section-title {
    background: transparent;
    border-bottom: 1px solid #e9ecef;
}

.ktm-servizio-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #f4f5f8;
}

.ktm-servizio-item:last-child {
    border-bottom: none;
}

.ktm-servizio-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ktm-servizio-title {
    font-size: 14px;
    font-weight: 500;
    color: #181c32;
}

.ktm-servizio-desc {
    font-size: 12px;
    color: #a1a5b7;
}

.ktm-servizio-price {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ktm-servizio-price > span:first-child {
    font-size: 14px;
    font-weight: 600;
    color: #181c32;
}

.ktm-servizio-addebito {
    font-size: 11px;
    color: #a1a5b7;
    text-transform: lowercase;
}

.ktm-ordine-empty {
    padding: 16px;
    text-align: center;
    color: #a1a5b7;
    font-size: 13px;
    font-style: italic;
}

.ktm-ordine-servizi.ktm-empty {
    opacity: 0.7;
}

/* Sconto */
.ktm-ordine-sconto {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #fff3cd;
}

.ktm-ordine-sconto-label {
    font-size: 14px;
    font-weight: 600;
    color: #856404;
    text-transform: uppercase;
}

.ktm-ordine-sconto-value {
    font-size: 16px;
    font-weight: 700;
    color: #856404;
}

/* Mancia */
.ktm-ordine-mancia {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #d4edda;
}

.ktm-ordine-mancia-label {
    font-size: 14px;
    font-weight: 600;
    color: #155724;
    text-transform: uppercase;
}

.ktm-ordine-mancia-value {
    font-size: 16px;
    font-weight: 700;
    color: #155724;
}

/* Totale finale */
.ktm-ordine-totale {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 16px;
    margin: 8px 0 16px;
    background: linear-gradient(135deg, #181c32 0%, #2d3154 100%);
    border-radius: 10px;
}

.ktm-ordine-totale-label {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
}

.ktm-ordine-totale-value {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
}

/* Consegna (delivery) */
.ktm-ordine-consegna {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    margin: 8px 0;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.ktm-ordine-consegna-label {
    font-size: 14px;
    font-weight: 600;
    color: #181c32;
}

.ktm-ordine-consegna-value {
    font-size: 14px;
    font-weight: 700;
    /* color via kt-font-info class */
}

/* ============================================
   CHAT - Messaggi Cliente e Note Gestore
   ============================================ */

.ktm-ordine-chat {
    background: #f8f9fa;
    margin-top: 16px;
}

.ktm-ordine-chat .ktm-ordine-section-title {
    background: #e9ecef;
}

.ktm-chat-messages {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ktm-chat-bubble {
    max-width: 85%;
    padding: 12px 16px;
    border-radius: 16px;
    position: relative;
}

/* Bolla Cliente (sinistra) */
.ktm-chat-cliente {
    align-self: flex-start;
    background: #fff;
    border: 1px solid #e4e6ef;
    border-bottom-left-radius: 4px;
}

/* .ktm-chat-cliente .ktm-chat-header - color via kt-font-brand class in JS */

/* Bolla Gestore (destra) */
.ktm-chat-gestore {
    align-self: flex-end;
    background: #3699ff;
    color: #fff;
    border-bottom-right-radius: 4px;
}

.ktm-chat-gestore .ktm-chat-header {
    color: rgba(255, 255, 255, 0.8);
}

.ktm-chat-gestore .ktm-chat-header i {
    color: rgba(255, 255, 255, 0.8);
}

.ktm-chat-gestore .ktm-chat-text {
    color: #fff;
}

/* Header della bolla */
.ktm-chat-header {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ktm-chat-header i {
    font-size: 12px;
}

/* Testo del messaggio */
.ktm-chat-text {
    font-size: 14px;
    line-height: 1.5;
    color: #181c32;
    word-break: break-word;
}

.ktm-chat-text em {
    color: #a1a5b7;
    font-style: italic;
}

/* Bolla vuota (nessun messaggio) */
.ktm-chat-bubble.ktm-chat-empty {
    opacity: 0.6;
}

.ktm-chat-bubble.ktm-chat-empty .ktm-chat-text {
    color: #a1a5b7;
}

/* ===========================================
   SEZIONE DATI CLIENTE (Asporto)
=========================================== */

.ktm-ordine-cliente {
    margin-top: 16px;
}

.ktm-cliente-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ktm-cliente-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 12px;
    background: #f8f9fa;
    border-radius: 8px;
}

.ktm-cliente-label {
    font-size: 11px;
    font-weight: 600;
    color: #a1a5b7;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ktm-cliente-label i {
    font-size: 12px;
    color: #7e8299;
}

.ktm-cliente-value {
    font-size: 14px;
    color: #181c32;
    word-break: break-word;
}

.ktm-cliente-value a {
    text-decoration: none;
}

.ktm-cliente-value a:hover {
    text-decoration: underline;
}

/* ===========================================
   PRENOTAZIONI
=========================================== */

/* Preview card prenotazioni */
.ktm-card-prenotazione-layout {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
}

.ktm-card-prenotazione-layout .ktm-card-text {
    flex: 1;
    min-width: 0;
}

.ktm-card-persone-wrap,
.ktm-card-orari-wrap {
    font-size: 12px;
    color: #7e8299;
    margin-top: 4px;
}

.ktm-card-persone-wrap i,
.ktm-card-orari-wrap i {
    margin-right: 4px;
    color: #a1a5b7;
}

/* SOLD OUT card */
.ktm-card.ktm-card-soldout {
    background: #f64e60 !important;
    border-color: #f64e60 !important;
}

.ktm-card.ktm-card-soldout .ktm-card-title,
.ktm-card.ktm-card-soldout .ktm-card-info-line,
.ktm-card.ktm-card-soldout .ktm-card-info-line i {
    color: #fff !important;
}

.ktm-card.ktm-card-soldout .ktm-ordine-btn {
    background: rgba(255,255,255,0.2) !important;
    color: #fff !important;
}

.ktm-card.ktm-card-soldout .ktm-ordine-btn:hover {
    background: rgba(255,255,255,0.3) !important;
}

/* Badge orari soldout */
.ktm-card-orari-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.ktm-orario-badge {
    display: inline-block;
    padding: 3px 10px;
    background: rgba(255,255,255,0.25);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    border-radius: 12px;
}

/* Data soldout */
.ktm-card.ktm-card-soldout .ktm-card-info-line {
    margin-top: 4px;
}

/* === CONTI === */
.ktm-card.ktm-card-conto .ktm-card-totale-wrap {
    font-size: 14px;
    /* color via kt-font-brand class */
    margin-top: 4px;
}

.ktm-card.ktm-card-conto .ktm-card-totale-status-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
    font-size: 13px;
}

/* Info line (persone - data) */
.ktm-card-info-line {
    font-size: 12px;
    color: #7e8299;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.ktm-card-info-line i {
    color: #a1a5b7;
}

.ktm-card-info-line .ktm-card-date-badge {
    display: inline;
    padding: 0;
    background: none;
    font-size: inherit;
    color: inherit;
}

/* ===== RECENSIONI ===== */
.ktm-card-stars {
    display: inline-flex;
    gap: 2px;
    font-size: 16px;
}

.ktm-card-comment {
    font-size: 13px;
    color: #7e8299;
    margin-top: 6px;
    line-height: 1.4;
    font-style: italic;
}

.ktm-recensione-comment {
    font-size: 14px;
    color: #5e6278;
    line-height: 1.6;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 8px;
    white-space: pre-wrap;
}

.ktm-card-provider-icon {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ktm-card-provider-icon img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

/* ===== FIDELITY ISCRITTI ===== */
.ktm-card-code-wrap {
    margin-top: 4px;
}

.ktm-card-code-wrap code {
    font-size: 12px;
    background: #f3f6f9;
    border-radius: 4px;
}

.ktm-card-punti-wrap {
    margin-top: 6px;
}

.ktm-punti-text {
    font-size: 13px;
    font-weight: 500;
    color: #7e8299;
}

.ktm-punti-text i {
    margin-right: 2px;
}

/* ===== FIDELITY PREMI ===== */
.ktm-card-premio .ktm-card-cat-layout {
    padding: 12px;
}

.ktm-card-premio .ktm-card-title-wrap {
    margin-bottom: 0;
}

.ktm-premio-punti {
    margin-top: 2px;
}

.ktm-premio-punti .ktm-punti-text {
    font-size: 14px;
    font-weight: 600;
}

.ktm-premio-descrizione {
    font-size: 14px;
    line-height: 1.6;
    color: #7e8299;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 8px;
}

/* ===== CRONOLOGIA AZIONI ===== */
.ktm-card-cronologia .ktm-card-info-line {
    font-size: 13px;
    color: #7e8299;
    margin-top: 4px;
}

.ktm-card-cronologia .ktm-card-info-line i {
    margin-right: 4px;
}

.ktm-cronologia-descrizione {
    font-size: 14px;
    line-height: 1.6;
    color: #7e8299;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 8px;
}

.ktm-cronologia-path {
    padding: 8px 12px;
    background: #f8f9fa;
    border-radius: 8px;
}

.ktm-cronologia-path code {
    font-size: 13px;
    background: transparent;
    padding: 0;
}

/* === LISTA FOTO === */
.ktm-card-foto-layout {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.ktm-card-foto-img {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    background: #f5f5f5;
}

.ktm-card-foto-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ktm-foto-counter {
    font-size: 12px;
    color: #7e8299;
}

.ktm-foto-counter i {
    margin-right: 4px;
}

.ktm-foto-separator {
    color: #b5b5c3;
    margin: 0 4px;
}

.ktm-foto-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.foto-tag {
    display: inline-block;
    padding: 4px 10px;
    background: #f5f8fa;
    border: 1px solid #ebedf3;
    border-radius: 4px;
    font-size: 13px;
    color: #3f4254;
}

/* Drawer mobile - Colonna Design (chip orizzontali con label inline) */
.ktm-drawer-field[data-field="design"] .ktm-design-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ktm-design-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 16px;
    background: #f3f6f9;
    color: #2c3e50;
    font-size: 13px;
    font-weight: 500;
}
.ktm-design-chip__img {
    display: block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.ktm-design-chip__label {
    line-height: 1.2;
}
.ktm-design-chip--disabled {
    opacity: 0.55;
    cursor: not-allowed;
}
.ktm-design-chip--disabled .ktm-design-chip__img {
    filter: grayscale(1);
}

/*****************************/
/* Leads (consulenza) mobile */
/*****************************/

/* Card preview */
.ktm-card-lead-layout {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
}
.ktm-lead-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.ktm-lead-source-badge,
.ktm-lead-stage-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    white-space: nowrap;
}
.ktm-card-lead-layout .ktm-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #2c3e50;
}
.ktm-lead-meta {
    font-size: 12px;
    color: #595d6e;
}
.ktm-lead-meta i {
    width: 14px;
    color: #a2a5b9;
}
.ktm-lead-when {
    color: #2c3e50;
    font-weight: 500;
}
.ktm-lead-indicators {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
}
.ktm-lead-ind {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 26px;
    height: 24px;
    padding: 0 8px;
    border-radius: 12px;
    background: #f3f6f9;
    color: #a2a5b9;
    font-size: 11px;
    font-weight: 700;
}
.ktm-lead-ind.is-on {
    background: #e8fff3;
    color: #0abb87;
}
.ktm-lead-ind.is-on-wa {
    background: #e8fff3;
    color: #25d366;
}
.ktm-lead-ind.ktm-lead-temp {
    background: transparent;
    font-size: 15px;
}
.ktm-lead-date {
    font-size: 11px;
    color: #a2a5b9;
}
.ktm-lead-date i {
    margin-right: 3px;
}

/* Drawer - sottotitolo badge */
.ktm-drawer-subtitle .ktm-lead-source-badge,
.ktm-drawer-subtitle .ktm-lead-stage-badge {
    vertical-align: middle;
}

/* Drawer - sezione gestione lead */
.ktm-lead-manage .ktm-lead-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f1f5;
}
.ktm-lead-manage .ktm-lead-control:last-child {
    border-bottom: none;
}
.ktm-lead-control--col {
    flex-direction: column;
    align-items: stretch;
}
.ktm-lead-control-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #3f4254;
}
.ktm-lead-control-label i {
    color: #a2a5b9;
}
.ktm-lead-control--col .ktm-lead-control-label {
    margin-bottom: 10px;
}

/* Contatore chiamate */
.ktm-lead-counter {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}
.ktm-lead-counter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #f3f6f9;
    color: #2c3e50;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}
.ktm-lead-counter-btn:active {
    background: #e1e6ee;
}
.ktm-lead-counter-val {
    min-width: 24px;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #2c3e50;
}

/* Selettore temperatura */
.ktm-lead-temp-selector {
    display: flex;
    align-items: stretch;
    gap: 8px;
}
.ktm-lead-temp-btn {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    padding: 10px 4px;
    border-radius: 8px;
    border: 1px solid #ebedf3;
    background: #fff;
    color: #74788d;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}
.ktm-lead-temp-btn i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 22px;
    font-size: 18px;
    line-height: 1;
}
.ktm-lead-temp-btn.is-active.is-freddo {
    border-color: #5d78ff;
    background: #eef1ff;
    color: #5d78ff;
}
.ktm-lead-temp-btn.is-active.is-medio {
    border-color: #ffb822;
    background: #fff8ec;
    color: #d9a106;
}
.ktm-lead-temp-btn.is-active.is-caldo {
    border-color: #fd397a;
    background: #ffeef4;
    color: #fd397a;
}

/* Nota */
.ktm-lead-note-preview {
    padding: 10px 12px;
    border-radius: 8px;
    background: #f9fafb;
    border: 1px solid #f0f1f5;
    font-size: 13px;
    color: #3f4254;
    margin-bottom: 10px;
    white-space: pre-wrap;
    word-break: break-word;
}
.ktm-lead-note-btn {
    width: 100%;
}

/* Follow-up */
.ktm-lead-followup {
    padding-top: 14px;
}

/* Modal nota lead centrato verticalmente su mobile */
@media (max-width: 768px) {
    #manage-note .modal-dialog {
        display: flex;
        align-items: center;
        min-height: calc(100% - 1rem);
    }
}

/* Overlay loading azioni leads */
#ktm-leads-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 100000;
    align-items: center;
    justify-content: center;
}
.ktm-leads-overlay-loader {
    width: 66px;
    height: 66px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #5867dd;
    font-size: 30px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
}
