/* ELGHIS_PSYCHOMETRICS_REDESIGN_BEGIN */

:root {
  --ep-primary:
    var(--et-primary, #062843);

  --ep-accent:
    var(--et-accent, #118f97);

  --ep-accent-strong:
    var(--et-accent-strong, #087e86);

  --ep-soft:
    var(--et-soft, #dcf2f1);

  --ep-bg:
    var(--et-bg, #f3f8fa);

  --ep-panel:
    #ffffff;

  --ep-panel-soft:
    var(--et-panel-soft, #f7fafb);

  --ep-border:
    var(--et-border, #d7e4e8);

  --ep-text:
    var(--et-text, #08243c);

  --ep-muted:
    var(--et-muted, #6c8295);
}


/* ---------------------------------------------------------
   BASE
   --------------------------------------------------------- */

.psychometrics-content {
  max-width: 1580px !important;
  margin: 0 auto !important;
  padding:
    24px
    clamp(20px, 4vw, 52px)
    48px !important;

  background: transparent !important;
}


.psychometrics-topbar {
  border-bottom:
    1px solid var(--ep-border) !important;

  background:
    rgba(255,255,255,.96) !important;
}


.psychometrics-topbar-inner {
  max-width: 1580px !important;
  gap: 14px !important;
}


.psychometrics-topbar h1 {
  display: none !important;
}


/* ---------------------------------------------------------
   BUSCADOR
   --------------------------------------------------------- */

.elghis-psychometrics-search {
  min-width: 0;
  flex: 1;

  position: relative;
}


.elghis-psychometrics-search svg {
  position: absolute;
  left: 17px;
  top: 50%;

  width: 18px;
  height: 18px;

  transform: translateY(-50%);

  fill: none;
  stroke: var(--ep-muted);
  stroke-width: 1.8;
}


.elghis-psychometrics-search input {
  width: 100%;
  height: 50px;

  padding:
    0 18px
    0 48px;

  border:
    1px solid var(--ep-border);

  border-radius: 15px;

  outline: 0;

  background:
    var(--ep-panel-soft);

  color:
    var(--ep-text);

  font: inherit;
  font-size: 14px;

  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease;
}


.elghis-psychometrics-search input:focus {
  border-color:
    var(--ep-accent);

  background: #ffffff;

  box-shadow:
    0 0 0 3px
    color-mix(
      in srgb,
      var(--ep-accent) 12%,
      transparent
    );
}


.psychometrics-back-button {
  min-height: 50px !important;

  border-radius: 14px !important;

  background:
    #ffffff !important;

  color:
    var(--ep-text) !important;
}


/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */

#elghis-psychometrics-hero {
  position: relative;

  overflow: hidden;

  min-height: 178px;

  margin-bottom: 18px;
  padding:
    28px 34px;

  display: grid;

  grid-template-columns:
    minmax(300px, 1.15fr)
    minmax(560px, .85fr);

  align-items: center;
  gap: 30px;

  border-radius: 25px;

  background:
    radial-gradient(
      circle at 95% 10%,
      color-mix(
        in srgb,
        var(--ep-accent) 40%,
        transparent
      ),
      transparent 27rem
    ),
    linear-gradient(
      120deg,
      var(--ep-primary),
      color-mix(
        in srgb,
        var(--ep-primary) 72%,
        var(--ep-accent)
      ) 60%,
      color-mix(
        in srgb,
        var(--ep-primary) 48%,
        var(--ep-accent)
      )
    );

  color: #ffffff;

  box-shadow:
    0 18px 42px
    color-mix(
      in srgb,
      var(--ep-primary) 18%,
      transparent
    );
}


#elghis-psychometrics-hero::after {
  content: "";

  position: absolute;

  width: 390px;
  height: 250px;

  right: -80px;
  bottom: -150px;

  border:
    1px solid
    rgba(255,255,255,.10);

  border-radius: 50%;

  box-shadow:
    0 0 0 40px
      rgba(255,255,255,.025),
    0 0 0 80px
      rgba(255,255,255,.02);
}


.elghis-psychometrics-hero-copy,
.elghis-psychometrics-stats {
  position: relative;
  z-index: 1;
}


.elghis-psychometrics-eyebrow {
  margin-bottom: 8px;

  color:
    color-mix(
      in srgb,
      var(--ep-accent) 42%,
      white
    );

  font-size: 11px;
  font-weight: 850;

  letter-spacing: .13em;
  text-transform: uppercase;
}


.elghis-psychometrics-hero-copy h2 {
  margin: 0;

  color: #ffffff;

  font-size:
    clamp(36px, 4vw, 52px);

  line-height: 1;
  letter-spacing: -.045em;
}


.elghis-psychometrics-hero-copy p {
  max-width: 570px;

  margin: 12px 0 0;

  color:
    rgba(255,255,255,.78);

  font-size: 14px;
  line-height: 1.55;
}


.elghis-psychometrics-stats {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));
}


.elghis-psychometrics-stat {
  min-width: 0;

  padding:
    6px 22px;

  border-left:
    1px solid
    rgba(255,255,255,.16);
}


.elghis-psychometrics-stat:first-child {
  border-left: 0;
}


.elghis-psychometrics-stat-icon {
  width: 42px;
  height: 42px;

  margin-bottom: 9px;

  display: grid;
  place-items: center;

  border-radius: 12px;

  background:
    rgba(255,255,255,.10);
}


.elghis-psychometrics-stat-icon svg {
  width: 20px;
  height: 20px;

  fill: none;
  stroke: #ffffff;
  stroke-width: 1.8;
}


.elghis-psychometrics-stat span {
  display: block;

  color:
    rgba(255,255,255,.76);

  font-size: 11px;
}


.elghis-psychometrics-stat strong {
  display: block;

  margin-top: 2px;

  color: #ffffff;

  font-size: 27px;
  line-height: 1;
}


/* ---------------------------------------------------------
   INTRO → TÍTULO DE PRUEBAS
   --------------------------------------------------------- */

.psychometrics-intro {
  margin:
    22px 0 12px !important;

  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
}


.psychometrics-intro h2 {
  margin: 0 !important;

  color:
    var(--ep-text) !important;

  font-size: 23px !important;
  letter-spacing: -.025em;
}


.psychometrics-intro p {
  margin: 5px 0 0 !important;

  color:
    var(--ep-muted) !important;

  font-size: 12px !important;
}


/* ---------------------------------------------------------
   CUOTA MENSUAL
   --------------------------------------------------------- */

.psychometrics-workspace-summary {
  margin:
    0 0 20px !important;

  gap: 12px !important;
}


.psychometrics-quota-card,
.psychometrics-admin-card {
  border:
    1px solid var(--ep-border) !important;

  border-radius: 18px !important;

  background:
    var(--ep-panel) !important;

  box-shadow:
    0 9px 28px
    color-mix(
      in srgb,
      var(--ep-primary) 6%,
      transparent
    ) !important;
}


.psychometrics-summary-eyebrow {
  color:
    var(--ep-accent-strong) !important;
}


.psychometrics-quota-progress {
  overflow: hidden;

  height: 9px !important;

  border-radius: 999px !important;

  background:
    color-mix(
      in srgb,
      var(--ep-accent) 12%,
      white
    ) !important;
}


.psychometrics-quota-progress span {
  border-radius: inherit;

  background:
    linear-gradient(
      90deg,
      var(--ep-accent),
      var(--ep-accent-strong)
    ) !important;
}


/* ---------------------------------------------------------
   PRUEBAS
   --------------------------------------------------------- */

.psychometrics-tests-grid {
  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(330px, 1fr)
    ) !important;

  gap: 18px !important;
}


.psychometric-test-card {
  min-width: 0;

  padding: 20px !important;

  border:
    1px solid var(--ep-border) !important;

  border-radius: 19px !important;

  background:
    var(--ep-panel) !important;

  box-shadow:
    0 9px 28px
    color-mix(
      in srgb,
      var(--ep-primary) 6%,
      transparent
    ) !important;

  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease;
}


.psychometric-test-card:hover {
  transform:
    translateY(-2px);

  border-color:
    color-mix(
      in srgb,
      var(--ep-accent) 32%,
      var(--ep-border)
    ) !important;

  box-shadow:
    0 14px 35px
    color-mix(
      in srgb,
      var(--ep-primary) 10%,
      transparent
    ) !important;
}


.psychometric-test-icon {
  width: 46px !important;
  height: 46px !important;

  border-radius:
    13px !important;

  background:
    color-mix(
      in srgb,
      var(--ep-accent) 12%,
      white
    ) !important;

  color:
    var(--ep-accent-strong) !important;
}


.psychometric-test-heading h3 {
  color:
    var(--ep-text) !important;

  font-size: 18px !important;
}


.psychometric-test-status {
  background:
    color-mix(
      in srgb,
      var(--ep-accent) 12%,
      white
    ) !important;

  color:
    var(--ep-accent-strong) !important;
}


.psychometric-test-description {
  min-height: 47px;

  color:
    var(--ep-muted) !important;

  font-size: 12px !important;
  line-height: 1.55 !important;
}


.psychometric-test-details {
  margin-top: 14px !important;
}


.psychometric-test-details div {
  padding:
    9px 0 !important;

  border-bottom:
    1px solid var(--ep-border) !important;
}


.psychometric-test-details dt {
  color:
    var(--ep-muted) !important;

  font-size: 11px !important;
}


.psychometric-test-details dd {
  color:
    var(--ep-text) !important;

  font-size: 11px !important;
  font-weight: 800 !important;
}


.psychometric-test-action {
  width: 100%;

  min-height: 42px !important;

  margin-top: 14px !important;

  border: 0 !important;
  border-radius: 11px !important;

  background:
    linear-gradient(
      120deg,
      var(--ep-primary),
      color-mix(
        in srgb,
        var(--ep-primary) 62%,
        var(--ep-accent)
      )
    ) !important;

  color:
    #ffffff !important;

  font-weight: 800 !important;
}


.psychometric-test-note {
  margin:
    10px 0 0 !important;

  color:
    var(--ep-muted) !important;

  font-size: 10px !important;
}


/* ---------------------------------------------------------
   HISTORIAL
   --------------------------------------------------------- */

.psychometrics-history {
  margin-top: 26px !important;

  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}


.psychometrics-history-header {
  margin-bottom: 12px !important;

  align-items: flex-end !important;
}


.psychometrics-history-header h2 {
  color:
    var(--ep-text) !important;

  font-size: 24px !important;
  letter-spacing: -.025em;
}


.psychometrics-history-header p {
  margin-top: 4px !important;

  color:
    var(--ep-muted) !important;

  font-size: 12px !important;
}


.psychometrics-applications-refresh {
  min-height: 39px;

  padding: 0 15px !important;

  border:
    1px solid var(--ep-border) !important;

  border-radius: 11px !important;

  background:
    #ffffff !important;

  color:
    var(--ep-text) !important;
}


.psychometrics-applications-list {
  gap: 9px !important;
}


.psychometrics-application-card {
  display: grid !important;

  grid-template-columns:
    minmax(250px, 1.2fr)
    minmax(310px, 1.8fr)
    auto;

  align-items: center;

  gap: 18px;

  padding:
    15px 17px !important;

  border:
    1px solid var(--ep-border) !important;

  border-radius:
    15px !important;

  background:
    #ffffff !important;

  box-shadow:
    0 6px 20px
    color-mix(
      in srgb,
      var(--ep-primary) 5%,
      transparent
    ) !important;
}


.psychometrics-application-card-header {
  min-width: 0;

  align-items:
    flex-start !important;
}


.psychometrics-application-card
.eyebrow {
  color:
    var(--ep-accent-strong) !important;

  font-size:
    9px !important;

  letter-spacing:
    .09em !important;
}


.psychometrics-application-card h3 {
  margin-top:
    5px !important;

  color:
    var(--ep-text) !important;

  font-size:
    14px !important;
}


.psychometrics-application-details {
  min-width: 0;

  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(130px, 1fr)
    );

  gap: 8px !important;
}


.psychometrics-application-detail {
  min-width: 0;

  padding:
    8px 10px !important;

  border-radius:
    10px;

  background:
    var(--ep-panel-soft);
}


.psychometrics-application-detail-label {
  color:
    var(--ep-muted) !important;

  font-size:
    8px !important;
}


.psychometrics-application-detail-value {
  overflow-wrap: anywhere;

  color:
    var(--ep-text) !important;

  font-size:
    10px !important;
}


.psychometrics-application-actions {
  justify-content:
    flex-end !important;

  gap:
    6px !important;
}


.psychometrics-report-link {
  min-height:
    36px !important;

  padding:
    0 14px !important;

  border-radius:
    10px !important;

  background:
    var(--ep-accent) !important;

  color:
    #ffffff !important;
}


.psychometrics-report-pending {
  border-radius:
    10px !important;
}


/* ---------------------------------------------------------
   BÚSQUEDA
   --------------------------------------------------------- */

.psychometric-test-card.elghis-search-hidden {
  display: none !important;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1050px) {

  #elghis-psychometrics-hero {
    grid-template-columns:
      1fr;
  }

  .elghis-psychometrics-stats {
    max-width: 700px;
  }

  .psychometrics-application-card {
    grid-template-columns:
      1fr;
  }

  .psychometrics-application-actions {
    justify-content:
      flex-start !important;
  }
}


@media (max-width: 680px) {

  .psychometrics-content {
    padding:
      15px !important;
  }

  #elghis-psychometrics-hero {
    padding:
      24px 20px;

    border-radius:
      20px;
  }

  .elghis-psychometrics-stats {
    grid-template-columns:
      1fr;
  }

  .elghis-psychometrics-stat {
    padding:
      12px 0;

    border-left: 0;

    border-top:
      1px solid
      rgba(255,255,255,.14);
  }

  .elghis-psychometrics-stat:first-child {
    border-top: 0;
  }

  .psychometrics-tests-grid {
    grid-template-columns:
      1fr !important;
  }
}

/* ELGHIS_PSYCHOMETRICS_REDESIGN_END */


/* ==========================================================
   ELGHIS_PSYCHOMETRICS_10B2A_BEGIN
   ========================================================== */


/* ----------------------------------------------------------
   SHELL CON SIDEBAR
   ---------------------------------------------------------- */

body.elghis-psychometrics-active
.psychometrics-topbar {
  margin-left: 108px !important;
}


body.elghis-psychometrics-active
.psychometrics-content {
  max-width: none !important;

  margin-left:
    108px !important;

  padding-left:
    clamp(20px, 3vw, 42px) !important;

  padding-right:
    clamp(20px, 3vw, 42px) !important;
}


/* ----------------------------------------------------------
   SIDEBAR CLONADA DEL PANEL
   ---------------------------------------------------------- */

.elghis-psychometrics-sidebar {
  position: fixed !important;

  z-index: 1100 !important;

  top: 14px !important;
  bottom: 14px !important;
  left: 14px !important;

  width: 86px !important;

  min-height: 0 !important;
  height: auto !important;

  padding:
    18px 12px !important;

  border-radius:
    25px !important;

  overflow: hidden;

  background:
    linear-gradient(
      180deg,

      var(--ep-primary) 0%,

      color-mix(
        in srgb,
        var(--ep-primary) 86%,
        var(--ep-accent)
      ) 56%,

      color-mix(
        in srgb,
        var(--ep-primary) 84%,
        black
      ) 100%
    ) !important;

  box-shadow:
    0 18px 46px
    color-mix(
      in srgb,
      var(--ep-primary) 18%,
      transparent
    );
}


.elghis-psychometrics-sidebar
.elghis-dashboard-sidebar-brand {
  width: 58px !important;
  height: 58px !important;

  margin: 0 auto !important;
}


.elghis-psychometrics-sidebar
.elghis-dashboard-sidebar-nav {
  margin-top:
    28px !important;

  gap:
    11px !important;
}


.elghis-psychometrics-sidebar
.elghis-dashboard-sidebar-button {
  width: 58px !important;
  min-height: 58px !important;

  border-radius:
    16px !important;
}


.elghis-psychometrics-sidebar
.elghis-dashboard-sidebar-button.active {
  background:
    linear-gradient(
      145deg,
      var(--ep-accent),
      var(--ep-accent-strong)
    ) !important;
}


/* ----------------------------------------------------------
   TOPBAR
   ---------------------------------------------------------- */

body.elghis-psychometrics-active
.psychometrics-topbar-inner {
  max-width: none !important;

  padding-left:
    clamp(20px, 3vw, 42px) !important;

  padding-right:
    clamp(20px, 3vw, 42px) !important;
}


body.elghis-psychometrics-active
.psychometrics-topbar {
  min-height:
    82px;

  display: flex;
  align-items: center;
}


/* ----------------------------------------------------------
   HERO MÁS COMPACTO
   ---------------------------------------------------------- */

body.elghis-psychometrics-active
#elghis-psychometrics-hero {
  min-height:
    166px;

  margin-top:
    4px;

  margin-bottom:
    14px;

  padding:
    25px 32px;
}


/* ----------------------------------------------------------
   FRANJA MENSUAL NUEVA
   ---------------------------------------------------------- */

#elghis-psychometrics-quota-strip {
  min-height: 98px;

  margin-bottom: 18px;

  padding:
    17px 22px;

  display: grid;

  grid-template-columns:
    minmax(230px, .8fr)
    minmax(300px, 1.45fr)
    minmax(260px, .8fr);

  align-items: center;

  gap: 24px;

  border:
    1px solid
    var(--ep-border);

  border-radius:
    19px;

  background:
    var(--ep-panel);

  box-shadow:
    0 8px 28px
    color-mix(
      in srgb,
      var(--ep-primary) 6%,
      transparent
    );
}


.elghis-quota-strip-main {
  min-width: 0;
}


.elghis-quota-strip-eyebrow {
  margin-bottom: 5px;

  color:
    var(--ep-accent-strong);

  font-size:
    9px;

  font-weight:
    850;

  letter-spacing:
    .10em;

  text-transform:
    uppercase;
}


.elghis-quota-strip-main strong {
  display: block;

  color:
    var(--ep-text);

  font-size:
    20px;

  line-height:
    1.2;

  letter-spacing:
    -.025em;
}


.elghis-quota-strip-progress {
  min-width: 0;

  padding:
    0 24px;

  border-left:
    1px solid
    var(--ep-border);

  border-right:
    1px solid
    var(--ep-border);
}


.elghis-quota-strip-progress-header {
  display: flex;

  justify-content:
    space-between;

  gap: 12px;

  margin-bottom:
    9px;

  color:
    var(--ep-muted);

  font-size:
    10px;
}


.elghis-quota-strip-progress-header
strong {
  color:
    var(--ep-text);

  font-size:
    10px;
}


.elghis-quota-strip-track {
  height:
    8px;

  overflow:
    hidden;

  border-radius:
    999px;

  background:
    color-mix(
      in srgb,
      var(--ep-accent) 12%,
      white
    );
}


.elghis-quota-strip-fill {
  width: 0;
  height: 100%;

  border-radius:
    inherit;

  background:
    linear-gradient(
      90deg,
      var(--ep-accent),
      var(--ep-accent-strong)
    );

  transition:
    width .25s ease;
}


.elghis-quota-strip-date {
  min-width: 0;

  display: grid;

  grid-template-columns:
    38px 1fr;

  align-items: center;

  gap:
    12px;
}


.elghis-quota-strip-date-icon {
  width:
    38px;
  height:
    38px;

  display:
    grid;
  place-items:
    center;

  border-radius:
    11px;

  background:
    color-mix(
      in srgb,
      var(--ep-accent) 11%,
      white
    );

  color:
    var(--ep-accent-strong);
}


.elghis-quota-strip-date-icon svg {
  width:
    18px;
  height:
    18px;

  fill:
    none;

  stroke:
    currentColor;

  stroke-width:
    1.8;
}


.elghis-quota-strip-date span {
  display:
    block;

  margin-bottom:
    3px;

  color:
    var(--ep-muted);

  font-size:
    9px;
}


.elghis-quota-strip-date strong {
  display:
    block;

  color:
    var(--ep-text);

  font-size:
    11px;

  line-height:
    1.35;
}


/* Ocultar solamente la tarjeta original de cuota */

body.elghis-psychometrics-active
.psychometrics-quota-card {
  display:
    none !important;
}


/* Si no existe tarjeta administrativa,
   evitar espacio vacío */

body.elghis-psychometrics-active
.psychometrics-workspace-summary:
not(:has(.psychometrics-admin-card)) {
  display:
    none !important;
}


/* ----------------------------------------------------------
   ENCABEZADO DE EVALUACIONES
   ---------------------------------------------------------- */

body.elghis-psychometrics-active
.psychometrics-intro {
  min-height:
    0 !important;

  margin:
    4px 0 12px !important;

  padding:
    0 !important;

  border:
    0 !important;

  border-radius:
    0 !important;

  background:
    transparent !important;

  box-shadow:
    none !important;
}


body.elghis-psychometrics-active
.psychometrics-intro
.eyebrow {
  display:
    none !important;
}


body.elghis-psychometrics-active
.psychometrics-intro h2 {
  font-size:
    22px !important;
}


body.elghis-psychometrics-active
.psychometrics-intro p {
  margin-top:
    3px !important;
}


/* ----------------------------------------------------------
   TARJETAS MÁS CERCANAS AL MOCKUP
   ---------------------------------------------------------- */

body.elghis-psychometrics-active
.psychometrics-tests-grid {
  gap:
    15px !important;
}


body.elghis-psychometrics-active
.psychometric-test-card {
  padding:
    18px !important;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 950px) {

  #elghis-psychometrics-quota-strip {
    grid-template-columns:
      1fr;
  }

  .elghis-quota-strip-progress {
    padding:
      15px 0;

    border-left:
      0;

    border-right:
      0;

    border-top:
      1px solid
      var(--ep-border);

    border-bottom:
      1px solid
      var(--ep-border);
  }
}


@media (max-width: 760px) {

  .elghis-psychometrics-sidebar {
    display:
      none !important;
  }

  body.elghis-psychometrics-active
  .psychometrics-topbar,
  body.elghis-psychometrics-active
  .psychometrics-content {
    margin-left:
      0 !important;
  }
}


/* ==========================================================
   ELGHIS_PSYCHOMETRICS_10B2A_END
   ========================================================== */