/* =========================================================================
   rfeg-ranking — Shortcode ranking del comité
   ========================================================================= */

.rfeg-ranking {
	width: 100%;
	font-family: inherit;
  	box-sizing: border-box;
}

/* Dropdown ---------------------------------------------------------------- */

.rfeg-ranking__header {
  	display: flex;
  	justify-content: space-between;
	align-items:center;
  	flex-wrap: wrap;
	margin:0px;
}

.rfeg-ranking__header_title{
	margin:0px;
}

.rfeg-ranking__select {
	width: 100%;
  	min-width: 245px;
  	max-width: 315px;
	font-size: 12px;
	border: 1px solid var(--Linea-Footer);
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
  	color:var(--e-global-color-primary);	
}

/* Tabla ------------------------------------------------------------------- */
.rfeg-ranking__content{
	background-color:white;
	padding:16px;
	border-radius:var(--border-radius-size-m);
	border:1px solid var(--Linea-Footer);
}

.rfeg-ranking__table-wrap {
	position: relative;
	width: 100%;
	overflow-x: auto;
  	min-height: 480px;
}

.rfeg-ranking__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12px;
  	color: black;
	background-color:transparent;
  	border:none;
	border-bottom:1px solid var(--Linea-Footer);
}

.rfeg-ranking__table tbody tr:nth-child(odd),
.rfeg-ranking__table tbody tr:nth-child(even),
.rfeg-ranking__table tbody tr:nth-child(odd) td,
.rfeg-ranking__table tbody tr:nth-child(even) td {
	background-color: transparent !important;
}

.rfeg-ranking__table thead th {
	padding: 12px;
	text-align: left;
	font-weight: 600;
	white-space: nowrap;
	border: none;
	border-bottom: 1px solid var(--Linea-Footer);

	&:nth-child(3) {
		text-align: right;
	}
}

.rfeg-ranking__table tbody td {
	padding: 12px;
	border:none;
	border-bottom:1px solid var(--Linea-Footer);
}

/* Columnas ---------------------------------------------------------------- */

.rfeg-ranking__col .rfeg-ranking__col--total{
	width: 50px;
	text-align: center;
	white-space: nowrap;
}

.rfeg-ranking__col--pos {
	width: 50px;
	text-align: left
	border:none;
	border-bottom:1px solid var(--Linea-Footer);
}

.rfeg-ranking__col--nombre {
	/* sin ancho fijo: ocupa el espacio restante */
}

.rfeg-ranking__col--total {
	width: 50px;
	text-align: center;
	white-space: nowrap;
}

/* Footer ------------------------------------------------------------------ */

.rfeg-ranking__footer {
  	width: 100%;
  	display: flex;
  	flex-direction: column;
  	align-items: center;
  	justify-content: space-between;
  	gap: 8px;
}

.rfeg-ranking__footer-date{
 	display: flex;
  	justify-content: space-between;
  	align-items: center;
  	width: 100%;
}

.rfeg-ranking__fecha {
	font-size: 1rem;
	text-align: right;
  	color: var(--e-global-color-primary);  
}

.rfeg-ranking__footer-btn{
  	display: flex;
  	flex-direction: column;
	width: 100%;	
  	gap: 8px;
}

/* Botones ----------------------------------------------------------------- */

.rfeg-ranking__btn {
	display: inline-block;
	padding: 8px 16px;
	border-radius: var(--border-radius-size-m);
	font-family: inherit;
	cursor: pointer;
	text-decoration: none;
	font-size: 13px !important;
}

.rfeg-ranking__btn--pdf {
	color: var(--e-global-color-primary);
	background: #E5E7EB;
  	font-size: 14px;
  	margin: 8px 0px 6px;
  	padding: 8px;
  	cursor: pointer;
  	min-width: 72px;
  	height: 32px;
  	border-radius: 8px;
  	font-weight: 600;
  	line-height: 14px;
  
    svg{
  		width: 14px;
      	height: 14px;
      	color: var(--e-global-color-primary);
      	margin-right: 10px;
    }
}

.rfeg-ranking__btn--pdf:hover,
.rfeg-ranking__btn--pdf:focus {
	background: #fff;
  
  	svg{
      color: var(--e-global-color-41179b2);
  	}
}

.rfeg-ranking__btn--completo {
	display: inline;
  	width: 100% !important;
	text-align: center;
	font-family: "Poppins";
	font-size:13px;
	line-height:13px;
	font-weight: 600;
	cursor:pointer;

	&.btn-base-outline{
		border:1px solid var(--Bot-La-RFEG);
	}
}

.rfeg-ranking__footer-btn { /*color azul al hacer hover del primer boton*/
	> .rfeg-ranking__btn:first-child {
		&:hover{
			color: var(--Bot-La-RFEG);
		}
	}
}

/* Loader ------------------------------------------------------------------ */

.rfeg-ranking__loader {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.9);
}

.rfeg-ranking__loader[hidden] {
	display: none;
}

@keyframes rfeg-spin {
	to { transform: rotate(360deg); }
}

.rfeg-ranking__spinner {
	display: block;
	width: 32px;
	height: 32px;
	border: 3px solid #e5e7eb;
	border-top-color: var(--e-global-color-primary, #004394);
	border-radius: 50%;
	animation: rfeg-spin 0.7s linear infinite;
}

/* Popup ------------------------------------------------------------------- */

.rfeg-ranking__popup {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
}

.rfeg-ranking__popup[hidden] {
	display: none;
}

.rfeg-ranking__popup-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
}

.rfeg-ranking__popup-content {
	position: relative;
	z-index: 1;
	background: #fff;
	border-radius: 6px;
	padding: 24px;
	width: 90%;
	max-width: 620px;
	max-height: 85vh;
	overflow-y: auto;


  .rfeg-ranking__popup-close {
      position: absolute;
      top: 12px;
      right: 16px;
      background: transparent;
      border: none;
      font-size: 1.25rem;
      line-height: 1;
      padding: 4px;
      cursor: pointer;
      color: #333;
	}
}

.rfeg-ranking__popup-close:hover {
	color: #000;
}

.rfeg-ranking__popup-title {
	font-weight: 600;
	font-size: 1.05rem;
	margin: 0 0 16px;
	padding-right: 32px;
}
