/*========================================
Ready64 CSS versione 4.0 by Roberto Nicoletti
CSS Style Colore Bianco
========================================*/

:root {
  /* ================================================= */
  /* VARIABILI PER TEMA BIANCO */
  /* ================================================= */

  /* TEMA BIANCO - COLORI CHIARI */
  --brown-950: #ffffff; /* BIANCO PURO (Invariato) */
  --brown-900: #f8f8f8; /* QUASI BIANCO - Più luminoso per distanziarsi dal 700 */
  --brown-700: #e0e0e0; /* GRIGIO MOLTO CHIARO - Aumentato contrasto rispetto al 500 */
  --brown-500: #c0c0c0; /* GRIGIO NEUTRO - Punto di stacco netto */
  --brown-300: #a2a2a2; /* LOGO (Invariato) */

  --tan: #2b55a2;
  --wheat: #1a3a71;

  --primary-700: #001d50; /* Blu scuro */
  --primary-500: #2b55a2; /* Blu medio */
  --primary-300: #4a7de0; /* Blu chiaro */

  --secondary-300: #708fa2;
  --secondary-500: #566d7c;
  --secondary-700: #3c4c57;
  --secondary-900: #2a353c;

  --danger-300: #ff6b5a;
  --danger-500: #e74c3c;
  --danger-700: #b83a37;

  --success-300: #66bb6a;
  --success-500: #2e7d32;
  --success-700: #1b5e20;

  --warning-300: #f7d36b;
  --warning-500: #d98c00;
  --warning-700: #9c5f00;

  --info-300: #4fc3f7;
  --info-500: #03a9f4;
  --info-700: #017ba0;

  --purple-300: #a569bd;
  --purple-500: #8e44ad;
  --purple-700: #6d2d91;

  /* ADDITIONAL COLORS TEMA BIANCO */
  --ready64-blue: #483aaa;
  --ready64-blue-light: #867ade;
  --black: #000000;
  --white: #ffffff;
  --gray-200: #333333; /* Grigio scuro per testi su sfondo chiaro */

  /* Tipografia e layout */
  --font-ui:
    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial;
  --radius: 4px;
  --gap: 14px;

  --header-logo: url("../images/logo_ready64_bianco.png");
  --bg-footer: url("../images/bg_noise_blue.png");
  --bg-footer-bottom: url("../images/bg_noise_blue_sf.png");

  --container-bg: var(--brown-300);

  /* GRADIENTS PER TEMA BIANCO */

  --gradient-titolo: linear-gradient(
    to bottom,
    #b8b8b8 0%,
    /* Luce superiore (leggermente sopra il logo) */ #a2a2a2 4%,
    /* Il grigio del tuo LOGO (brown-300) */ #7f7f7f 33%,
    /* Grigio medio morbido */ #666666 48%,
    /* Il punto più scuro è ora molto più dolce */ #555555 52%,
    /* Bilanciamento centrale */ #555555 100%
      /* Base finale: un grigio scuro deciso ma non opprimente */
  );

  /* 2. GRADIENT GENERICO - GREY/BLACK (per pulsanti, tab, elementi base) */
  --gradient-generic: linear-gradient(
    to bottom,
    #555555 0%,
    /* Grigio medio (punto di partenza) */ #3c3c3c 25%,
    /* Transizione */ #2a2a2a 50%,
    /* Intermedio (corrisponde al 33% del titolo) */ #1e1e1e 75%,
    /* Scuro */ #101010 100% /* Nero finale coerente con il titolo */
  );

  /* 3. GRADIENT HOVER - BLU (per hover di pulsanti, tab attivi) */
  --gradient-generic-hover: linear-gradient(
    to bottom,
    var(--primary-300) 0%,
    var(--primary-500) 25%,
    var(--primary-700) 50%,
    #001e51 75%,
    #001d50 100%
  );
}

/*========================================
* 1. BODY - TEMA BIANCO
==========================================*/
body {
  background: repeating-linear-gradient(
    to bottom,
    var(--brown-900) 0px,
    /* #ffffff */ var(--brown-900) 2px,
    var(--brown-500) 2px,
    /* #dee2e6 */ var(--brown-500) 3px
  );
  background-color: var(--brown-900);
  font-family: var(--font-ui);
  color: var(--black); /* Testo nero su sfondo bianco */
  font-size: 15px;
}

/* HELPERS 2025-12-27*/

/* <code> Articoli, ecc. */
@font-face {
  font-family: "Commodore64";
  src: url("/css/fonts/C64_Pro_Mono-STYLE.woff");
}

/* Voto Grande */
.cal-sans-regular {
  font-family: "Cal Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-shadow:
    1px 1px 0 #000,
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000;
  font-size: 28px;
  color: var(--warning-500); /* #d98c00 */
}

/* LINK UNIVERSALI - TEMA BIANCO */
a:link,
a:visited,
a:active {
  text-decoration: none;
  font-family: inherit;
  color: var(--tan); /* #004a99 */
}
a:hover {
  text-decoration: none;
  color: #ba0000; /* Rosso hover da stile_bianco originale */
}

/* HR - TEMA BIANCO */

hr {
  border-top: 1px dashed var(--brown-300); /* #ced4da */
}

.hr-2 {
  border-top: 1px dashed var(--tan); /* #004a99 */
  margin: 4px 0 !important;
}

/* VISUALIZZA BASIC V2 C= Commodore 64 */
code {
  display: block;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-size: 8px;
  color: var(--white);
  background: var(--ready64-blue);
  width: auto;
  max-width: 100%;
  border: 1px solid var(--ready64-blue-light);
  padding: 15px;
  margin: 10px 0;
  font-family: "Commodore64", "Consolas", monospace;
  text-transform: uppercase;
  line-height: 1.4;
  border-radius: 6px;
}
code a {
  color: cyan !important;
}
code a:hover {
  color: yellow !important;
}
.code-simple {
  font-family:
    "Commodore64", "Consolas", "Monaco", "Liberation Mono", "Courier New",
    monospace;
  text-transform: uppercase;
  line-height: normal;
  font-size: 8px;
  background: var(--ready64-blue);
  padding: 4px;
  border: 1px solid var(--ready64-blue-light);
  border-radius: 4px;
  margin-bottom: 5px !important;
}

/***************************************
  Titoli <h1>, <h2>... <h6>
***************************************/
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: var(--tan) !important; /* #004a99 */
  font-weight: bold;
  margin: 0 !important;
  text-decoration: none !important;
}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
h1 a:focus,
h2 a:focus,
h3 a:focus,
h4 a:focus,
h5 a:focus,
h6 a:focus {
  text-decoration: none;
  outline: none;
  color: var(--danger-500); /* Rosso hover */
}
blockquote {
  background: var(--brown-500); /* #dee2e6 */
  border-left: 10px solid var(--tan); /* #004a99 */
}

blockquote:before {
  color: var(--black);
}