/* ============================================= */
/*   XL FATTER PILL MENU - WHITE BG + GRADIENT TEXT */
/* ============================================= */

.btn-pill {
    display: flex;
    align-items: center;
    justify-content: center;           /* Center text */
    width: 100%;
    padding: 22px 28px;                /* Fatter / taller pill */ 
    font-size: 17px;                   /* Bigger text */
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
     text-align: center;
    border: none;
    border-radius: 9999px;             /* Extra round pill */
    background: #ffffff;               /* White background */
    color: transparent;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
    transition: all 0.35s cubic-bezier(0.34, 1.61, 0.7, 1.3);
    text-decoration: none;
    margin-bottom: 8px;
}

.btn-pill:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(6, 132, 171, 0.20);
    background: #f8f9fa;
}

/* Gradient Text */
.btn-pill span {
    background: linear-gradient(310deg, #00b4eb, #b864ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Active State */
.btn-pill.active {
    background: linear-gradient(310deg, #00b4eb, #b864ff) !important;
    box-shadow: 0 10px 25px rgba(6, 132, 171, 0.30);
}

.btn-pill.active span {
    color: #fff;
    -webkit-text-fill-color: #fff;
}

  

.bg-gradient-faded-primary-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(6,132,171,.3) 0, #0684ab 100%);
}
.bg-gradient-faded-secondary-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(113,113,122,.3) 0, #71717a 100%);
}
.bg-gradient-faded-success-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(99,194,33,.3) 0, #63c221 100%);
}
.bg-gradient-faded-info-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(23,193,232,.3) 0, #17c1e8 100%);
}
.bg-gradient-faded-warning-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(245,57,57,.3) 0, #f53939 100%);
}
.bg-gradient-faded-danger-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(234,6,6,.3) 0, #ea0606 100%);
}
.bg-gradient-faded-light-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(233,236,239,.3) 0, #e9ecef 100%);
}
.bg-gradient-faded-dark-vertical {
  background-image: radial-gradient(200px circle at 50% 70%, rgba(37,47,64,.3) 0, #252f40 100%);
}
.alert-primary { background-image: linear-gradient(310deg, #00b4eb, #a53bff); }
.alert-secondary { background-image: linear-gradient(310deg, #627594, #8ca1cb); }
.alert-success { background-image: linear-gradient(310deg, #17ad37, #84dc14); }
.alert-info { background-image: linear-gradient(310deg, #2152ff, #02c6f3); }
.alert-warning { background-image: linear-gradient(310deg, #f53939, #fac60b); }
.alert-danger { background-image: linear-gradient(310deg, #ea0606, #ff3d59); }
.alert-light { background-image: linear-gradient(310deg, #ced4da, #d1dae6); }
.alert-dark { background-image: linear-gradient(310deg, #141727, #2c3154); }
.bg-gradient-faded-primary {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(6,132,171,.6) 0, #045e7a 100%);
}
.bg-gradient-faded-secondary {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(113,113,122,.6) 0, #585860 100%);
}
.bg-gradient-faded-success {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(99,194,33,.6) 0, #4d961a 100%);
}
.bg-gradient-faded-info {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(23,193,232,.6) 0, #129aba 100%);
}
.bg-gradient-faded-warning {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(245,57,57,.6) 0, #ef0c0c 100%);
}
.bg-gradient-faded-danger {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(234,6,6,.6) 0, #b80505 100%);
}
.bg-gradient-faded-light {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(233,236,239,.6) 0, #cbd3da 100%);
}
.bg-gradient-faded-dark {
  background-image: radial-gradient(370px circle at 80% 50%, rgba(37,47,64,.6) 0, #121720 100%);
}
.bg-gradient-primary {
  background-image: linear-gradient(310deg, #00b4eb, #b864ff);
  background-repeat: repeat-x;
}
.bg-gradient-secondary {
  background-image: linear-gradient(310deg, #627594, #a8b8d8);
  background-repeat: repeat-x;
}
.bg-gradient-success {
  background-image: linear-gradient(310deg, #17ad37, #98ec2d);
  background-repeat: repeat-x;
}
.bg-gradient-info {
  background-image: linear-gradient(310deg, #2152ff, #21d4fd);
  background-repeat: repeat-x;
}
.bg-gradient-warning {
  background-image: linear-gradient(310deg, #f53939, #fbcf33);
  background-repeat: repeat-x;
}
.bg-gradient-danger {
  background-image: linear-gradient(310deg, #ea0606, #ff667c);
  background-repeat: repeat-x;
}
.bg-gradient-light {
  background-image: linear-gradient(310deg, #ced4da, #ebeff4);
  background-repeat: repeat-x;
}
.bg-gradient-dark {
  background-image: linear-gradient(310deg, #141727, #3a416f);
  background-repeat: repeat-x;
}


btn.bg-gradient-primary:hover{background-color:#0684ab;border-color:#0684ab}.btn.bg-gradient-primary .btn.bg-outline-primary{border:1px solid #0684ab}.btn.bg-gradient-primary:not(:disabled):not(.disabled).active,.btn.bg-gradient-primary:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-primary.dropdown-toggle{color:#fff;background-color:#0684ab}.btn.bg-gradient-primary.focus,.btn.bg-gradient-primary:focus{color:#fff}.btn-outline-primary{box-shadow:none}.btn-outline-primary:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#0684ab}.btn.bg-gradient-secondary:hover{background-color:#71717a;border-color:#71717a}.btn.bg-gradient-secondary .btn.bg-outline-secondary{border:1px solid #71717a}.btn.bg-gradient-secondary:not(:disabled):not(.disabled).active,.btn.bg-gradient-secondary:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-secondary.dropdown-toggle{color:#fff;background-color:#71717a}.btn.bg-gradient-secondary.focus,.btn.bg-gradient-secondary:focus{color:#fff}.btn-outline-secondary{box-shadow:none}.btn-outline-secondary:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#71717a}.btn.bg-gradient-success:hover{background-color:#63c221;border-color:#63c221}.btn.bg-gradient-success .btn.bg-outline-success{border:1px solid #63c221}.btn.bg-gradient-success:not(:disabled):not(.disabled).active,.btn.bg-gradient-success:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-success.dropdown-toggle{color:#fff;background-color:#63c221}.btn.bg-gradient-success.focus,.btn.bg-gradient-success:focus{color:#fff}.btn-outline-success{box-shadow:none}.btn-outline-success:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#63c221}.btn.bg-gradient-info:hover{background-color:#17c1e8;border-color:#17c1e8}.btn.bg-gradient-info .btn.bg-outline-info{border:1px solid #17c1e8}.btn.bg-gradient-info:not(:disabled):not(.disabled).active,.btn.bg-gradient-info:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-info.dropdown-toggle{color:#fff;background-color:#17c1e8}.btn.bg-gradient-info.focus,.btn.bg-gradient-info:focus{color:#fff}.btn-outline-info{box-shadow:none}.btn-outline-info:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#17c1e8}.btn.bg-gradient-warning:hover{background-color:#f53939;border-color:#f53939}.btn.bg-gradient-warning .btn.bg-outline-warning{border:1px solid #f53939}.btn.bg-gradient-warning:not(:disabled):not(.disabled).active,.btn.bg-gradient-warning:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-warning.dropdown-toggle{color:#fff;background-color:#f53939}.btn.bg-gradient-warning.focus,.btn.bg-gradient-warning:focus{color:#fff}.btn-outline-warning{box-shadow:none}.btn-outline-warning:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#f53939}.btn.bg-gradient-danger:hover{background-color:#ea0606;border-color:#ea0606}.btn.bg-gradient-danger .btn.bg-outline-danger{border:1px solid #ea0606}.btn.bg-gradient-danger:not(:disabled):not(.disabled).active,.btn.bg-gradient-danger:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-danger.dropdown-toggle{color:#fff;background-color:#ea0606}.btn.bg-gradient-danger.focus,.btn.bg-gradient-danger:focus{color:#fff}.btn-outline-danger{box-shadow:none}.btn-outline-danger:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#ea0606}.btn.bg-gradient-light:hover{background-color:#e9ecef;border-color:#e9ecef}.btn.bg-gradient-light .btn.bg-outline-light{border:1px solid #e9ecef}.btn.bg-gradient-light:not(:disabled):not(.disabled).active,.btn.bg-gradient-light:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-light.dropdown-toggle{color:#212529;background-color:#e9ecef}.btn-outline-light{box-shadow:none}.btn-outline-light:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#e9ecef}.btn.bg-gradient-dark:hover{background-color:#252f40;border-color:#252f40}.btn.bg-gradient-dark .btn.bg-outline-dark{border:1px solid #252f40}.btn.bg-gradient-dark:not(:disabled):not(.disabled).active,.btn.bg-gradient-dark:not(:disabled):not(.disabled):active,.show>.btn.bg-gradient-dark.dropdown-toggle{color:#fff;background-color:#252f40}.btn.bg-gradient-dark.focus,.btn.bg-gradient-dark:focus{color:#fff}.btn-outline-dark{box-shadow:none}.btn-outline-dark:hover:not(.active){background-color:transparent;opacity:.75;box-shadow:none;color:#252f40}.btn.bg-gradient-danger,.btn.bg-gradient-danger:hover,.btn.bg-gradient-dark,.btn.bg-gradient-dark:hover,.btn.bg-gradient-info,.btn.bg-gradient-info:hover,.btn.bg-gradient-primary,.btn.bg-gradient-primary:hover,.btn.bg-gradient-secondary,.btn.bg-gradient-secondary:hover,.btn.bg-gradient-success,.btn.bg-gradient-success:hover,.btn.bg-gradient-warning,.btn.bg-gradient-warning:hover{color:#fff}.btn.bg-gradient-light,.btn.bg-gradient-light:hover{color:#3a416f}.btn-outline-white{border-color:hsla(0,0%,100%,.75);background:hsla(0,0%,100%,.1)}.btn-success,.btn-success.focus,.btn-success:focus,.btn.bg-gradient-success.focus,.btn.bg-gradient-success:focus{color:#fff!important}.btn-grow{transition:all .2s ease-in-out}.btn-grow:hover{transform:scale(1.02)}.btn.btn-round{border-radius:1.875rem}.fade{transition:opacity .15s linear}



/* ============================================= */
/*   ALL GRADIENTS - BIG BANG THEME (Cleaned)    */
/* ============================================= */

/* 1. Text Gradients */
.text-gradient.text-primary { background-image: linear-gradient(310deg, #00b4eb, #b864ff); }
.text-gradient.text-info    { background-image: linear-gradient(310deg, #2152ff, #21d4fd); }
.text-gradient.text-success { background-image: linear-gradient(310deg, #17ad37, #c1e823); }
.text-gradient.text-warning { background-image: linear-gradient(310deg, #f53939, #fbcf33); }
.text-gradient.text-danger  { background-image: linear-gradient(310deg, #d60808, #ff6690); }
.text-gradient.text-dark    { background-image: linear-gradient(310deg, #141727, #3a416f); }

/* 2. Background Gradients */
.bg-gradient-primary {
  background-image: linear-gradient(310deg, #00b4eb, #b864ff);
  background-repeat: repeat-x;
}
.bg-gradient-secondary {
  background-image: linear-gradient(310deg, #627594, #a8b8d8);
  background-repeat: repeat-x;
}
.bg-gradient-success {
  background-image: linear-gradient(310deg, #17ad37, #98ec2d);
  background-repeat: repeat-x;
}
.bg-gradient-info {
  background-image: linear-gradient(310deg, #2152ff, #21d4fd);
  background-repeat: repeat-x;
}
.bg-gradient-warning {
  background-image: linear-gradient(310deg, #f53939, #fbcf33);
  background-repeat: repeat-x;
}
.bg-gradient-danger {
  background-image: linear-gradient(310deg, #ea0606, #ff667c);
  background-repeat: repeat-x;
}
.bg-gradient-light {
  background-image: linear-gradient(310deg, #ced4da, #ebeff4);
  background-repeat: repeat-x;
}
.bg-gradient-dark {
  background-image: linear-gradient(310deg, #141727, #3a416f);
  background-repeat: repeat-x;
}

/* 3. Faded Radial Gradients (370px) */
.bg-gradient-faded-primary  { background-image: radial-gradient(370px circle at 80% 50%, rgba(6,132,171,.6) 0, #045e7a 100%); }
.bg-gradient-faded-secondary{ background-image: radial-gradient(370px circle at 80% 50%, rgba(113,113,122,.6) 0, #585860 100%); }
.bg-gradient-faded-success  { background-image: radial-gradient(370px circle at 80% 50%, rgba(99,194,33,.6) 0, #4d961a 100%); }
.bg-gradient-faded-info     { background-image: radial-gradient(370px circle at 80% 50%, rgba(23,193,232,.6) 0, #129aba 100%); }
.bg-gradient-faded-warning  { background-image: radial-gradient(370px circle at 80% 50%, rgba(245,57,57,.6) 0, #ef0c0c 100%); }
.bg-gradient-faded-danger   { background-image: radial-gradient(370px circle at 80% 50%, rgba(234,6,6,.6) 0, #b80505 100%); }
.bg-gradient-faded-light    { background-image: radial-gradient(370px circle at 80% 50%, rgba(233,236,239,.6) 0, #cbd3da 100%); }
.bg-gradient-faded-dark     { background-image: radial-gradient(370px circle at 80% 50%, rgba(37,47,64,.6) 0, #121720 100%); }

/* 4. Vertical Faded Radial Gradients (200px) */
.bg-gradient-faded-primary-vertical  { background-image: radial-gradient(200px circle at 50% 70%, rgba(6,132,171,.3) 0, #0684ab 100%); }
.bg-gradient-faded-secondary-vertical{ background-image: radial-gradient(200px circle at 50% 70%, rgba(113,113,122,.3) 0, #71717a 100%); }
.bg-gradient-faded-success-vertical  { background-image: radial-gradient(200px circle at 50% 70%, rgba(99,194,33,.3) 0, #63c221 100%); }
.bg-gradient-faded-info-vertical     { background-image: radial-gradient(200px circle at 50% 70%, rgba(23,193,232,.3) 0, #17c1e8 100%); }
.bg-gradient-faded-warning-vertical  { background-image: radial-gradient(200px circle at 50% 70%, rgba(245,57,57,.3) 0, #f53939 100%); }
.bg-gradient-faded-danger-vertical   { background-image: radial-gradient(200px circle at 50% 70%, rgba(234,6,6,.3) 0, #ea0606 100%); }
.bg-gradient-faded-light-vertical    { background-image: radial-gradient(200px circle at 50% 70%, rgba(233,236,239,.3) 0, #e9ecef 100%); }
.bg-gradient-faded-dark-vertical     { background-image: radial-gradient(200px circle at 50% 70%, rgba(37,47,64,.3) 0, #252f40 100%); }

/* 5. Alert Gradients */
.alert-primary  { background-image: linear-gradient(310deg, #00b4eb, #a53bff); }
.alert-secondary{ background-image: linear-gradient(310deg, #627594, #8ca1cb); }
.alert-success  { background-image: linear-gradient(310deg, #17ad37, #84dc14); }
.alert-info     { background-image: linear-gradient(310deg, #2152ff, #02c6f3); }
.alert-warning  { background-image: linear-gradient(310deg, #f53939, #fac60b); }
.alert-danger   { background-image: linear-gradient(310deg, #ea0606, #ff3d59); }
.alert-light    { background-image: linear-gradient(310deg, #ced4da, #d1dae6); }
.alert-dark     { background-image: linear-gradient(310deg, #141727, #2c3154); }