/* ============================================
   BOTONES DE ACCIÓN (Editar/Eliminar)
============================================ */
/* Botones circulares base */
.btn_editar,
.btn_clonar,
.btn_eliminar,
.btn_cuadrado {
	border-radius: 50% !important;
	width: 32px !important;
	min-width: 32px !important;
	height: 32px !important;
	min-height: 32px !important;;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: none !important;
	transition: all 0.2s ease !important;
}

/* boton por defecto, sin ninguna clase */
button,
.btn,
.btn-complete {
	border: 1px solid var(--btn-default-border-color) !important;
	background-color: var(--btn-default-background) !important;
	color: var(--btn-default-color) !important;
	padding: 8px 16px !important;
	border-radius: 8px !important;
	gap: 2px;
	text-transform: uppercase !important;
	font-size: clamp(14px, 1.5vw, 16px) !important;
}

.botonpeque,
.btn-xs {
	padding: 2px 8px !important;
	font-size: clamp(12px, 1.2vw, 14px) !important;
}

/* Botón Primary */
.btn-primary {
	border: 1px solid var(--btn-primary-border-color) !important;
	background-color: var(--btn-primary-background) !important;
	color: var(--btn-primary-color) !important;
}

.btn-secondary {
	border: 1px solid var(--btn-secondary-border-color) !important;
	background-color: var(--btn-secondary-background) !important;
	color: var(--btn-secondary-color) !important;
}

/* Botón Success */
.btn-success {
	border: 1px solid var(--btn-success-border-color) !important;
	background-color: var(--btn-success-background) !important;
	color: var(--btn-success-color) !important;
}

/* Botón Danger */
.btn-danger {
	border: 1px solid var(--btn-danger-border-color) !important;
	background-color: var(--btn-danger-background) !important;
	color: var(--btn-danger-color) !important;
}

/* Botón Warning */
.btn-warning {
	border: 1px solid var(--btn-warning-border-color) !important;
	background-color: var(--btn-warning-background) !important;
	color: var(--btn-warning-color) !important;
}

/* Botón Info */
.btn-info, .btn-info-2026 {
	border: 1px solid var(--btn-info-border-color) !important;
	background-color: var(--btn-info-background) !important;
	color: var(--btn-info-color) !important;
}

/* Hover genérico para todos los botones */
.btn:hover,
.btn-primary:hover,
.btn-secondary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-warning:hover,
.btn-info:hover,
.btn-info-2026:hover {
	transform: scale(1.05);
}

/* Hover por defecto */
.btn:hover {
	background-color: var(--btn-default-background-hover) !important;
	border-color: var(--btn-default-border-color-hover) !important;
	color: var(--btn-default-color-hover) !important;
}

/* Hover Primary */
.btn-primary:hover {
	background-color: var(--btn-primary-background-hover) !important;
	border-color: var(--btn-primary-border-color-hover) !important;
	color: var(--btn-primary-color-hover) !important;
}

/* Hover Secondary */
.btn-secondary:hover {
	background-color: var(--btn-secondary-background-hover) !important;
	border-color: var(--btn-secondary-border-color-hover) !important;
	color: var(--btn-secondary-color-hover) !important;
}

/* Hover Success */
.btn-success:hover {
	background-color: var(--btn-success-background-hover) !important;
	border-color: var(--btn-success-border-color-hover) !important;
	color: var(--btn-success-color-hover) !important;
}

/* Hover Danger */
.btn-danger:hover {
	background-color: var(--btn-danger-background-hover) !important;
	border-color: var(--btn-danger-border-color-hover) !important;
	color: var(--btn-danger-color-hover) !important;
}

/* Hover Warning */
.btn-warning:hover {
	background-color: var(--btn-warning-background-hover) !important;
	border-color: var(--btn-warning-border-color-hover) !important;
	color: var(--btn-warning-color-hover) !important;
}

/* Hover Info */
.btn-info:hover,
.btn-info-2026:hover {
	background-color: var(--btn-info-background-hover) !important;
	border-color: var(--btn-info-border-color-hover) !important;
	color: var(--btn-info-color-hover) !important;
}

/* Estado activo */
.btn:active,
.btn.active,
.btn.active:focus {
	background-color: var(--btn-default-background-active) !important;
	border-color: var(--btn-default-border-color-active) !important;
	color: var(--btn-default-color-active) !important;
}

.btn-primary:active,
.btn-primary.active,
.btn-primary:focus {
	background-color: var(--btn-primary-background-active) !important;
	border-color: var(--btn-primary-border-color-active) !important;
	color: var(--btn-primary-color-active) !important;
}

.btn-secondary:active,
.btn-secondary.active,
.btn-secondary:focus {
	background-color: var(--btn-secondary-background-active) !important;
	border-color: var(--btn-secondary-border-color-active) !important;
	color: var(--btn-secondary-color-active) !important;
}

.btn-success:active,
.btn-success.active,
.btn-success:focus {
	background-color: var(--btn-success-background-active) !important;
	border-color: var(--btn-success-border-color-active) !important;
	color: var(--btn-success-color-active) !important;
}

.btn-danger:active,
.btn-danger.active,
.btn-danger:focus {
	background-color: var(--btn-danger-background-active) !important;
	border-color: var(--btn-danger-border-color-active) !important;
	color: var(--btn-danger-color-active) !important;
}

.btn-warning:active,
.btn-warning.active,
.btn-warning:focus {
	background-color: var(--btn-warning-background-active) !important;
	border-color: var(--btn-warning-border-color-active) !important;
	color: var(--btn-warning-color-active) !important;
}

.btn-info:active,
.btn-info-2026:active,
.btn-info.active,
.btn-info-2026.active,
.btn-info:focus,
.btn-info-2026:focus {
	background-color: var(--btn-info-background-active) !important;
	border-color: var(--btn-info-border-color-active) !important;
	color: var(--btn-info-color-active) !important;
}

/* Alineación de iconos en botones */
.btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	/* Espacio automático entre texto e icono */
}

/* Por defecto: Icono a la derecha */
.btn i,
.btn svg {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	vertical-align: middle !important;
	line-height: 1 !important;
	margin: 0 !important;
	order: 1 !important;
	font-size: clamp(14px, 1.5vw, 16px) !important;
}

/* Clase opcional para poner icono a la izquierda */
.btn.btn-icon-left i,
.btn.btn-icon-left svg {
	order: -1 !important;
	/* Forzar a la izquierda */
}

.botonpeque i,
.btn-xs i,
.botonpeque svg,
.btn-xs svg {
	font-size: clamp(12px, 1.2vw, 14px) !important;
}


/* Excepción para botones circulares (solo icono) */
.btn_editar i,
.btn_eliminar i,
.btn_editar svg,
.btn_eliminar svg
.btn_clonar i,
.btn_clonar svg {
	margin: 0 !important;
}

.icon-btn {
	width: 32px !important;
	height: 32px !important;
	padding: 8px !important;
	display: inline-flex !important;
	justify-content: center !important;
	align-items: center !important;
	aspect-ratio: 1/1 !important;
}

.btn-xs.icon-btn,
.botonpeque.icon-btn {
	width: 24px !important;
	height: 24px !important;
}

.icon-btn i,
.icon-btn svg {
	overflow: visible !important;display: flex;
	align-items: center;
	gap: 10px;
}
.boton_peque_clemente {
    min-width: 3rem;
    height: 1.5rem;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    justify-content: center !important;
    padding: 0 0.5rem !important;
    line-height: 0.5rem !important;
    border: none;
    font-size: 0.7rem !important;
    border-radius: 0.5em !important;
}

.boton_peque_clemente i {
    height: auto !important;
}

.boton_like_label {
    border-radius: 50px !important;
    padding: 0 20px !important;
    gap: 4px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 21px !important;
    min-width: 55px !important;
}

.btnDesmarcarCompeticiones {
	display: none !important;
}
.btnDesmarcarCompeticiones2024 {
	display: block !important;
}
.btnClonar2026 {
    background-color: #db00ff !important;
	border-color: #db00ff !important;
	color: #ffffff !important;
}
.btn-arbol, .btn-pink {
    background-color: #db00ff !important;
    border-color: #db00ff !important;
    color: #ffffff !important;
}

.btn-arbol:hover,
.btn-pink:hover {
    background-color: #da65ec !important;
    border-color: #da65ec !important;
    color: #ffffff !important;
}

.btn-arbol:active,
.btn-pink:active,
.btn-arbol:focus,
.btn-pink:focus {
    background-color: #b800cc !important;
    border-color: #b800cc !important;
    color: #ffffff !important;
}
button.close {
    padding: 6px 12px 7px !important;
}

.dropdown-default.open {
    height: inherit !important;
}
.bg-master-light {
    background-color: #ffffff;
    border: 1px solid var(--primary-color);
	border-radius: 8px;
}
div.dt-buttons a.dt-button.btn-conversaciones-2026 {
	background-color: var(--btn-warning-background) !important;
	border-color: var(--btn-warning-border-color) !important;
	color: var(--btn-warning-color) !important;
}

div.dt-buttons a.dt-button.btn-conversaciones-2026:hover{
	background-color: var(--btn-warning-background-hover) !important;
	border-color: var(--btn-warning-border-color-hover) !important;
	color: var(--btn-warning-color-hover) !important;
}

div.dt-buttons a.dt-button.btn-conversaciones-2026:active{
	background-color: var(--btn-warning-background-active) !important;
	border-color: var(--btn-warning-border-color-active) !important;
	color: var(--btn-warning-color-active) !important;
}

.horarios_partido-2026{
	width: 90% !important;
}

.capa_jornada.jornada_actual{
	background: #3457FF;
}

.capa_jornada {
	background-color: #ECECEC;
}
.datepicker .datepicker-days table tr td.active {
    background-color: #6d5cae !important;
	color: #fff !important;
}
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
	color: #000 !important;
    background: #3DF59E !important;
}
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger {
	color: #fff !important;
	background: #EA0B0B !important;
}
.cajagris{background-color: #ccc;}
.cajagris .table tbody tr td{background-color: transparent;}

#albaranes .linea {
	background-color: #f8f9fa !important;
}
.grupo-botones {
    display: flex;
    gap: 0.5em;
    flex-wrap: wrap;
}
.grupo-botones .btn {
    flex: 1;
}
