/*!
    
 =========================================================
 * WebEngine CMS
 * https://webenginecms.org/
 =========================================================
 * Licensed under the MIT license
 * http://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;
}

.form-control {
	background: #111f20;
	border: 1px solid #20393a;
	color: #6c8989;
}
.form-control:focus {
	border: 1px solid #1c919d;
}

/* 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: #142526;
    border: 1px solid #20393a;
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #133538;
}

.btn-primary {
    color: #1c919d;
    background-color: transparent;
    border-color: #1c919d;
    -moz-transition: all .1s ease-in;
    -o-transition: all .1s ease-in;
    -webkit-transition: all .1s ease-in;
    transition: all .1s ease-in;
    -moz-border-radius: 0px;
    border-radius: 0px;
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    color: #ffffffba !important;
    background-color: #1c919d !important;
    border-color: #1c919d !important;
}

.form-horizontal .control-label {
	text-align: left !important;
}

.table-bordered {
    border: 1px solid #20393a;
}

.table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border: 1px solid #20393a;
}

.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #142526;
}

.table-hover>tbody>tr:hover {
    background-color: #1d3536;
}

.alert-danger {
	color: #ffe2e2;
	background-color: #502c2c;
	border-color: #724a4a;
}

.alert-success {
	color: #d5ffd6;
	background-color: #406830;
	border-color: #82af70;
}

.table>thead>tr>th {
    vertical-align: bottom;
    border-bottom: 2px solid #2b4748;
}

.help-block {
    color: #6c8989;
}
/* ===== Underwater Bubbles FX (Header) ===== */
#header{
  position: relative;
  overflow: hidden;
}

.fx-wrap{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1; /* overlay */
}

.fx-video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.12;
  mix-blend-mode: screen;
  filter: brightness(1.15) contrast(1.05) saturate(1.05) blur(.2px);
  background: transparent;
}

/* Mobile fix */
@media (max-width: 768px){
  .fx-video{
    mix-blend-mode: normal !important;
    opacity: 0.18 !important;
    filter: contrast(1.02) saturate(1.02);
  }

  .fx-wrap::after{
    content:"";
    position:absolute;
    inset:0;
    background:
      radial-gradient(circle at 50% 35%, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.55) 100%),
      linear-gradient(to bottom, rgba(0,0,0,.25), rgba(0,0,0,0) 35%, rgba(0,0,0,.35));
    pointer-events:none;
  }
}

/* ===== Fix Mobile Video Overlay ===== */

/* Base: si el navegador no soporta bien blend, que no se vea "crudo" */
.fx-video{
  background: transparent;
}

/* iOS/Android: desactivar blend del video y volverlo ultra sutil */
@media (max-width: 768px){
  .fx-video{
    mix-blend-mode: normal !important;  /* clave */
    opacity: 0.18 !important;           /* más sutil en móvil */
    filter: contrast(1.02) saturate(1.02);
  }

  /* Capa arriba para "fundir" el borde del video con el header */
  .fx-wrap::after{
    content:"";
    position:absolute;
    inset:0;
    background:
      radial-gradient(circle at 50% 35%, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.55) 100%),
      linear-gradient(to bottom, rgba(0,0,0,.25), rgba(0,0,0,0) 35%, rgba(0,0,0,.35));
    pointer-events:none;
  }
}
.hero-logo-wrap{
  position: relative;
  display: inline-block;
  padding: 22px 30px;
  border-radius: 18px;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(0, 200, 255, .20);
  box-shadow: 0 18px 45px rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
}

/* ===== HERO LOGO (MU SOLAYA) ===== */
.hero-logo-wrap{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 18px 26px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.28));
  border: 1px solid rgba(79,220,255,.22);
  box-shadow: 0 18px 55px rgba(0,0,0,.65);
  backdrop-filter: blur(8px);
}

.hero-logo{
  height: 72px; /* AJUSTA SI QUIERES */
  width: auto;
  image-rendering: auto;
  transform: translateZ(0);
  filter:
    drop-shadow(0 10px 22px rgba(0,0,0,.75))
    drop-shadow(0 0 10px rgba(79,220,255,.38))
    drop-shadow(0 0 28px rgba(0,200,255,.20));
}

/* Hover elegante */
.hero-logo-wrap:hover .hero-logo{
  filter:
    drop-shadow(0 12px 28px rgba(0,0,0,.78))
    drop-shadow(0 0 14px rgba(79,220,255,.55))
    drop-shadow(0 0 40px rgba(0,200,255,.26));
}

/* Titles */
.panel-title,
.sidebar-title,
.events-title,
h2, h3 {
  color: #4fdcff;
  text-shadow: 0 0 8px rgba(79, 220, 255, 0.25);
}

/* Panel headers */
.panel-heading,
.sidebar-heading {
  background: linear-gradient(
    90deg,
    rgba(31, 182, 255, 0.25),
    rgba(31, 182, 255, 0.05)
  );
  border-bottom: 1px solid rgba(79, 220, 255, 0.3);
}

/* Text */
.panel,
.table,
.sidebar-box,
.events-box {
  color: #cfefff;
}

/* Links */
.panel a,
.sidebar-box a {
  color: #1fb6ff;
}
.panel a:hover {
  color: #4fdcff;
  text-shadow: 0 0 6px rgba(79, 220, 255, .4);
}
/* =========================================
   MU SOLAYA - ATLANTIS BLUE THEME (Panels)
   Paste at end of override.css
========================================= */

/* Palette */
:root{
  --atl-bg: rgba(7, 16, 24, .92);        /* deep ocean */
  --atl-bg2: rgba(10, 26, 38, .92);      /* slightly brighter */
  --atl-border: rgba(79, 220, 255, .22); /* cyan border */
  --atl-glow: rgba(79, 220, 255, .18);   /* cyan glow */
  --atl-title: #4fdcff;                  /* titles */
  --atl-link: #1fb6ff;                   /* links/buttons */
  --atl-text: #cfefff;                   /* text */
  --atl-muted: rgba(207, 239, 255, .75); /* muted text */
}

/* Generic containers (covers most WebEngine blocks) */
#content .panel,
#content .panel-body,
#content .panel-default,
#content .sidebar,
#content .sidebar-box,
#content .webengine-module,
#content .webengine-panel,
#content .rankings-table-wrapper,
#content .events-schedule,
#content .top-level,
#content .header-info,
#content .header-info-block{
  background: linear-gradient(180deg, var(--atl-bg2), var(--atl-bg)) !important;
  border: 1px solid var(--atl-border) !important;
  box-shadow: 0 16px 55px rgba(0,0,0,.55) !important;
  border-radius: 14px !important;
  color: var(--atl-text) !important;
}

/* Panel headings / titles bars */
#content .panel-heading,
#content .sidebar-title,
#content .module-title,
#content .panel-title{
  background: linear-gradient(90deg, rgba(31,182,255,.22), rgba(31,182,255,.06)) !important;
  border-bottom: 1px solid rgba(79,220,255,.28) !important;
  color: var(--atl-title) !important;
  text-shadow: 0 0 10px rgba(79,220,255,.18);
}

/* Headline text inside blocks */
#content h1, #content h2, #content h3,
#content .title, #content .heading{
  color: var(--atl-title) !important;
}

/* Links */
#content a{
  color: var(--atl-link) !important;
  transition: all .2s ease;
}
#content a:hover{
  color: var(--atl-title) !important;
  text-shadow: 0 0 10px rgba(79,220,255,.25);
}

/* Tables (Top Level / Rankings style) */
#content table,
#content .table{
  background: transparent !important;
  color: var(--atl-text) !important;
}
#content .table thead th{
  color: var(--atl-title) !important;
  border-bottom: 1px solid rgba(79,220,255,.25) !important;
}
#content .table td, 
#content .table th{
  border-top: 1px solid rgba(79,220,255,.12) !important;
}
#content .table tbody tr:hover{
  background: rgba(31,182,255,.06) !important;
}

/* Small text / secondary labels */
#content .text-muted,
#content small,
#content .muted{
  color: var(--atl-muted) !important;
}

/* Buttons */
#content .btn,
#content button{
  border-radius: 12px !important;
}
#content .btn-primary{
  background: linear-gradient(180deg, rgba(31,182,255,.95), rgba(31,182,255,.65)) !important;
  border: 1px solid rgba(79,220,255,.45) !important;
  color: #04101a !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.35);
}
#content .btn-primary:hover{
  filter: brightness(1.06);
  box-shadow: 0 0 22px rgba(79,220,255,.22), 0 12px 28px rgba(0,0,0,.45);
}

/* Optional: soften harsh separators inside widgets */
#content hr{
  border-top: 1px solid rgba(79,220,255,.12) !important;
}

/* Animaci¨®n de entrada del login */
.account-login,
.login-panel,
#login {
  animation: loginFade 1.2s ease-out forwards;
  opacity: 0;
}

@keyframes loginFade {
  from {
    opacity: 0;
    transform: translateY(15px) scale(0.88);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(0.88);
  }
}

/* Glow sutil al pasar el mouse */
.account-login:hover,
.login-panel:hover,
#login:hover {
  box-shadow:
    0 0 18px rgba(79,220,255,0.25),
    0 0 45px rgba(79,220,255,0.15);
  transition: box-shadow 0.4s ease;
}

.account-login input:focus {
  box-shadow: 0 0 12px rgba(79,220,255,0.35);
  border-color: rgba(79,220,255,0.6);
}