/*
Theme Name: Deverso BS5 current
Theme URI: https://tuosito.com
Author: Il tuo nome
Author URI: https://tuosito.com
Description: Tema personalizzato per Deverso con Bootstrap 5.3
Version: latest
License: GPL v2 or later
Text Domain: deverso-website-bs5
Tags: bootstrap, bootstrap5, responsive, custom-menu, custom-logo, featured-images, translation-ready
*/

/* ==========================================================================
   Variabili CSS personalizzate
   ========================================================================== */
:root {
    line-height: 150%; /* 27px */
    --website-primary: #0148E2;
    --website-primary-dark: #0D3424;
    --website-secondary: rgba(106, 52, 0, 0.80);
    --website-secondary-full: #6A3400;
    --website-third:#FFF5E2;
    --website-fourth:#FFE9BD;
    --website-accent: #BA5C00;
    --website-bkg-light: #ECF5FC;
    --website-bkg-white: #ffffff;
    --website-txt-white: #EAEAEA;
    --website-bkg-btn: #008668;
    --website-white: #FFFFFF;
    --website-bkg-sidebar: #262937;
    --website-color-txt-title: #3D3D3D;
    --website-color-txt-body: #4D5359;
    --website-color-title-footer: #fff;
    --website-color-txt-footer: #eee;
    --website-container-full-max-width: 2400px;
    --website-container-max-width: 1440px;
    --website-box-max-width: 800px;
    --website-box-max-width-redux: 1200px;
    --website-max-width-container-title-header: 720px;
    --website-padding-top-bottom-header: 160px;
    --website-padding-top-bottom: 60px;
    --website-padding-top-bottom-mini: 40px;
    --website-padding-top-bottom-mobile: 40px;
    --website-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(6, 147, 227, 0.25);

    /* ----------------------------------------------------------------------
       icotea 2026 — token ricavati dalle grafiche (sviluppo-html/).
       I nomi ricalcano le variabili usate nell'export Figma.
       NOTA: la palette definitiva verra' consolidata in un secondo momento;
       header e footer usano gia' solo queste variabili, quindi il restyle
       cromatico si fara' modificando qui.
       ---------------------------------------------------------------------- */
    --icotea-brand-blue: #0148E2;        /* --brand-blue   : link, icone, CTA */
    --icotea-brand-blue-dark: #013BB8;   /* hover di brand-blue */
    --icotea-dark-blue: #002B56;         /* --dark-blu     : testo scuro */
    --icotea-second-title: #00458A;      /* --second-title : voci di menu */
    --icotea-accent: #FFB024;            /* giallo evidenza */
    --icotea-accent-dark: #E89A10;       /* hover del giallo */
    --icotea-jolly: #D9E0E7;             /* --jolly        : fondo footer */
    --icotea-jolly-2: #F4F6F9;           /* --jolly-2      : fondi chiari */
    --icotea-body-bg: #EEF1F1;           /* fondo pagina */
    --icotea-hero-content-bg: #E4EAEA;
    --icotea-text-muted: #576272;        /* testo secondario */
    --icotea-white: #FFFFFF;
    --icotea-base-color-alt: #f5f5f7;
    --icotea-base-color: #dedee5;
    --icotea-bkg-uni: #F6F6F8;
    --icotea-color-uni: #696996;
    --icotea-color-mepa: #3B34E0;
    --icotea-homepage-section1: #E7ECEC;
    --icotea-homepage-section2: #CCD6D6;
    --icotea-stroke-color: #9BADC0;
    --icotea-font-heading: 'Urbanist', sans-serif;
    --icotea-font-body: 'DM Sans', sans-serif;

    --icotea-header-height: 78px;
    --icotea-container-max: 1380px;
}

/* Contenitore standard dei contenuti: max 1380px, centrato.
   Usato da header, footer e da tutti i widget di contenuto. */
.container-max {
    width: 100%;
    max-width: var(--icotea-container-max);
    margin-inline: auto;
    /*
    padding-inline: clamp(16px, 4vw, 49px);

     */
    box-sizing: border-box;
}

body>div.deversoOverlayLoadingPage{
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}
body>div.deversoOverlayLoadingPage svg{
    opacity: 0.1;
}

.highlightWidget{
    border: 5px dashed red!important;
}

.blurWidget{
    filter: blur(5px)!important;
}

/*
hide WPML
 */
body .otgs-development-site-front-end,
body #included-files-fie-on-wp-footer,
body .wpml-ls-legacy-list-horizontal.wpml-ls-statics-footer{
    display: none!important;
}

main#primary.bkgGrey,
header#website-header.bkgGrey{
    background-color: var(--icotea-body-bg);
}

main#primary.bkgWhite,
header#website-header.bkgWhite{
    background-color: #ffffff;
}


.icotea-price-box {
    width: 45%;
    padding: 16px;
    background: #F6F6F8;
    border-radius: 14px;
    outline: 1px solid #E2E8F0;
    outline-offset: -1px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-sizing: border-box;
    margin: 2rem 2rem 2rem 0;
    float: left;
    min-height: 150px;
}
.icotea-price-box .ipb-label {
    margin: 0 0 1rem;
    color: #90A1B9;
    font-family: var(--icotea-font-heading);
    font-size: 1rem;      /* 12px */
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: .1em;
}
.icotea-price-box .ipb-label span { display: block; text-transform: none; }
.icotea-price-box .ipb-price {
    margin: 0;
    color: #3D3D6B;
    font-family: var(--icotea-font-heading);
    font-size: 1.875rem;    /* 30px */
    font-weight: 700;
    line-height: 1.2;
}
.icotea-price-box .ipb-price span { font-size: 1.125rem; margin-left: 4px; }

/* Block pattern "Elenco numerato" (icotea/elenco-numerato) */
.icotea-numlist {
    list-style: none;
    counter-reset: item;
    margin: 0;
    padding: 0;
    border-top: 1px solid #E2E8F0;
}
.icotea-numlist li {
    counter-increment: item;
    display: flex;
    gap: 20px;
    padding: 20px 0;       /* annulla il padding-left del tema */
    position: static;      /* annulla position:relative del tema */
    border-bottom: 1px solid #E2E8F0;
    color: var(--icotea-dark-blue, #002B56);
    font-family: var(--icotea-font-heading);
    font-size: 1.25rem;   /* 20px */
    line-height: 1.4;      /* 28px */
    font-weight: 600;
}
/* Sovrascrive .wp-block-list li::before (pallino svg) di theme.css */
.icotea-numlist li::before {
    content: counter(item, decimal-leading-zero) "." !important;
    position: static !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    flex: none;
    width: 28px;
    height: auto !important;
    padding-top: 4px;
    background: none !important;
    background-image: none !important;
    color: #90A1B9;
    font-family: var(--icotea-font-heading);
    font-size: .75rem;    /* 12px */
    font-weight: 400;
    line-height: 1.333;
}

/* Blocco "Servizi con icone" (icona in cerchio + etichetta) */
.icotea-servizi-icone {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 32px 16px;
    align-items: start;
}
.icotea-servizi-icone .isi-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
}
.icotea-servizi-icone .isi-ico {
    width: 64px;
    height: 64px;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    outline: 2px solid #1F2B5B;
    outline-offset: -2px;
}
.icotea-servizi-icone .isi-ico img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}
.icotea-servizi-icone .isi-label {
    max-width: 165px;
    color: #1F2B5B;
    font-family: var(--icotea-font-body);
    font-size: .6875rem;   /* ~11px — micro-label */
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .65px;
    line-height: 1.36;
}
