/* Themedost Hybrid Overlay for osTicket 1.18.x (TecNM) */
/* Paleta TecNM (base): azul primario #003569, hover/oscuro #012a4a, grises neutros */
:root{
  --brand: #003569;     /* TecNM azul primario */
  --brand-2:#012a4a;    /* Hover/activo */
  --bg:    #f6f8fb;     /* Fondo general */
  --text:  #111827;     /* Texto principal */
  --muted: #6b7280;     /* Texto secundario */
  --card:  #ffffff;     /* Fondo de tarjetas */
  --border:#e5e7eb;     /* Bordes */
  --success:#10b981;    /* Éxito */
  --danger: #ef4444;    /* Error */
}

*{box-sizing:border-box}
body{ background: #ffffff; color:var(--text); font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans';}

/* Header/Nav (client) */
#header{
  background:#ffffff;
  border-bottom:1px solid var(--border);
  position: sticky; top:0; z-index: 40;
}
#header .pull-left, #header .flush-left{display:flex; align-items:center; gap:.6rem;}
#header img{height:40px; width:40px; object-fit:contain; border-radius:8px;}
#header h1, #header h2{
  font-size:1.08rem; margin:0; color:var(--text); letter-spacing:.2px;
}
#nav, #nav ul{list-style:none; margin:0; padding:0;}
#nav{display:flex; gap:.4rem; align-items:center;}
#nav li{display:inline-block;}
#nav a{
  display:inline-block; padding:.5rem .9rem; border-radius:.65rem;
  text-decoration:none; color:var(--text);
}
#nav a:hover{ background:#eef2f7;}
#nav .active>a{ background:var(--brand); color:#fff;}

/* Main layout */
#content{ width:min(1100px, 92%); margin: 1.2rem auto 2rem auto; }
h1, h2, h3{ color:#0f172a; }
h1{ font-size:1.38rem; margin:.3rem 0 1rem;}
h2{ font-size:1.16rem; margin:.2rem 0 .8rem;}

/* Cards / containers */
.ost-card, .dialog, .content, .thread-entry, #kb{
  background: var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.04);
  padding:1rem 1rem 1.2rem;
}

/* Forms */
input[type="text"], input[type="email"], input[type="password"], input[type="number"], select, textarea{
  width:100%; padding:.65rem .9rem; border:1px solid var(--border);
  border-radius:10px; outline:none; background:#fff;
}
input:focus, select:focus, textarea:focus{
  border-color: var(--brand);
  box-shadow:0 0 0 3px rgba(0,53,105,.16);
}
label{ font-weight:600; color:var(--muted);}

.button, input[type="submit"], .action-button{
  appearance:none; border:1px solid var(--brand); background:var(--brand);
  color:#fff; padding:.65rem 1.05rem; border-radius:10px; font-weight:600; cursor:pointer;
  transition: all .15s ease;
}
.button:hover, input[type="submit"]:hover, .action-button:hover{ background:var(--brand-2); border-color:var(--brand-2);}

/* Alerts */
.error, .warning, .notice, .success{
  padding:.6rem .85rem; border-radius:10px; border:1px solid var(--border); margin:.9rem 0;
}
.error{ background:#fff1f2; border-color:#fecaca; color:#7f1d1d;}
.success{ background:#ecfdf5; border-color:#bbf7d0; color:#065f46;}
.notice{ background:#eff6ff; border-color:#bfdbfe; color:#1e3a8a;}
.warning{ background:#fffbeb; border-color:#fde68a; color:#92400e;}

/* Tables */
table.list{ width:100%; border-collapse: collapse; background:var(--card); border-radius:12px; overflow:hidden; }
table.list th, table.list td{ padding:.65rem .75rem; border-bottom:1px solid var(--border); text-align:left; }
table.list th{ background:#f0f4f9; color:#0f172a; }

/* Footer */
#footer{ border-top:1px solid var(--border); background:#fff; padding:1rem 0; color:#4b5563; }
#footer #poweredBy{ color:inherit; text-decoration:none; }

/* Utility */
.muted, .faded, .subheader{ color:var(--muted); }
hr{ border:none; border-top:1px solid var(--border); margin:1rem 0; }

/* KB */
#kb .searchbar input{ max-width: 520px; }
/* Menú: quedarnos con background-image en el <a> */
#nav a::before,
#nav a i,
#nav a .icon {
  display: none !important;
  content: none !important;
}


#nav a {
  background-repeat: no-repeat !important;
  background-position: 16px 50% !important;   /* ajusta posición si hace falta */
  background-size: 18px auto !important;      /* ajusta tamaño del icono */
  padding-left: 44px !important;              /* deja espacio para el icono */
}
#nav a:hover {
  background-repeat: no-repeat !important;
}