/* =============================================================================
   TARONJA · PÁGINA DE BIENVENIDA
   -----------------------------------------------------------------------------
   CSS exclusivo de la página de bienvenida.
   No afecta a horario de alumnos ni profesores.
   ============================================================================= */


/* =========================================================
   VARIABLES
   ========================================================= */

.trj-bienvenida{
  --welcome-orange:#f26522;
  --welcome-orange-soft:#fff3ea;

  --welcome-yellow:#f4b740;
  --welcome-yellow-soft:#fff8e8;

  --welcome-pink:#ec6b9d;
  --welcome-pink-soft:#fff0f5;

  --welcome-green:#7cb342;
  --welcome-green-soft:#f3f8e9;

  --welcome-blue:#2f6fbd;
  --welcome-blue-soft:#edf5ff;

  --welcome-ink:#2b2733;
  --welcome-ink-soft:#6f6878;
  --welcome-line:#e8e2dc;
  --welcome-card:#ffffff;

  --welcome-radius-xl:24px;
  --welcome-radius-lg:18px;
  --welcome-radius-md:14px;

  --welcome-shadow:
    0 8px 24px rgba(43,39,51,.055);

  width:100%;
  color:var(--welcome-ink);
}


/* =========================================================
   CONTENEDOR GENERAL
   ========================================================= */

.trj-bienvenida .welcome-page{
  width:min(1180px,calc(100% - 32px));
  margin:0 auto;
  padding:24px 0 54px;
}


/* =========================================================
   HERO · ACCIÓN PRINCIPAL
   ========================================================= */

.trj-bienvenida .welcome-hero{
  position:relative;
  overflow:hidden;

  margin:0 0 20px;
  padding:28px 32px 26px;

  border:1px solid rgba(242,101,34,.16);
  border-radius:var(--welcome-radius-xl);

  background:
    radial-gradient(
      circle at top right,
      rgba(242,101,34,.08),
      transparent 32%
    ),
    #fffaf7;

  box-shadow:var(--welcome-shadow);
}

.trj-bienvenida .welcome-hero::after{
  content:"🍊";

  position:absolute;
  right:22px;
  bottom:10px;

  font-size:4rem;
  line-height:1;
  opacity:.055;
  transform:rotate(-10deg);

  pointer-events:none;
}

.trj-bienvenida .welcome-hero__eyebrow{
  margin-bottom:8px;

  font-size:.76rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;

  color:var(--welcome-orange);
}

.trj-bienvenida .welcome-hero__title{
  max-width:820px;
  margin:0;

  font-family:"Poppins",sans-serif;
  font-size:clamp(2.15rem,4vw,3.15rem);
  font-weight:800;
  line-height:1.05;
  letter-spacing:-.035em;

  color:var(--welcome-ink);
}

.trj-bienvenida .welcome-hero__lead{
  max-width:680px;
  margin:12px 0 18px;

  font-size:1rem;
  line-height:1.55;

  color:var(--welcome-ink-soft);
}


/* =========================================================
   BUSCADOR PRINCIPAL
   ========================================================= */

.trj-bienvenida .welcome-search{
  position:relative;
  width:min(720px,100%);
}

.trj-bienvenida .welcome-search--hero{
  margin:0;
}

.trj-bienvenida .welcome-search__input{
  width:100%;
  min-height:58px;

  padding:0 52px 0 18px;

  border:1.5px solid rgba(242,101,34,.38);
  border-radius:15px;
  outline:none;

  background:#fff;

  font-size:1rem;
  color:var(--welcome-ink);

  box-shadow:
    0 3px 12px rgba(43,39,51,.035);

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

.trj-bienvenida .welcome-search__input::placeholder{
  color:#938c99;
}

.trj-bienvenida .welcome-search__input:hover{
  border-color:rgba(242,101,34,.55);
}

.trj-bienvenida .welcome-search__input:focus,
.trj-bienvenida .welcome-search__input:focus-visible{
  border-color:var(--welcome-orange);

  box-shadow:
    0 0 0 4px rgba(242,101,34,.09);
}

.trj-bienvenida .welcome-search::after{
  content:"⌕";

  position:absolute;
  top:50%;
  right:18px;

  transform:translateY(-50%);

  font-size:1.25rem;
  font-weight:700;
  line-height:1;

  color:var(--welcome-orange);

  pointer-events:none;
}

.trj-bienvenida .welcome-search__clear{
  position:absolute;
  top:50%;
  right:13px;

  display:flex;
  align-items:center;
  justify-content:center;

  width:32px;
  height:32px;

  transform:translateY(-50%);

  border:0;
  border-radius:50%;

  background:var(--welcome-orange-soft);

  font-size:1.1rem;
  line-height:1;

  color:var(--welcome-orange);
  cursor:pointer;
}

.trj-bienvenida .welcome-search__clear[hidden]{
  display:none;
}

.trj-bienvenida .welcome-search__clear:hover{
  background:#ffe4d2;
}

.trj-bienvenida .welcome-search__clear:focus-visible{
  outline:2px solid var(--welcome-orange);
  outline-offset:2px;
}


/* =========================================================
   RESULTADO / ERROR DEL BUSCADOR
   ========================================================= */

.trj-bienvenida .welcome-search-status{
  margin:10px 0 0;

  font-size:.85rem;
  font-weight:700;

  color:var(--welcome-ink-soft);
}

.trj-bienvenida .welcome-search-empty{
  max-width:720px;

  margin:12px 0 0;
  padding:12px 14px;

  border:1px dashed rgba(242,101,34,.3);
  border-radius:12px;

  background:#fff;

  font-size:.88rem;
  line-height:1.45;

  color:var(--welcome-ink-soft);
}


/* =========================================================
   SEMANA
   ========================================================= */

.trj-bienvenida .welcome-week{
  display:inline-flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px 10px;

  margin-top:15px;
  padding:7px 11px;

  border:1px solid rgba(242,101,34,.16);
  border-radius:999px;

  background:#fff;

  font-size:.82rem;

  color:var(--welcome-ink-soft);
}

.trj-bienvenida .welcome-week strong{
  color:var(--welcome-orange);
}


/* =========================================================
   INFORMACIÓN PRÁCTICA
   ========================================================= */

.trj-bienvenida .welcome-practical{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));

  margin:0 0 18px;

  border:1px solid rgba(47,111,189,.13);
  border-radius:var(--welcome-radius-lg);

  background:var(--welcome-blue-soft);

  overflow:hidden;
}

.trj-bienvenida .welcome-practical__item{
  display:flex;
  align-items:center;
  gap:12px;

  min-width:0;

  padding:15px 18px;
}

.trj-bienvenida .welcome-practical__item + .welcome-practical__item{
  border-left:1px solid rgba(47,111,189,.12);
}

.trj-bienvenida .welcome-practical__icon{
  flex:0 0 auto;

  font-size:1.25rem;
  line-height:1;
}

.trj-bienvenida .welcome-practical__label{
  display:block;

  margin-bottom:3px;

  font-size:.68rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.09em;
  text-transform:uppercase;

  color:var(--welcome-blue);
}

.trj-bienvenida .welcome-practical strong{
  display:block;

  font-size:.9rem;
  font-weight:800;
  line-height:1.35;

  color:var(--welcome-ink);
}


/* =========================================================
   EXPLICACIÓN DESPLEGABLE T1 / T2
   ========================================================= */

.trj-bienvenida .welcome-shifts-info{
  margin:0 0 28px;

  border:1px solid var(--welcome-line);
  border-radius:var(--welcome-radius-md);

  background:#fff;

  overflow:hidden;
}

.trj-bienvenida .welcome-shifts-info__summary{
  position:relative;

  display:flex;
  align-items:center;

  min-height:48px;

  padding:13px 44px 13px 16px;

  list-style:none;

  font-family:"Poppins",sans-serif;
  font-size:.92rem;
  font-weight:700;
  line-height:1.3;

  color:var(--welcome-ink);

  cursor:pointer;
}

.trj-bienvenida .welcome-shifts-info__summary::-webkit-details-marker{
  display:none;
}

.trj-bienvenida .welcome-shifts-info__summary::after{
  content:"+";

  position:absolute;
  right:16px;

  display:flex;
  align-items:center;
  justify-content:center;

  width:24px;
  height:24px;

  border-radius:50%;

  background:var(--welcome-orange-soft);

  font-size:1rem;
  font-weight:800;

  color:var(--welcome-orange);
}

.trj-bienvenida .welcome-shifts-info[open] .welcome-shifts-info__summary::after{
  content:"−";
}

.trj-bienvenida .welcome-shifts-info__summary:hover{
  background:#fffaf7;
}

.trj-bienvenida .welcome-shifts-info__summary:focus-visible{
  outline:2px solid var(--welcome-orange);
  outline-offset:-2px;
}

.trj-bienvenida .welcome-shifts-info__content{
  padding:0 16px 16px;

  border-top:1px solid rgba(43,39,51,.06);
}

.trj-bienvenida .welcome-shifts-info__content > p{
  max-width:820px;

  margin:14px 0;

  font-size:.88rem;
  line-height:1.55;

  color:var(--welcome-ink-soft);
}

.trj-bienvenida .welcome-shifts-info__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));

  gap:12px;
}

.trj-bienvenida .welcome-shifts-info__shift{
  display:flex;
  flex-direction:column;
  gap:5px;

  padding:13px 14px;

  border-radius:12px;
}

.trj-bienvenida .welcome-shifts-info__shift--t1{
  background:var(--welcome-yellow-soft);
}

.trj-bienvenida .welcome-shifts-info__shift--t2{
  background:var(--welcome-pink-soft);
}

.trj-bienvenida .welcome-shifts-info__shift > strong{
  font-size:.84rem;
  font-weight:900;

  color:var(--welcome-ink);
}

.trj-bienvenida .welcome-shifts-info__shift > span{
  font-size:.8rem;
  line-height:1.4;

  color:var(--welcome-ink-soft);
}

.trj-bienvenida .welcome-shifts-info__meeting{
  margin-top:4px;

  font-weight:800;

  color:var(--welcome-ink);
}

.trj-bienvenida .welcome-shifts-info__notice{
  margin-top:12px;
  padding:12px 14px;

  border-left:4px solid var(--welcome-orange);
  border-radius:10px;

  background:var(--welcome-orange-soft);
}

.trj-bienvenida .welcome-shifts-info__notice > strong{
  display:block;

  margin-bottom:3px;

  font-size:.82rem;
  font-weight:900;

  color:var(--welcome-ink);
}

.trj-bienvenida .welcome-shifts-info__notice p{
  margin:3px 0;

  font-size:.8rem;
  line-height:1.45;

  color:var(--welcome-ink-soft);
}


/* =========================================================
   CABECERA DE RESULTADOS
   ========================================================= */

.trj-bienvenida .welcome-students-section{
  margin-top:0;
}

.trj-bienvenida .welcome-students-head{
  margin-bottom:16px;
}

.trj-bienvenida .welcome-students-head__eyebrow{
  margin-bottom:5px;

  font-size:.72rem;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;

  color:var(--welcome-orange);
}

.trj-bienvenida .welcome-students-head h2{
  margin:0;

  font-family:"Poppins",sans-serif;
  font-size:1.55rem;
  font-weight:800;
  line-height:1.2;

  color:var(--welcome-ink);
}

.trj-bienvenida .welcome-students-head p{
  max-width:650px;

  margin:6px 0 0;

  font-size:.88rem;
  line-height:1.5;

  color:var(--welcome-ink-soft);
}


/* =========================================================
   GRUPOS
   ========================================================= */

.trj-bienvenida .welcome-groups{
  display:flex;
  flex-direction:column;

  gap:24px;
}


/* =========================================================
   BLOQUE DE GRUPO
   ========================================================= */

.trj-bienvenida .welcome-group{
  --group-color:var(--welcome-orange);
  --group-soft:var(--welcome-orange-soft);
  --group-ink:#9a4d14;

  overflow:hidden;

  border:1px solid var(--welcome-line);
  border-radius:var(--welcome-radius-lg);

  background:#fff;

  box-shadow:var(--welcome-shadow);
}

.trj-bienvenida .welcome-group--t1{
  --group-color:var(--welcome-yellow);
  --group-soft:var(--welcome-yellow-soft);
  --group-ink:#86610f;
}

.trj-bienvenida .welcome-group--t2{
  --group-color:var(--welcome-pink);
  --group-soft:var(--welcome-pink-soft);
  --group-ink:#9a315b;
}

.trj-bienvenida .welcome-group--special{
  --group-color:var(--welcome-green);
  --group-soft:var(--welcome-green-soft);
  --group-ink:#4e7622;
}

.trj-bienvenida .welcome-group--private{
  --group-color:var(--welcome-orange);
  --group-soft:var(--welcome-orange-soft);
  --group-ink:#9b5617;
}

.trj-bienvenida .welcome-group--pending{
  --group-color:var(--welcome-blue);
  --group-soft:var(--welcome-blue-soft);
  --group-ink:#245891;
}


/* =========================================================
   CABECERA DE GRUPO
   ========================================================= */

.trj-bienvenida .welcome-group__head{
  position:relative;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:22px;

  padding:20px 22px;

  background:
    linear-gradient(
      90deg,
      var(--group-soft),
      #fff 88%
    );

  border-bottom:1px solid rgba(43,39,51,.07);
}

.trj-bienvenida .welcome-group__head::before{
  content:"";

  position:absolute;
  inset:0 auto 0 0;

  width:5px;

  background:var(--group-color);
}

.trj-bienvenida .welcome-group__head-text{
  min-width:0;
}

.trj-bienvenida .welcome-group__title{
  margin:0;

  font-family:"Poppins",sans-serif;
  font-size:1.18rem;
  font-weight:800;
  line-height:1.25;

  color:var(--welcome-ink);
}

.trj-bienvenida .welcome-group__description{
  max-width:700px;

  margin:5px 0 0;

  font-size:.84rem;
  line-height:1.45;

  color:var(--welcome-ink-soft);
}


/* =========================================================
   WELCOME MEETING DEL GRUPO
   ========================================================= */

.trj-bienvenida .welcome-group__meeting{
  flex:0 0 auto;

  display:flex;
  flex-direction:column;
  align-items:flex-end;

  gap:3px;

  min-width:160px;

  padding:9px 12px;

  border:1px solid rgba(43,39,51,.08);
  border-radius:11px;

  background:#fff;
}

.trj-bienvenida .welcome-group__meeting span{
  font-size:.68rem;
  font-weight:800;
  line-height:1;

  color:var(--welcome-ink-soft);
}

.trj-bienvenida .welcome-group__meeting strong{
  font-size:.82rem;
  font-weight:900;

  color:var(--group-ink);
}


/* =========================================================
   LISTA DE ALUMNOS
   ========================================================= */

.trj-bienvenida .welcome-list{
  display:flex;
  flex-direction:column;
}

.trj-bienvenida .welcome-list__row{
  display:grid;
  grid-template-columns:
    minmax(220px,.9fr)
    minmax(0,1.8fr);

  align-items:center;

  gap:24px;

  min-height:52px;

  padding:11px 22px;

  border-bottom:1px solid rgba(43,39,51,.06);

  background:#fff;
}

.trj-bienvenida .welcome-list__row:last-child{
  border-bottom:0;
}

.trj-bienvenida .welcome-list__row:nth-child(even){
  background:#faf9f8;
}

.trj-bienvenida .welcome-list__row:hover{
  background:var(--group-soft);
}

.trj-bienvenida .welcome-list__name{
  min-width:0;

  font-family:"Poppins",sans-serif;
  font-size:.9rem;
  font-weight:700;
  line-height:1.35;

  color:var(--welcome-ink);

  overflow-wrap:anywhere;
}

.trj-bienvenida .welcome-list__services{
  min-width:0;

  font-size:.85rem;
  line-height:1.45;

  color:var(--welcome-ink-soft);

  overflow-wrap:anywhere;
}


/* =========================================================
   ESTADOS OCULTOS
   ========================================================= */

.trj-bienvenida .welcome-list__row[hidden]{
  display:none !important;
}

.trj-bienvenida .welcome-group[hidden]{
  display:none !important;
}


/* =========================================================
   FOOTER
   ========================================================= */

.trj-bienvenida .welcome-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:20px;

  margin-top:30px;
  padding:20px 22px;

  border-radius:var(--welcome-radius-lg);

  background:var(--welcome-ink);

  color:#fff;
}

.trj-bienvenida .welcome-footer__message,
.trj-bienvenida .welcome-footer__emergency{
  display:flex;
  flex-direction:column;

  gap:3px;
}

.trj-bienvenida .welcome-footer__message strong{
  font-size:.96rem;
  color:#fff;
}

.trj-bienvenida .welcome-footer__message span,
.trj-bienvenida .welcome-footer__emergency span{
  font-size:.76rem;
  color:rgba(255,255,255,.72);
}

.trj-bienvenida .welcome-footer__emergency{
  text-align:right;
}

.trj-bienvenida .welcome-footer__emergency strong{
  font-size:.88rem;
  color:#fff;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:900px){

  .trj-bienvenida .welcome-practical{
    grid-template-columns:1fr;
  }

  .trj-bienvenida .welcome-practical__item + .welcome-practical__item{
    border-left:0;
    border-top:1px solid rgba(47,111,189,.12);
  }

  .trj-bienvenida .welcome-shifts-info__grid{
    grid-template-columns:1fr;
  }

  .trj-bienvenida .welcome-group__head{
    align-items:flex-start;
    flex-direction:column;
  }

  .trj-bienvenida .welcome-group__meeting{
    align-items:flex-start;
    min-width:0;
  }

  .trj-bienvenida .welcome-list__row{
    grid-template-columns:
      minmax(180px,.8fr)
      minmax(0,1.5fr);
  }

}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width:680px){

  .trj-bienvenida .welcome-page{
    width:min(100% - 20px,1180px);

    padding-top:12px;
  }

  .trj-bienvenida .welcome-hero{
    padding:20px 18px 18px;

    border-radius:18px;
  }

  .trj-bienvenida .welcome-hero::after{
    font-size:3.2rem;
  }

  .trj-bienvenida .welcome-hero__eyebrow{
    font-size:.68rem;
  }

  .trj-bienvenida .welcome-hero__title{
    max-width:92%;

    font-size:clamp(2rem,10vw,2.45rem);
    line-height:1.08;
  }

  .trj-bienvenida .welcome-hero__lead{
    margin:10px 0 14px;

    font-size:.92rem;
    line-height:1.5;
  }

  .trj-bienvenida .welcome-search__input{
    min-height:54px;

    padding-left:15px;

    font-size:.95rem;
  }

  .trj-bienvenida .welcome-week{
    margin-top:12px;

    font-size:.77rem;
  }

  .trj-bienvenida .welcome-practical{
    margin-bottom:14px;
  }

  .trj-bienvenida .welcome-practical__item{
    align-items:flex-start;

    padding:13px 15px;
  }

  .trj-bienvenida .welcome-practical strong{
    font-size:.86rem;
  }

  .trj-bienvenida .welcome-shifts-info{
    margin-bottom:22px;
  }

  .trj-bienvenida .welcome-shifts-info__summary{
    min-height:46px;

    padding-left:14px;

    font-size:.86rem;
  }

  .trj-bienvenida .welcome-students-head h2{
    font-size:1.35rem;
  }

  .trj-bienvenida .welcome-group__head{
    padding:17px;
  }

  .trj-bienvenida .welcome-group__title{
    font-size:1.05rem;
  }

  .trj-bienvenida .welcome-group__description{
    font-size:.8rem;
  }

  .trj-bienvenida .welcome-list__row{
    grid-template-columns:1fr;

    gap:4px;

    min-height:0;

    padding:12px 17px;
  }

  .trj-bienvenida .welcome-list__name{
    font-size:.9rem;
  }

  .trj-bienvenida .welcome-list__services{
    font-size:.8rem;
  }

  .trj-bienvenida .welcome-footer{
    align-items:flex-start;
    flex-direction:column;
  }

  .trj-bienvenida .welcome-footer__emergency{
    text-align:left;
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion:reduce){

  .trj-bienvenida .welcome-search__input{
    transition:none;
  }

}