/* =====================================================================
   JS Support Ticket 1.2.8 - fix leggibilita' con il dark mode del template
   xenixsrl.com - template Amitza (T4)
   VERSIONE 2

   Tutte le regole usano lo stesso prefisso :has(> #jsst-header-main-wrapper)
   in modo che abbiano la stessa specificita': cosi' vince l'ordine di
   scrittura e non ci sono conflitti tra una regola e l'altra.
   L'header viene incluso da ogni layout del componente, quindi il prefisso
   intercetta il contenitore reale qualunque sia il markup del template.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. LA TELA - sfondo chiaro sull'intero componente
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) {
    background-color: #ffffff !important;
    color: #2b2b2b !important;
    color-scheme: light;
    padding: 12px !important;
    border-radius: 4px;
}

/* ---------------------------------------------------------------------
   2. AZZERAMENTO - tutto trasparente e testo scuro.
   :not([style*="background"]) preserva i colori di priorita' e stato,
   che arrivano dal database come stile inline.
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) *:not([style*="background"]) {
    background-color: transparent !important;
}

:has(> #jsst-header-main-wrapper) * {
    color: #2b2b2b !important;
    text-shadow: none !important;
}

/* ---------------------------------------------------------------------
   3. LINK generici
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) a {
    color: #4f6df5 !important;
}

:has(> #jsst-header-main-wrapper) a:hover {
    color: #2b2b2b !important;
}

/* ---------------------------------------------------------------------
   4. BARRA HEADER con i tab
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) #jsst-header {
    background-color: #4f6df5 !important;
    border-radius: 4px 4px 0 0;
}

:has(> #jsst-header-main-wrapper) .jsst-header-tab a.js-cp-menu-link {
    background-color: #ffffff !important;
    color: #2b2b2b !important;
    border: 1px solid #d1d1d1 !important;
}

:has(> #jsst-header-main-wrapper) .jsst-header-tab a.js-cp-menu-link.selected {
    background-color: transparent !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
}

:has(> #jsst-header-main-wrapper) .jsst-header-tab a.js-cp-menu-link:hover {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
    border-color: #2b2b2b !important;
}

/* Barra dei breadcrumb sotto l'header */
:has(> #jsst-header-main-wrapper) #jsst-wrapper-top {
    background-color: #f7f7f7 !important;
    border: 1px solid #ebecec !important;
}

/* ---------------------------------------------------------------------
   5. COLONNA "DASHBOARD LINKS"
   Qui stava il caso peggiore: testo scuro su fondo nero del tema.
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) #js-dash-menu-link-wrp {
    background-color: #ffffff !important;
    border: 1px solid #ebecec !important;
}

:has(> #jsst-header-main-wrapper) .js-section-heading {
    background-color: #f5f2f5 !important;
    color: #2b2b2b !important;
    border-bottom: 1px solid #ebecec !important;
}

:has(> #jsst-header-main-wrapper) a.js-ticket-dash-menu {
    background-color: #ffffff !important;
    color: #2b2b2b !important;
    border-bottom: 1px solid #ebecec !important;
}

:has(> #jsst-header-main-wrapper) a.js-ticket-dash-menu:hover {
    background-color: #f2f5ff !important;
    color: #4f6df5 !important;
}

:has(> #jsst-header-main-wrapper) a.js-ticket-dash-menu .js-ticket-dash-menu-text {
    color: inherit !important;
}

/* ---------------------------------------------------------------------
   6. BOX, RIQUADRI, CONTATORI
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) .js-support-ticket-cont,
:has(> #jsst-header-main-wrapper) .js-ticket-count,
:has(> #jsst-header-main-wrapper) .js-ticket-latest-ticket-wrapper,
:has(> #jsst-header-main-wrapper) .js-ticket-data-list-wrp,
:has(> #jsst-header-main-wrapper) .js-ticket-top-search-wrp,
:has(> #jsst-header-main-wrapper) .js-ticket-search-fields-wrp,
:has(> #jsst-header-main-wrapper) .js-ticket-wrapper,
:has(> #jsst-header-main-wrapper) .js-ticket-feedback-list-wrapper,
:has(> #jsst-header-main-wrapper) #js-tk-formwrapper,
:has(> #jsst-header-main-wrapper) #js-filter-wrapper-toggle-area,
:has(> #jsst-header-main-wrapper) #js-ticket-main-popup,
:has(> #jsst-header-main-wrapper) #jl_pagination {
    background-color: #ffffff !important;
}

:has(> #jsst-header-main-wrapper) .js-support-ticket-box,
:has(> #jsst-header-main-wrapper) .js-ticket-link,
:has(> #jsst-header-main-wrapper) .js-ticket-row,
:has(> #jsst-header-main-wrapper) .js-ticket-data,
:has(> #jsst-header-main-wrapper) .jsst-feedback-det-list,
:has(> #jsst-header-main-wrapper) .js-ticket-download-box {
    background-color: #ffffff !important;
    border: 1px solid #ebecec !important;
}

:has(> #jsst-header-main-wrapper) .js-ticket-haeder,
:has(> #jsst-header-main-wrapper) .js-ticket-heading-wrp,
:has(> #jsst-header-main-wrapper) .js-ticket-downloads-heading-wrp,
:has(> #jsst-header-main-wrapper) .js-ticket-categories-heading-wrp,
:has(> #jsst-header-main-wrapper) .js-ticket-feedback-heading,
:has(> #jsst-header-main-wrapper) #js-pm-graphtitle {
    background-color: #f5f2f5 !important;
    color: #2b2b2b !important;
}

:has(> #jsst-header-main-wrapper) .js-support-ticket-desc {
    color: #5a5a5a !important;
}

/* Righe di tabella e liste ticket */
:has(> #jsst-header-main-wrapper) table,
:has(> #jsst-header-main-wrapper) thead,
:has(> #jsst-header-main-wrapper) tbody,
:has(> #jsst-header-main-wrapper) tr,
:has(> #jsst-header-main-wrapper) th,
:has(> #jsst-header-main-wrapper) td {
    background-color: #ffffff !important;
    color: #2b2b2b !important;
    border-color: #ebecec !important;
}

/* ---------------------------------------------------------------------
   7. CAMPI DEL FORM
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) input,
:has(> #jsst-header-main-wrapper) select,
:has(> #jsst-header-main-wrapper) textarea {
    background-color: #ffffff !important;
    color: #2b2b2b !important;
    border: 1px solid #d1d1d1 !important;
}

:has(> #jsst-header-main-wrapper) ::placeholder {
    color: #8a8a8a !important;
    opacity: 1;
}

:has(> #jsst-header-main-wrapper) .tox-tinymce,
:has(> #jsst-header-main-wrapper) .tox-toolbar__primary,
:has(> #jsst-header-main-wrapper) .tox-edit-area,
:has(> #jsst-header-main-wrapper) .mce-panel {
    background-color: #ffffff !important;
    border-color: #d1d1d1 !important;
}

/* ---------------------------------------------------------------------
   8. BOTTONI - ultimi, cosi' vincono su link e campi form.
   Qui stava il bug della v1: il testo prendeva il blu dei link
   e spariva sul fondo blu del bottone.
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) a.js-support-ticket-btn,
:has(> #jsst-header-main-wrapper) a.js-ticket-header-link,
:has(> #jsst-header-main-wrapper) a.js-ticket-data-btn,
:has(> #jsst-header-main-wrapper) a.js-ticket-login-btn,
:has(> #jsst-header-main-wrapper) a.js-ticket-download-btn-style,
:has(> #jsst-header-main-wrapper) button.js-search-button,
:has(> #jsst-header-main-wrapper) button.js-ticket-download-btn-style,
:has(> #jsst-header-main-wrapper) .js-search-filter-btn,
:has(> #jsst-header-main-wrapper) .js-ticket-form-btn-wrp input,
:has(> #jsst-header-main-wrapper) input[type="submit"],
:has(> #jsst-header-main-wrapper) input[type="button"],
:has(> #jsst-header-main-wrapper) button[type="submit"],
:has(> #jsst-header-main-wrapper) .btn-primary {
    background-color: #4f6df5 !important;
    color: #ffffff !important;
    border: 1px solid #4f6df5 !important;
    text-decoration: none !important;
}

/* Bottone reset in versione chiara, per distinguerlo dal cerca */
:has(> #jsst-header-main-wrapper) button.js-reset-button {
    background-color: #ffffff !important;
    color: #4f6df5 !important;
    border: 1px solid #4f6df5 !important;
}

:has(> #jsst-header-main-wrapper) a.js-support-ticket-btn:hover,
:has(> #jsst-header-main-wrapper) a.js-ticket-header-link:hover,
:has(> #jsst-header-main-wrapper) a.js-ticket-data-btn:hover,
:has(> #jsst-header-main-wrapper) a.js-ticket-login-btn:hover,
:has(> #jsst-header-main-wrapper) a.js-ticket-download-btn-style:hover,
:has(> #jsst-header-main-wrapper) button.js-search-button:hover,
:has(> #jsst-header-main-wrapper) button.js-reset-button:hover,
:has(> #jsst-header-main-wrapper) .js-search-filter-btn:hover,
:has(> #jsst-header-main-wrapper) .js-ticket-form-btn-wrp input:hover,
:has(> #jsst-header-main-wrapper) input[type="submit"]:hover,
:has(> #jsst-header-main-wrapper) button[type="submit"]:hover {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
    border-color: #2b2b2b !important;
}

/* ---------------------------------------------------------------------
   9. BADGE di priorita' e stato - il colore arriva dal database
   come stile inline, il testo deve restare bianco.
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) [style*="background"],
:has(> #jsst-header-main-wrapper) .js-tk-priorty,
:has(> #jsst-header-main-wrapper) .js-ticket-header-priorty {
    color: #ffffff !important;
}

:has(> #jsst-header-main-wrapper) .js-ticket-status {
    background-color: #f8fcfe !important;
    color: #2b2b2b !important;
    border: 1px solid #ebecec !important;
}

/* ---------------------------------------------------------------------
   10. MESSAGGI DI SISTEMA
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) .alert,
:has(> #jsst-header-main-wrapper) .alert * {
    color: #2b2b2b !important;
}

:has(> #jsst-header-main-wrapper) .alert-danger,
:has(> #jsst-header-main-wrapper) .alert-danger * {
    color: #871414 !important;
}

/* ---------------------------------------------------------------------
   11. COPYRIGHT in fondo
   --------------------------------------------------------------------- */
:has(> #jsst-header-main-wrapper) #js-tk-copyright,
:has(> #jsst-header-main-wrapper) #js-tk-copyright * {
    color: #6c757d !important;
}

:has(> #jsst-header-main-wrapper) #js-tk-copyright a {
    color: #4f6df5 !important;
}
