@font-face {
  font-family: 'Gilroy';
  src: url('/fonts/Gilroy-Regular.woff2') format('woff2'),
       url('/fonts/Gilroy-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

body {
   font-family: 'Gilroy', sans-serif;
   background: linear-gradient(180deg, #cdbbff -19px, #cdbbff 0%, #ffffff 137px, #ffffff 167%);
   background-attachment: fixed;
   color:#111522;
}
.modal-bg { background: rgba(30, 41, 59, 0.2); backdrop-filter: blur(1.5px); }
.trunc-btn { max-width: 100px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: inline-block; vertical-align: middle; }
.lds-ring { display: inline-block; position: relative; width: 40px; height: 40px; }
.lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 32px; height: 32px; margin: 4px; border: 4px solid #19202e; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #19202e transparent transparent transparent; }
.lds-ring div:nth-child(1) { animation-delay: -0.45s; }
.lds-ring div:nth-child(2) { animation-delay: -0.3s; }
.lds-ring div:nth-child(3) { animation-delay: -0.15s; }
@keyframes lds-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.tp-tooltip { display: none; position: absolute; left: 50%; transform: translateX(-50%); bottom: 44px; background: #111827cc; color: #fff; padding: 7px 14px; border-radius: 6px; font-size: 0.85rem; box-shadow: 0 2px 12px #0002; white-space: nowrap; pointer-events: none; z-index: 100; opacity: 0; transition: opacity 0.16s; }
.has-tooltip:hover .tp-tooltip { display: block; opacity: 1; pointer-events: auto; }
.filters-badge { position: absolute; top: -6px; right: -2px; font-size: 11px; background: #19202e; color: #fff; min-width: 16px; height: 16px; line-height: 15px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-weight: bold; z-index: 20; }
.modal-z { z-index: 10000000; }
.user-menu { display: none; position: absolute; top: 52px; right: 0; background: #fff; border-radius: 18px; min-width: 150px; box-shadow: 0 12px 32px #0002; padding: 0px 0; z-index: 9999; }
.user-menu-btn { width: 100%; padding: 10px 20px; text-align: left; background: transparent; border: none; color: #101522; font-weight: 500; font-size: 16px; border-radius: 10px; cursor: pointer; transition: background 0.14s; }
.user-menu-btn:hover { background: #f2f4f6; }
.filter-active { background: #19202e !important; color: #fff !important; border-color: #19202e !important; }

/* --- Estilos para la página de detalle del candidato --- */
.favorite-active svg path { fill: #111522; stroke: #111522; }
.custom-dropdown-menu { position: absolute; right: 0; top: calc(100% + 8px); width: 220px; padding: 4px; display: flex; flex-direction: column; gap: 4px; border-radius: 10px; border: 1px solid #E8EAEE; background: #FFF; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); z-index: 50; }
.custom-dropdown-option { display: flex; padding: 8px; align-items: center; gap: 8px; width: 100%; border-radius: 8px; transition: background-color 0.15s ease-in-out; font-family: 'Gilroy', sans-serif; font-size: 14px; }
.custom-dropdown-option:hover { background-color: #F3F5F7; }
.custom-dropdown-option.selected { background-color: #E9D5FF; font-weight: 600; }
.tab-btn { color: #5B6471; text-align: center; font-family: Gilroy; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; padding-bottom: 10px; border-bottom-width: 2px; }
.tab-btn:hover { border-color: rgb(209 213 219); color: rgb(55 65 81); }
.active-tab { border-color: black !important; color: black !important; font-weight: 600 !important; }
.attribute-box { border-width: 1px; border-color: rgb(229 231 235); border-radius: 0.5rem; padding: 0.75rem; }
.attribute-box dt { font-family: Gilroy; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; color: #111522; }
.attribute-box dd { color: #27313F; font-family: Gilroy; font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; }
.comment-bubble { border: solid 1px #e1e1e1bf; border-radius: 0.5rem; background: #ffffff; padding: 15px; }
.comment-author { font-weight: 600; font-size: 0.875rem; color: #1f2937; }
.comment-timestamp { font-size: 0.75rem; color: #9ca3af; text-align: right; margin-top: 0.25rem; }
.accordion-item {padding: 0px;background-color: white;border: 1px solid rgb(229 231 235);border-radius: 0.5rem;}
.accordion-item:not(:last-child) { margin-bottom: 0.5rem; }
.accordion-header {display: flex;width: 100%;justify-content: space-between;align-items: center;padding: 12px;cursor: pointer;font-weight: 600;color: rgb(55 65 81);transition: background-color 0.2s ease-out;}
.accordion-header:hover { background-color: rgb(249 250 251); }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease-in-out; }
.accordion-content.open { max-height: 20rem; }
.accordion-icon { transition: transform 0.3s ease-in-out; }
.accordion-header.open .accordion-icon { transform: rotate(180deg); }

/* --- Tus clases personalizadas --- */
.label-pill {font-family: Gilroy;font-size: 14px;font-style: normal;font-weight: 600;line-height: 20px;display: flex !important;height: 32px !important;padding: 5px 10px !important;flex-direction: column !important;justify-content: center !important;align-items: center !important;gap: 10px !important;border-radius: 8px !important;border: 1px solid #E8EAEE !important;background: #FFF !important;}
.botonlikn{position: absolute !important; right: 14px !important; top: 14px !important;}
.tapoc{padding-top: 60px !important;padding-left:16px !important; padding-right:16px !important;}
.pelicumm{ margin-top: 10px !important;}
.pasimin{margin-top: 4px !important;}
.pailbal{color: #111522 !important; display: flex !important; width: 18px !important; justify-content: center !important; align-items: center !important; gap: 10px !important; height: 18px !important;}
.catamp{ padding: 12px !important; margin-bottom: 68px !important;}
.pichoholl{ display: flex; width: 38px; height: 38px; padding: 9px; justify-content: center; align-items: center; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.25); background: #FFF; }
.tabiiall2{ border-bottom: 0px !important;}
.tabiiall{ font-size: 18px !important; font-weight: 600 !important; line-height: 28px !important; }
.cajaprin{ gap: 18px !important; background-color: #fff !important; padding: 16px 12px !important; border-radius: 14px !important; box-shadow: 0 121px 34px 0 rgba(182, 192, 210, 0.00), 0 77px 31px 0 rgba(182, 192, 210, 0.01), 0 44px 26px 0 rgba(182, 192, 210, 0.05), 0 19px 19px 0 rgba(182, 192, 210, 0.08) !important; }
.taminsi{color: #111522 !important;width: 19px !important; height: 19px !important; flex-shrink: 0 !important; aspect-ratio: 1 / 1 !important;}
.iconme{width: 38px !important; flex-shrink: 0 !important; aspect-ratio: 1 / 1 !important; height: 38px !important; }
.bg2{background: #E8EAEE !important;}
.pichi{ font-size: 11px !important; font-weight: 600 !important; height: 22px !important;}
.sive23{font-size: 20px !important; font-style: normal !important; font-weight: 600 !important; line-height: 28px !important;}
.userminbtn{ font-size: 15px !important; font-style: normal !important; font-weight: 500 !important; line-height: 24px !important; width: 38px !important; height: 38px !important; }
.heym{color: #111522 !important; font-size: 20px !important; font-style: normal !important; font-weight: 600 !important; line-height: 28px !important; }
.pelipunt{position: relative !important; bottom: 15px !important;}
.textfil{ font-size: 14px !important; display: flex !important; height: 32px !important; padding: 5px 10px !important; align-items: center !important; gap: 10px !important; border-radius: 9999px !important; border: 1px solid #D7DAE0; }
.gapi4{gap: 4px !important;}
.tam18{font-size: 18px !important;line-height: 21px;padding-bottom: 8px !important;}
.menisp{ padding-bottom: 12px !important; gap: 8px !important;}
.cajami{padding: 16px; align-items: flex-start; gap: 12px; border-radius: 14px; border: 1px solid #E8EAEE;}
.masim15{padding-top: 12px !important;}
.fotselect{background: #F3F5F7 !important;}
.metxs{ width: 14px !important; height: 14px !important; }
.pinlexs{border-radius: 999px; background: #D7DAE0; display: flex; width: 20px; height: 20px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1 / 1;}
.absoli{top: -59px !important;}
.avaliss { font-size: 28px !important; width: 96px !important; height: 96px !important; border-radius: 9999px !important; font-style: normal; font-weight: 600 !important; line-height: 36px !important; border: 4px solid #EBE7F6 !important; background-color: #F3F5F7 !important; color: #5B6471 !important; }
.hcolin{
  font-size: 14px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    margin-left: 4px !important;
    margin-right: 0px !important;

}
.candiname{ font-size: 20px !important; font-style: normal !important; font-weight: 600 !important; line-height: 28px !important; }
.labiffn{ font-size: 13px !important; font-style: normal !important; font-weight: 600 !important; line-height: 20px !important; letter-spacing: 1.95px !important;}
.asntext{ font-size: 14px; font-style: normal !important; font-weight: 500 !important; line-height: 20px !important; padding: 0px 12px 12px 12px !important;}
.caliban { display: flex !important; width: 38px !important; height: 38px !important; padding: 5px 10px !important; justify-content: center !important; align-items: center !important; gap: 10px !important; border-radius: 10px !important; border: 1px solid #D7DAE0 !important; }
.mal118{margin-top: 18px !important; margin-bottom: 18px !important;}

/* ... (todo tu css actual desde @font-face hasta .accordion-header.open .accordion-icon) ... */
@font-face {
  font-family: 'Gilroy';
  src: url('/fonts/Gilroy-Regular.woff2') format('woff2'),
       url('/fonts/Gilroy-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}
body {
   font-family: 'Gilroy', sans-serif;
   background: linear-gradient(180deg, #cdbbff -19px, #cdbbff 0%, #ffffff 137px, #ffffff 167%);
   background-attachment: fixed;
   color:#111522;
}
/* ... (todos tus estilos hasta .accordion-header.open .accordion-icon) ... */
.accordion-header.open .accordion-icon {
  transform: rotate(180deg);
}

/* --- NUEVOS ESTILOS PARA EL FORMULARIO DE COMENTARIOS --- */
.comment-form-container {
    border-radius: 10px !important;
    position: relative;
    background-color: #F3F5F7; /* bg-gray-100 */
     /* 12px */
    padding: 0.25rem;
    padding-right: 60px; /* Espacio para el botón */
}

.comment-form-container textarea {
    background-color: transparent;
    border: none;
    resize: none;
    width: 100%;
    min-height: 90px;
    padding: 12px;
    outline: none;
    box-shadow: none;
}

.comment-form-container button {
    position: absolute;
    bottom: 12px;
    right: 12px;
}

/* Pega esto al final de tu style.css */
.classnuevafont {
  background: #ebe7f6 !important;
}

.border-b {
    border-bottom-width: 0px !important;
}

.ma5pc{margin-bottom:6px !important;}

.selectin{    border-radius: 10px;
         background: var(--Greys-50, #F3F5F7);
         display: flex
         ;
         padding: 10px var(--spacing-3, 12px);
         align-items: center;
         gap: var(--spacing-1, 4px);
         align-self: stretch;}


.chilimb{
  background: #ffffff;
        padding: 6px;}