/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   🍎 APPLE FIX UNIVERSAL - FORZA TEMA SU TUTTO IL SITO
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* RESET COMPLETO */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* VARIABILI LIGHT MODE (DEFAULT) */
:root,
html,
body,
html.theme-light,
body.theme-light {
    --bg: #ffffff !important;
    --bg-alt: #f5f5f7 !important;
    --text: #1d1d1f !important;
    --text-muted: #86868b !important;
    --border: #d2d2d7 !important;
    --accent: #007aff !important;
    --primary: #007aff !important;
    --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif !important;
}

/* VARIABILI DARK MODE */
html.theme-dark,
body.theme-dark {
    --bg: #000000 !important;
    --bg-alt: #1c1c1e !important;
    --text: #f5f5f7 !important;
    --text-muted: #98989d !important;
    --border: #38383a !important;
    --accent: #0a84ff !important;
    --primary: #0a84ff !important;
}

/* FORZA APPLICAZIONE GLOBALE */
html,
body {
    background: var(--bg) !important;
    color: var(--text) !important;
    font-family: var(--font) !important;
    min-height: 100vh !important;
}

/* FORZA SU TUTTI I CONTAINER */
.qms,
.container,
main,
#app,
[class*="wrapper"],
[class*="content"] {
    background: transparent !important;
    color: var(--text) !important;
}

/* NAVBAR PULITA */
.qms-nav,
nav[class*="nav"],
header[class*="nav"] {
    background: var(--bg-alt) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 12px !important;
}

/* PULSANTI NAVBAR */
.qms-btn,
.qms-nav a,
.qms-nav button {
    background: transparent !important;
    color: var(--text) !important;
    border: 1px solid transparent !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
}

.qms-btn:hover,
.qms-nav a:hover,
.qms-nav button:hover {
    background: var(--bg) !important;
    border-color: var(--border) !important;
}

/* PULSANTE ATTIVO */
.qms-btn.active,
.qms-btn--primary,
.qms-nav a.active {
    background: var(--accent) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* CARD/SEZIONI */
.card,
[class*="card"],
.section,
fieldset {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

/* TABELLE */
table {
    background: var(--bg) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    width: 100% !important;
}

thead {
    background: var(--accent) !important;
}

thead th {
    color: #ffffff !important;
    font-weight: 600 !important;
    padding: 12px !important;
}

tbody tr {
    background: var(--bg) !important;
    border-bottom: 1px solid var(--border) !important;
    transition: background 0.2s ease !important;
}

tbody tr:hover {
    background: var(--bg-alt) !important;
}

tbody td {
    color: var(--text) !important;
    padding: 12px !important;
}

/* TITOLI */
h1, h2, h3, h4, h5, h6 {
    color: var(--text) !important;
    font-family: var(--font) !important;
}

/* INPUT/FORM */
input,
select,
textarea,
.form-control {
    background: var(--bg) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-family: var(--font) !important;
}

/* PULSANTI GENERICI */
button,
.btn {
    background: var(--accent) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px 20px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

button:hover,
.btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
}

/* MODALE */
.modal-content,
[class*="modal"] {
    background: var(--bg) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
}

/* DARK MODE SPECIFICO */
html.theme-dark h1,
html.theme-dark h2,
html.theme-dark h3,
html.theme-dark h4,
html.theme-dark h5,
html.theme-dark h6 {
    color: var(--text) !important;
}