/*!
    
 =========================================================
 * WebEngine CMS
 * https://webenginecms.org/
 =========================================================
 
 * Author Lautaro Angelico (https://lautaroangelico.com/)
 * Copyright (c) 2013-2026 Lautaro Angelico, All Rights Reserved
 
 * Licensed under the MIT license
 * https://opensource.org/licenses/MIT
 
 =========================================================
 
*/
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    border-top: none !important;
}

a:focus, a:hover {
    color: inherit !important;
    text-decoration: none !important;
	outline: none !important;
}

.form-control {
	background: #fafafa;
	border: 1px solid #e3e3e3;
	color: #666;
}
.form-control:focus {
	border: 1px solid #ccc;
}

/* http://stackoverflow.com/questions/19562903/remove-padding-from-columns-in-bootstrap-3 */
.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

/* http://stackoverflow.com/questions/20547819/vertical-align-with-bootstrap-3 */
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.thumbnail {
    background-color: var(--webenginecolor27);
    border: 1px solid var(--webenginecolor16);
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: var(--webenginecolor1);
}

.btn-primary {
    color: var(--webenginecolor9);
    background-color: var(--webenginecolor8);
	border-color: var(--webenginecolor10);
    transition: all .1s ease-in;
	border-radius: 3px;
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    color: var(--webenginecolor12) !important;
    background-color: var(--webenginecolor11) !important;
	border-color: var(--webenginecolor13) !important;
}

.form-horizontal .control-label {
	text-align: left !important;
}
/* MU LaSecta: el logo baja para que se vean los personajes del fondo */
#header {
	padding: 260px 0px 10px 0px;
}

/* ============================================================
   MU LaSecta: TEMA OSCURO
   Reemplaza los colores claros de la plantilla por tonos oscuros
   con detalles dorados y rojos, para que combine con el fondo.
   ============================================================ */
:root {
	--webenginebg1: #000000;
	--webenginebg2: rgba(14, 13, 20, 0.94); /* fondo del contenido */
	--webenginebg3: #0d0c12; /* fondo del pie de pagina */

	--webenginecolor1: #d4a24a; /* color principal: dorado */
	--webenginecolor2: #d2d0d8; /* texto */

	--webenginecolor3: #b9b6c2; /* links */
	--webenginecolor4: #f0c56a; /* links al pasar el mouse */

	--webenginecolor5: #1a1822; /* titulo de paneles */
	--webenginecolor6: #e8d6a8; /* texto del titulo de paneles */
	--webenginecolor7: #a3221b; /* borde del titulo de paneles */

	--webenginecolor8: #2a2733; /* botones */
	--webenginecolor9: #e0dde6;
	--webenginecolor10: #45404f;
	--webenginecolor11: #a3221b; /* botones al pasar el mouse */
	--webenginecolor12: #ffffff;
	--webenginecolor13: #d4a24a;

	--webenginecolor14: #8d8997; /* texto del pie de pagina */
	--webenginecolor63: #2e2b36;

	--webenginecolor15: #1d1b24; /* campos de texto */
	--webenginecolor16: #2e2b36; /* bordes */
	--webenginecolor17: #e0dde6;
	--webenginecolor18: #d4a24a;

	--webenginecolor21: #2e2b36;
	--webenginecolor22: #16141c; /* fondo de noticias */
	--webenginecolor23: #8d8997;

	--webenginecolor24: #16141c; /* menu de rankings */
	--webenginecolor25: #8d8997;
	--webenginecolor26: #d4a24a;

	--webenginecolor27: #16141c; /* tablas y paneles */
	--webenginecolor28: #1c1a23; /* filas alternadas */

	--webenginecolor33: #c9c6d1; /* links del panel de usuario */

	--webenginecolor54: #1c1a23;
	--webenginecolor57: #b9b6c2;
	--webenginecolor60: #e8d6a8;
	--webenginecolor61: #d2d0d8;
}

body { color: var(--webenginecolor2); }
#container { backdrop-filter: blur(4px); border: 1px solid rgba(212,162,74,0.15); border-bottom: none; }
.footer { color: var(--webenginecolor14); border: 1px solid rgba(212,162,74,0.15); border-top: none; }
.footer hr { border-color: var(--webenginecolor63); }

h1, h2, h3, h4, h5, h6 { color: #e8d6a8; }
a { color: var(--webenginecolor3); }
a:hover, a:focus { color: var(--webenginecolor4) !important; }

/* Campos de texto */
.form-control {
	background: var(--webenginecolor15);
	border: 1px solid var(--webenginecolor16);
	color: var(--webenginecolor17);
}
.form-control:focus {
	border: 1px solid var(--webenginecolor18);
	box-shadow: 0 0 6px rgba(212,162,74,0.35);
}
.form-control[disabled], .form-control[readonly] { background: #121118; color: #8d8997; }

/* Tablas */
.table { color: var(--webenginecolor2); background: transparent; }
.table > thead > tr > th { color: #e8d6a8; border-bottom: 1px solid var(--webenginecolor16) !important; }
.table-bordered, .table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th,
.table-bordered > thead > tr > td, .table-bordered > thead > tr > th { border-color: var(--webenginecolor16) !important; }
.table-striped > tbody > tr:nth-of-type(odd) { background-color: var(--webenginecolor28); }
.table-striped > tbody > tr:nth-of-type(even) { background-color: var(--webenginecolor27); }
.table-hover > tbody > tr:hover { background-color: #26232f; }

/* Paneles, cajas y listas */
.panel { background-color: var(--webenginecolor27); border-color: var(--webenginecolor16); color: var(--webenginecolor2); }
.panel-default > .panel-heading { background: var(--webenginecolor5); color: var(--webenginecolor6); border-color: var(--webenginecolor16); }
.panel-footer { background: #121118; border-color: var(--webenginecolor16); color: var(--webenginecolor23); }
.well { background: var(--webenginecolor27); border-color: var(--webenginecolor16); }
.list-group-item { background: var(--webenginecolor27); border-color: var(--webenginecolor16); color: var(--webenginecolor2); }
.panel-sidebar { box-shadow: 0 0 10px rgba(0,0,0,0.6); }
.text-muted, .help-block { color: #8d8997; }
.pagination > li > a, .pagination > li > span { background: var(--webenginecolor27); border-color: var(--webenginecolor16); color: var(--webenginecolor3); }
.pagination > .active > a, .pagination > .active > span { background: #a3221b; border-color: #a3221b; }
.dropdown-menu { background: #1a1822; border-color: var(--webenginecolor16); }
.dropdown-menu > li > a { color: var(--webenginecolor2); }
.dropdown-menu > li > a:hover { background: #26232f; }
hr { border-color: var(--webenginecolor16); }

/* Panel de usuario de la barra lateral: la imagen de fondo era clara,
   le ponemos una capa oscura encima para que se lean los links */
.panel-usercp {
	background: linear-gradient(rgba(14,13,20,0.82), rgba(14,13,20,0.82)), url('../img/usercp_bg.jpg') no-repeat top center !important;
	background-size: cover !important;
}
.panel-usercp ul li a { color: #e0dde6 !important; text-shadow: 1px 1px 2px #000; }
.panel-usercp ul li a:hover { color: var(--webenginecolor1) !important; }