.btnDisplayDoctolib {
    background: #5a70ee;
    border: none;
    font-size: 20px;
    border-radius: 10px;
    min-height: 38px;
    padding: 14px;
    color: white;
    margin-bottom: 50px;
    cursor: pointer;
    padding-right: 0px;
  }

  .btnDisplayDoctolib:hover {
    background: #fe6d6e;
  }
  .btnDisplayDoctolib::after {
    content: '+';
    padding:14px;
    background: #5a70ee;
    margin-right: 0px;
    margin-left:20px;
    border-radius: 0px 10px 10px 0px;

  }

  @media screen and (max-width: 600px) {
    .btnDisplayDoctolib::after {
        content:none;
    }
    .btnDisplayDoctolib {
        width:90%;
    }
  }

  #ranking_zone {
    margin-top:20px;
    margin-bottom:20px;
  }

  #loader_display_doctolib {
    background:white;
    border-radius:4px;
    width:60%;
    margin:auto;
    margin-bottom:40px;
    margin-top:40px;
  }

  p#loading_timer {
    font-size:28px;
    font-family: 'Poppins';
    font-weight:bold;
    color:#518dc8;
    margin-bottom:0px;
    margin-top:25px;
  }

  @media screen and (max-width: 760px) {
    #ranking_zone {
      margin-top:40px;
      margin-bottom:40px;
    }
  }

  /* LOADER */
  .ltx-pulse-loader svg polyline#ltx-pulse-back {
      stroke: #47ccc8
  }

  .ltx-pulse-loader svg polyline#ltx-pulse-front {
      stroke: #000;
      stroke-dasharray: 12,36;
      stroke-dashoffset: 48;
      -webkit-animation: ltxDash 1s linear infinite;
      animation: ltxDash 1s linear infinite
  }

  .ltx-pulse-loader svg polyline {
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round
  }

  @-webkit-keyframes ltxDash {
      62.5% {
          opacity: 0
      }

      to {
          stroke-dashoffset: 0
      }
  }

  @keyframes ltxDash {
      62.5% {
          opacity: 0
      }

      to {
          stroke-dashoffset: 0
      }
  }

  @-webkit-keyframes ltxPulse {
      62.5% {
          transform: scale(1)
      }

      95% {
          transform: scale(.85)
      }

      to {
          transform: scale(1)
      }
  }

  @keyframes ltxPulse {
      62.5% {
          transform: scale(1)
      }

      95% {
          transform: scale(.85)
      }

      to {
          transform: scale(1)
      }
  }

    .strip_list ul li a {
        color:#3f4079;
    }
    .strip_list ul li a:hover {
        color:#e85388;
    }

    @media screen and (max-width: 1280px)
    {
        .image-profil {
            display:none;
        }
    }

    .rdv_link {
      color:#e74e84 !important;
    }
    .rdv_link:hover {
      color:white !important;
    }
    .whiteWhenHover:hover .rdv_link {
      color:white !important;
    }
    .whiteWhenHover:hover {
      color:white !important;
    }

  /* LOADER */

  .loader {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: #FF3D00;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    }

    @keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
    }

    .link-next-availability {
      color: #e74e84;
      
    }
    .link-next-availability:hover {
      color: white;
      background-color: #e74e84;
    }


    .btn-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    }


    .btn-wrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, indigo, hotpink, gold);
    border-radius: 0.75rem; /* équivalent rounded-xl */
    filter: blur(9px);
    opacity: 0.6;
    transition: opacity 1s ease;
    }


    .btn-wrapper:hover::before {
    opacity: 1;
    transition-duration: 0.2s;
    }


    .btn-comparator {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 2rem; /* équivalent px-8 py-3 */
    font-size: 1rem;
    font-weight: 500;
    border-radius: 0.75rem;
    background-color: #e91e63; 
    color: #fff;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    }

    .btn-comparator:hover {
    background-color: #ff357a; 
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(75,85,99,0.3);
    }

    .link-update-comparator {
        color: #9d200b !important;
        cursor: pointer;
    }
    
    .link-update-comparator:hover {
        color: #ff357a !important;
    }

    .link-update-comparator:active {
        color: white !important;
        background-color: #ff357a;
    }




/* CSS pour la nouvelle carte de consultation immédiate */
/* =============================================== */
/* Styles for Immediate Availability Card (ia-card)*/
/* =============================================== */

.rdv_link {
    color:#e74e84 !important;
}
.rdv_link:hover {
    color:white !important;
}
.whiteWhenHover:hover .rdv_link {
    color:white !important;
}
.whiteWhenHover:hover {
    color:white !important;
}

.loader {
width: 48px;
height: 48px;
border: 5px solid #FFF;
border-bottom-color: #FF3D00;
border-radius: 50%;
display: inline-block;
box-sizing: border-box;
animation: rotation 1s linear infinite;
}

@keyframes rotation {
0% {
        transform: rotate(0deg);
}
100% {
        transform: rotate(360deg);
}
}

.link-next-availability {
    color: #e74e84;
    
}
.link-next-availability:hover {
    color: white;
    background-color: #e74e84;
}


.btn-wrapper {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 1rem;
}


.btn-wrapper::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(to right, indigo, hotpink, gold);
border-radius: 0.75rem; /* équivalent rounded-xl */
filter: blur(9px);
opacity: 0.6;
transition: opacity 1s ease;
}


.btn-wrapper:hover::before {
opacity: 1;
transition-duration: 0.2s;
}


.btn-comparator {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.75rem 2rem; /* équivalent px-8 py-3 */
font-size: 1rem;
font-weight: 500;
border-radius: 0.75rem;
background-color: #e91e63; 
color: #fff;
text-decoration: none;
transition: all 0.2s ease;
cursor: pointer;
border: none;
}

.btn-comparator:hover {
background-color: #ff357a; 
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(75,85,99,0.3);
}

.link-update-comparator {
        color: #9d200b !important;
        cursor: pointer;
}

.link-update-comparator:hover {
        color: #ff357a !important;
}

.link-update-comparator:active {
        color: white !important;
        background-color: #ff357a;
}


/* immediate consultation */
/* CSS pour la nouvelle carte de consultation immédiate */
/* =============================================== */
/* Styles for Immediate Availability Card (ia-card)*/
/* =============================================== */

.ia-card-container {
position: relative; /* Nécessaire pour le badge maiia.com */
max-width: 896px; /* max-w-4xl */
margin: 20px auto;
background-color: #fff;
border-radius: 1rem; /* rounded-2xl */
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* shadow-lg */
transition: box-shadow 0.3s ease-in-out;
padding: 1.5rem; /* p-6 */
display: flex;
align-items: center;
gap: 1.5rem; /* space-x-6 */
font-family: sans-serif; /* font-sans */
color: #334155; /* text-gray-800 -> text-slate-700 */
}

.ia-card-container:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* hover:shadow-xl */
}

.ia-card-image {
flex-shrink: 0;
}

.ia-image {
height: 5rem; /* h-20 */
width: 5rem; /* w-20 */
object-fit: cover;
border-radius: 9999px; /* rounded-full */
}

.ia-card-main-content {
flex-grow: 1;
display: flex;
justify-content: space-between;
align-items: flex-start;
}

.ia-card-info {
display: flex;
flex-direction: column;
}

.ia-info-name {
font-size: 18px; /* text-xl */
font-weight: 700; /* font-bold */
color: #1e293b; /* text-slate-800 */
margin: 0;
}

.ia-info-speciality {
color: #64748b; /* text-slate-500 */
margin: 0;
}

.ia-info-tags {
display: flex;
gap: 0.75rem; /* space-x-3 */
margin-top: 0.75rem; /* mt-3 */
}

.ia-tag-video {
display: inline-flex;
align-items: center;
font-size: 0.875rem; /* text-sm */
font-weight: 500; /* font-medium */
color: #0369a1; /* text-sky-700 */
background-color: #e0f2fe; /* bg-sky-100 */
border-radius: 9999px; /* rounded-full */
padding: 0.25rem 0.75rem; /* px-3 py-1 */
}

.ia-info-address {
display: flex;
align-items: center;
color: #94a3b8; /* text-slate-400 */
margin-top: 1rem; /* mt-4 */
}

.ia-address-text {
font-size: 0.875rem; /* text-sm */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.ia-card-actions {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 0.75rem; /* space-y-3 */
flex-shrink: 0;
}

.ia-actions-status {
display: inline-flex;
align-items: center;
gap: 0.5rem; /* space-x-2 */
}

@keyframes pulse {
50% { opacity: 0.5; }
}

.ia-status-dot {
height: 0.75rem; /* h-3 */
width: 0.75rem; /* w-3 */
background-color: #07d1be; /* bg-green-500 */
border-radius: 9999px; /* rounded-full */
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.ia-status-text {
font-weight: 550; /* font-semibold */
color: #009688; /* text-green-600 */
}

.ia-actions-wait {
font-size: 0.875rem; /* text-sm */
color: #64748b; /* text-slate-500 */
margin: 0;
}

.ia-actions-button {
background-color: #2563eb; /* bg-blue-600 */
color: white;
font-weight: 700; /* font-bold */
padding: 0.75rem 1.5rem; /* py-3 px-6 */
border-radius: 0.5rem; /* rounded-lg */
transition: background-color 0.3s;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-md */
text-decoration: none;
border: none;
cursor: pointer;
}

.ia-actions-button:hover {
background-color: #1d4ed8; /* hover:bg-blue-700 */
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* hover:shadow-lg */
color:white;
}

.ia-actions-button:focus {
    box-shadow: 0px 0px 10px 4px #311ee9;
    color: white;
}