/* ========= Amaranto Design Tokens ========= */
:root {
    /* brand */
    --brand-50: #F5E7E6;
    --brand-100: #EBD0CC;
    --brand-200: #D7A099;
    --brand-300: #C27166;
    --brand-400: #AE4133;
    --brand-500: #9A1200;
    --brand-600: #830F00;
    --brand-700: #6C0D00;
    --brand-800: #550A00;
    --brand-900: #3E0700;
    /* surfaces & text */
    --surface-1: #FFFFFF;
    --surface-2: #FAF6F5;
    --surface-3: #F4ECEB;
    --text-900: #1F1D1C;
    --text-600: #4A4948;
    --text-400: #8C8A89;
    /* accents */
    --accent-amber: #FFC04D;
    --accent-rose: #FF8A70;
    /* radii & shadows */
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --radius-pill: 9999px;
    --shadow-soft: 0 8px 24px rgba(154,18,0,.12), 0 2px 8px rgba(0,0,0,.06);
    --shadow-card: 0 12px 32px rgba(154,18,0,.13), 0 3px 12px rgba(0,0,0,.07);
    --shadow-strong: 0 18px 48px rgba(154,18,0,.18), 0 6px 18px rgba(0,0,0,.10);
}

/* ========= Global look & feel ========= */
body {
    -webkit-text-size-adjust: 100%; /* fallback per WebKit/Safari etc. */
    text-size-adjust: 100%; /* standard per Chrome, Edge, altri moderni */
    background: radial-gradient(1200px 600px at 10% -10%, var(--brand-50), transparent), radial-gradient(900px 600px at 110% 10%, var(--surface-3), transparent), var(--surface-2);
    color: var(--text-900);
}

/* Navbar amaranto */
.navbar-amaranto {
    background: var(--brand-600) linear-gradient(180deg, var(--brand-600), var(--brand-700));
    box-shadow: var(--shadow-card);
}

    .navbar-amaranto .navbar-brand,
    .navbar-amaranto .nav-link {
        color: #fff;
    }

        .navbar-amaranto .nav-link:hover {
            color: #ffe8e3;
        }

/* Buttons */
.btn-primary {
    background-color: var(--brand-600);
    border-color: var(--brand-600);
    box-shadow: var(--shadow-soft);
}

    .btn-primary:hover {
        background-color: var(--brand-700);
        border-color: var(--brand-700);
    }

.btn-outline-primary {
    border-color: var(--brand-300);
    color: var(--brand-700);
}

    .btn-outline-primary:hover {
        background: var(--brand-50);
        border-color: var(--brand-400);
    }

/* Cards generiche */
.card {
    border: 1px solid rgba(0,0,0,.05);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-card);
}

    .card .card-header {
        border-bottom: 0;
        background: transparent;
    }

/* Feature card “touch” */
.feature-card {
    border-radius: var(--radius-xl);
    transition: transform .18s ease, box-shadow .18s ease;
}

    .feature-card:hover {
        transform: translateY(-3px);
        box-shadow: var(--shadow-strong);
    }

/* Titoli/sottotitoli di sezione */
.feature-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-900);
}

.feature-sub {
    font-size: .95rem;
    color: var(--text-600);
}

/* Chip */
.chip {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: var(--surface-3);
    color: var(--text-600);
    padding: .5rem .75rem;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(0,0,0,.06);
}

    .chip .material-icons {
        font-size: 18px;
        color: var(--brand-600);
    }

.badge-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    background: var(--accent-amber);
}

/* Today bookings list */
.today-booking-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid #eee;
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.04);
    margin-bottom: 10px;
}

.today-booking-title {
    font-weight: 600;
    margin: 0;
    font-size: medium;
}

.today-booking-sub {
    margin: 0;
    color: #6c757d;
    font-size: .9rem;
}

/* Pills di stato */
.pill {
    border-radius: var(--radius-pill);
    padding: 6px 10px;
    font-size: .8rem;
    color: #fff;
    white-space: nowrap;
}

.pill-active {
    background: var(--brand-600);
}

.pill-completed {
    background: #198754;
}
/* success */
.pill-cancelled {
    background: #dc3545;
}
/* danger */

/* Empty state */
.empty-state {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: #f8f9fa;
    border: 1px dashed #e2e5e9;
    border-radius: var(--radius-lg);
    color: #6c757d;
}

/* Banner ritardi */
.delay-banner {
    background: var(--brand-50);
    border: 1px solid var(--brand-200);
    border-radius: var(--radius-xl);
}

    .delay-banner h6 {
        color: var(--brand-700);
        font-weight: 700;
    }

    .delay-banner .material-icons {
        color: var(--brand-600);
    }

/* Issue card */
.issue-card {
    border-radius: var(--radius-lg);
    background: #fff;
    transition: background .2s, box-shadow .2s;
}

    .issue-card:hover {
        background: #fafafa;
        box-shadow: 0 4px 12px rgba(0,0,0,.08);
    }

/* ====== FINISHING TOUCHES AMARANTO ====== */

/* navbar: gradient più morbido e testo più leggibile */
.navbar-amaranto {
    background: linear-gradient(180deg, var(--brand-600) 0%, var(--brand-700) 100%);
    box-shadow: var(--shadow-card);
    min-height: 70px;
}

    .navbar-amaranto .navbar-brand,
    .navbar-amaranto .nav-link {
        color: #fff;
    }

        .navbar-amaranto .nav-link:hover {
            color: #ffe8e3;
        }

/* container sotto navbar fissa */
.body-content {
    padding-top: 65px;
}

/* card base + sollevamento */
.card {
    border: 1px solid rgba(0,0,0,.05);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-card);
}

.feature-card {
    border-radius: var(--radius-xl);
    transition: transform .18s ease, box-shadow .18s ease;
}

    .feature-card:hover {
        transform: translateY(-3px);
        box-shadow: var(--shadow-strong);
    }

/* titoli/sezioni */
.feature-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-900);
}

.feature-sub {
    font-size: .95rem;
    color: var(--text-600);
}

/* “tile” Home con bolla icona a destra */
.tile {
    padding: 14px 18px;
}

.icon-bubble {
    width: 88px;
    height: 88px;
    border-radius: 16px;
    background: var(--surface-3);
    border: 1px solid rgba(0,0,0,.06);
    display: grid;
    place-items: center;
    box-shadow: var(--shadow-soft);
}

    .icon-bubble img {
        width: 78px;
        height: 62px;
        object-fit: contain;
    }

/* empty state neutro (niente alert azzurra) */
.empty-card {
    background: var(--surface-3);
    border: 1px dashed rgba(0,0,0,.12);
    border-radius: var(--radius-xl);
    color: var(--text-600);
}

/* banner ritardi “caldo” e coerente */
.delay-banner {
    background: var(--brand-50);
    border: 1px solid var(--brand-200);
    border-radius: var(--radius-xl);
}

    .delay-banner h6 {
        color: var(--brand-700);
        font-weight: 700;
    }

    .delay-banner .material-icons {
        color: var(--brand-600);
    }

/* lista di oggi */
.today-booking-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
    margin-bottom: 10px;
}

.today-booking-title {
    font-weight: 600;
    margin: 0;
}

.today-booking-sub {
    margin: 0;
    color: #6c757d;
    font-size: .9rem;
}

/* pills stato */
.pill {
    border-radius: var(--radius-pill);
    padding: 6px 10px;
    font-size: .8rem;
    color: #fff;
    white-space: nowrap;
}

.pill-active {
    background: var(--brand-600);
}

.pill-completed {
    background: #198754;
}

.pill-cancelled {
    background: #dc3545;
}

/* === Global App Loader ================================================ */
:root{
  --loader-bg: rgba(250,250,250,.92);
  --loader-fg: #9A1200; /* amaranto brand */
}
@media (prefers-color-scheme: dark){
  :root{
    --loader-bg: rgba(18,18,18,.92);
    --loader-fg: #ffded6;
  }
}

/* blocca lo scroll quando il loader è attivo */
body.app-loading {
  overflow: hidden !important;
}

/* overlay a schermo intero */
#appLoader {
    position: fixed;
    inset: 0;
    background: var(--loader-bg);
    z-index: 2147483000; /* altissimo, sopra a modali/bootstrap */
    display: none; /* nascosto di default */
    align-items: center;
    justify-content: center;
    /* Proprietà standard per browser moderni */
    backdrop-filter: blur(1px);
    /* Prefisso WebKit per Safari/iOS più vecchi */
    -webkit-backdrop-filter: blur(1px);
}

/* visibile quando aggiungiamo la classe al body */
#appLoader.is-visible { display: flex; }

/* spinner stile "material" */
.app-spinner {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 4px solid transparent;
  border-top-color: var(--loader-fg);
  animation: appspin 0.9s linear infinite;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.02) inset;
}

@keyframes appspin {
  to { transform: rotate(360deg); }
}

/* messaggio opzionale */
#appLoader .app-msg {
  margin-top: 14px;
  font-weight: 600;
  color: var(--text-700, #444);
  text-align: center;
  font-size: .95rem;
}
@media (prefers-color-scheme: dark){
  #appLoader .app-msg { color: #e0e0e0; }
}