/* =========================================================
   Bootstrap Opacity Extension
   Aggiunge varianti -25, -50, -75 per text-, bg-, border-
   Compatibile con Bootstrap 5.3
   ========================================================= */

/* Funzione CSS custom per generare RGBA da variabili Bootstrap */
:root {
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 25, 135, 84;
  --bs-danger-rgb: 220, 53, 69;
  --bs-warning-rgb: 255, 193, 7;
  --bs-info-rgb: 13, 202, 240;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  /* nuovi colori */
  --bs-purple-rgb: 153, 0, 255;
  --bs-blue-rgb: 0, 51, 153;
  --bs-red-rgb: 204, 0, 0;
}

/* ======== TEXT COLORS ======== */

.text-primary-25  { color: rgba(var(--bs-primary-rgb), .25) !important; }
.text-primary-50  { color: rgba(var(--bs-primary-rgb), .5)  !important; }
.text-primary-75  { color: rgba(var(--bs-primary-rgb), .75) !important; }

.text-secondary-25  { color: rgba(var(--bs-secondary-rgb), .25) !important; }
.text-secondary-50  { color: rgba(var(--bs-secondary-rgb), .5)  !important; }
.text-secondary-75  { color: rgba(var(--bs-secondary-rgb), .75) !important; }

.text-success-25  { color: rgba(var(--bs-success-rgb), .25) !important; }
.text-success-50  { color: rgba(var(--bs-success-rgb), .5)  !important; }
.text-success-75  { color: rgba(var(--bs-success-rgb), .75) !important; }

.text-danger-25  { color: rgba(var(--bs-danger-rgb), .25) !important; }
.text-danger-50  { color: rgba(var(--bs-danger-rgb), .5)  !important; }
.text-danger-75  { color: rgba(var(--bs-danger-rgb), .75) !important; }

.text-warning-25  { color: rgba(var(--bs-warning-rgb), .25) !important; }
.text-warning-50  { color: rgba(var(--bs-warning-rgb), .5)  !important; }
.text-warning-75  { color: rgba(var(--bs-warning-rgb), .75) !important; }

.text-info-25  { color: rgba(var(--bs-info-rgb), .25) !important; }
.text-info-50  { color: rgba(var(--bs-info-rgb), .5)  !important; }
.text-info-75  { color: rgba(var(--bs-info-rgb), .75) !important; }

.text-light-25  { color: rgba(var(--bs-light-rgb), .25) !important; }
.text-light-50  { color: rgba(var(--bs-light-rgb), .5)  !important; }
.text-light-75  { color: rgba(var(--bs-light-rgb), .75) !important; }

.text-dark-25  { color: rgba(var(--bs-dark-rgb), .25) !important; }
.text-dark-50  { color: rgba(var(--bs-dark-rgb), .5)  !important; }
.text-dark-75  { color: rgba(var(--bs-dark-rgb), .75) !important; }

.text-white-25  { color: rgba(var(--bs-white-rgb), .25) !important; }
.text-white-50  { color: rgba(var(--bs-white-rgb), .5)  !important; }
.text-white-75  { color: rgba(var(--bs-white-rgb), .75) !important; }

.text-black-25  { color: rgba(var(--bs-black-rgb), .25) !important; }
.text-black-50  { color: rgba(var(--bs-black-rgb), .5)  !important; }
.text-black-75  { color: rgba(var(--bs-black-rgb), .75) !important; }

/* ======== BACKGROUND COLORS ======== */
.bg-primary-25  { background-color: rgba(var(--bs-primary-rgb), .25) !important; }
.bg-primary-50  { background-color: rgba(var(--bs-primary-rgb), .5)  !important; }
.bg-primary-75  { background-color: rgba(var(--bs-primary-rgb), .75) !important; }

.bg-secondary-25 { background-color: rgba(var(--bs-secondary-rgb), .25) !important; }
.bg-secondary-50 { background-color: rgba(var(--bs-secondary-rgb), .5)  !important; }
.bg-secondary-75 { background-color: rgba(var(--bs-secondary-rgb), .75) !important; }

.bg-success-25 { background-color: rgba(var(--bs-success-rgb), .25) !important; }
.bg-success-50 { background-color: rgba(var(--bs-success-rgb), .5)  !important; }
.bg-success-75 { background-color: rgba(var(--bs-success-rgb), .75) !important; }

.bg-danger-25 { background-color: rgba(var(--bs-danger-rgb), .25) !important; }
.bg-danger-50 { background-color: rgba(var(--bs-danger-rgb), .5)  !important; }
.bg-danger-75 { background-color: rgba(var(--bs-danger-rgb), .75) !important; }

.bg-warning-25 { background-color: rgba(var(--bs-warning-rgb), .25) !important; }
.bg-warning-50 { background-color: rgba(var(--bs-warning-rgb), .5)  !important; }
.bg-warning-75 { background-color: rgba(var(--bs-warning-rgb), .75) !important; }

.bg-info-25 { background-color: rgba(var(--bs-info-rgb), .25) !important; }
.bg-info-50 { background-color: rgba(var(--bs-info-rgb), .5)  !important; }
.bg-info-75 { background-color: rgba(var(--bs-info-rgb), .75) !important; }

.bg-light-25 { background-color: rgba(var(--bs-light-rgb), .25) !important; }
.bg-light-50 { background-color: rgba(var(--bs-light-rgb), .5)  !important; }
.bg-light-75 { background-color: rgba(var(--bs-light-rgb), .75) !important; }

.bg-dark-25 { background-color: rgba(var(--bs-dark-rgb), .25) !important; }
.bg-dark-50 { background-color: rgba(var(--bs-dark-rgb), .5)  !important; }
.bg-dark-75 { background-color: rgba(var(--bs-dark-rgb), .75) !important; }

/* ======== BORDER COLORS ======== */
.border-primary-25 { border-color: rgba(var(--bs-primary-rgb), .25) !important; }
.border-primary-50 { border-color: rgba(var(--bs-primary-rgb), .5)  !important; }
.border-primary-75 { border-color: rgba(var(--bs-primary-rgb), .75) !important; }

.border-secondary-25 { border-color: rgba(var(--bs-secondary-rgb), .25) !important; }
.border-secondary-50 { border-color: rgba(var(--bs-secondary-rgb), .5)  !important; }
.border-secondary-75 { border-color: rgba(var(--bs-secondary-rgb), .75) !important; }

.border-success-25 { border-color: rgba(var(--bs-success-rgb), .25) !important; }
.border-success-50 { border-color: rgba(var(--bs-success-rgb), .5)  !important; }
.border-success-75 { border-color: rgba(var(--bs-success-rgb), .75) !important; }

.border-danger-25 { border-color: rgba(var(--bs-danger-rgb), .25) !important; }
.border-danger-50 { border-color: rgba(var(--bs-danger-rgb), .5)  !important; }
.border-danger-75 { border-color: rgba(var(--bs-danger-rgb), .75) !important; }

.border-warning-25 { border-color: rgba(var(--bs-warning-rgb), .25) !important; }
.border-warning-50 { border-color: rgba(var(--bs-warning-rgb), .5)  !important; }
.border-warning-75 { border-color: rgba(var(--bs-warning-rgb), .75) !important; }

.border-info-25 { border-color: rgba(var(--bs-info-rgb), .25) !important; }
.border-info-50 { border-color: rgba(var(--bs-info-rgb), .5)  !important; }
.border-info-75 { border-color: rgba(var(--bs-info-rgb), .75) !important; }

.border-light-25 { border-color: rgba(var(--bs-light-rgb), .25) !important; }
.border-light-50 { border-color: rgba(var(--bs-light-rgb), .5)  !important; }
.border-light-75 { border-color: rgba(var(--bs-light-rgb), .75) !important; }

.border-dark-25 { border-color: rgba(var(--bs-dark-rgb), .25) !important; }
.border-dark-50 { border-color: rgba(var(--bs-dark-rgb), .5)  !important; }
.border-dark-75 { border-color: rgba(var(--bs-dark-rgb), .75) !important; }



/* =========================================================
   Bootstrap Custom Colors Extension
   Colori aggiuntivi: purple, blue, red
   Include versioni base e opacità 25/50/75
   ========================================================= */


/* ======================= TEXT ======================= */
.text-purple      { color: rgb(var(--bs-purple-rgb)) !important; }
.text-purple-25   { color: rgba(var(--bs-purple-rgb), .25) !important; }
.text-purple-50   { color: rgba(var(--bs-purple-rgb), .5)  !important; }
.text-purple-75   { color: rgba(var(--bs-purple-rgb), .75) !important; }

.text-blue        { color: rgb(var(--bs-blue-rgb)) !important; }
.text-blue-25     { color: rgba(var(--bs-blue-rgb), .25) !important; }
.text-blue-50     { color: rgba(var(--bs-blue-rgb), .5)  !important; }
.text-blue-75     { color: rgba(var(--bs-blue-rgb), .75) !important; }

.text-red         { color: rgb(var(--bs-red-rgb)) !important; }
.text-red-25      { color: rgba(var(--bs-red-rgb), .25) !important; }
.text-red-50      { color: rgba(var(--bs-red-rgb), .5)  !important; }
.text-red-75      { color: rgba(var(--bs-red-rgb), .75) !important; }

/* ======================= BACKGROUND ======================= */
.bg-purple        { background-color: rgb(var(--bs-purple-rgb)) !important; color: #fff !important; }
.bg-purple-25     { background-color: rgba(var(--bs-purple-rgb), .25) !important; }
.bg-purple-50     { background-color: rgba(var(--bs-purple-rgb), .5)  !important; }
.bg-purple-75     { background-color: rgba(var(--bs-purple-rgb), .75) !important; }

.bg-blue          { background-color: rgb(var(--bs-blue-rgb)) !important; color: #fff !important; }
.bg-blue-25       { background-color: rgba(var(--bs-blue-rgb), .25) !important; }
.bg-blue-50       { background-color: rgba(var(--bs-blue-rgb), .5)  !important; }
.bg-blue-75       { background-color: rgba(var(--bs-blue-rgb), .75) !important; }

.bg-red           { background-color: rgb(var(--bs-red-rgb)) !important; color: #fff !important; }
.bg-red-25        { background-color: rgba(var(--bs-red-rgb), .25) !important; }
.bg-red-50        { background-color: rgba(var(--bs-red-rgb), .5)  !important; }
.bg-red-75        { background-color: rgba(var(--bs-red-rgb), .75) !important; }

/* ======================= BORDER ======================= */
.border-purple    { border-color: rgb(var(--bs-purple-rgb)) !important; }
.border-purple-25 { border-color: rgba(var(--bs-purple-rgb), .25) !important; }
.border-purple-50 { border-color: rgba(var(--bs-purple-rgb), .5)  !important; }
.border-purple-75 { border-color: rgba(var(--bs-purple-rgb), .75) !important; }

.border-blue      { border-color: rgb(var(--bs-blue-rgb)) !important; }
.border-blue-25   { border-color: rgba(var(--bs-blue-rgb), .25) !important; }
.border-blue-50   { border-color: rgba(var(--bs-blue-rgb), .5)  !important; }
.border-blue-75   { border-color: rgba(var(--bs-blue-rgb), .75) !important; }

.border-red       { border-color: rgb(var(--bs-red-rgb)) !important; }
.border-red-25    { border-color: rgba(var(--bs-red-rgb), .25) !important; }
.border-red-50    { border-color: rgba(var(--bs-red-rgb), .5)  !important; }
.border-red-75    { border-color: rgba(var(--bs-red-rgb), .75) !important; }

/* ======================= BUTTONS ======================= */
.btn-purple {
  --bs-btn-bg: rgb(var(--bs-purple-rgb));
  --bs-btn-border-color: rgb(var(--bs-purple-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-purple-rgb));            
  --bs-btn-hover-border-color: rgb(var(--bs-purple-rgb));
  --bs-btn-active-bg: rgba(var(--bs-purple-rgb), .70);
  --bs-btn-active-border-color: rgba(var(--bs-purple-rgb), .70);
  --bs-btn-disabled-bg: rgba(var(--bs-purple-rgb), .30);
  --bs-btn-disabled-border-color: rgba(var(--bs-purple-rgb), .30);
  color: #fff !important;
}

.btn-outline-purple {
  --bs-btn-color: rgb(var(--bs-purple-rgb));
  --bs-btn-border-color: rgb(var(--bs-purple-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-purple-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-purple-rgb));
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: rgba(var(--bs-purple-rgb), .80);
  --bs-btn-active-border-color: rgba(var(--bs-purple-rgb), .80);
}

.btn-red {
  --bs-btn-bg: rgb(var(--bs-red-rgb));
  --bs-btn-border-color: rgb(var(--bs-red-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-red-rgb));               
  --bs-btn-hover-border-color: rgb(var(--bs-red-rgb));
  --bs-btn-active-bg: rgba(var(--bs-red-rgb), .70);
  --bs-btn-active-border-color: rgba(var(--bs-red-rgb), .70);
  --bs-btn-disabled-bg: rgba(var(--bs-red-rgb), .30);
  --bs-btn-disabled-border-color: rgba(var(--bs-red-rgb), .30);
  color: #fff !important;
}

.btn-outline-red {
  --bs-btn-color: rgb(var(--bs-red-rgb));
  --bs-btn-border-color: rgb(var(--bs-red-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-red-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-red-rgb));
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: rgba(var(--bs-red-rgb), .80);
  --bs-btn-active-border-color: rgba(var(--bs-red-rgb), .80);
}

.btn-blue {
  --bs-btn-bg: rgb(var(--bs-blue-rgb));
  --bs-btn-border-color: rgb(var(--bs-blue-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-blue-rgb), .85);
  --bs-btn-hover-border-color: rgba(var(--bs-blue-rgb), .85);
  --bs-btn-active-bg: rgba(var(--bs-blue-rgb), .75);
  --bs-btn-active-border-color: rgba(var(--bs-blue-rgb), .75);
  --bs-btn-disabled-bg: rgba(var(--bs-blue-rgb), .25);
  --bs-btn-disabled-border-color: rgba(var(--bs-blue-rgb), .25);
  color: #fff !important;
}

.btn-outline-blue {
  --bs-btn-color: rgb(var(--bs-blue-rgb));
  --bs-btn-border-color: rgb(var(--bs-blue-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-blue-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-blue-rgb));
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: rgba(var(--bs-blue-rgb), .9);
  --bs-btn-active-border-color: rgba(var(--bs-blue-rgb), .9);
}