@charset "UTF-8";
:root { --azul:#004798; --azul-oscuro:#082653; --celeste:#0296c7; --tinta:#18314d; --gris:#687b91; --borde:#e1e8f1; --fondo:#f3f6fa; --sidebar:260px; }
* { box-sizing:border-box; }
body { margin:0; font-family:"Segoe UI",Arial,sans-serif; color:var(--tinta); background:var(--fondo); line-height:1.5; }
a { color:var(--azul); text-decoration:none; }
a:hover { text-decoration:none; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid #02a4d4; outline-offset:4px; }
.marca-icono { width:22px; height:22px; flex-shrink:0; vertical-align:middle; }
body.admin-layout { display:block; background:var(--fondo); }
.admin-layout .sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar); height:100dvh; padding:28px 18px 18px; background:#fff; border-right:1px solid var(--borde); color:var(--tinta); display:flex; flex-direction:column; align-items:stretch; overflow-y:auto; z-index:20; }
.admin-layout .sidebar a { margin:0; color:var(--gris); }
.admin-layout .sidebar .sidebar-marca { display:block; padding:0 6px 27px; border-bottom:1px solid var(--borde); }
.admin-layout .sidebar img { margin:0; }
.admin-layout .sidebar-marca img { display:block; width:100%; height:auto; }
.sidebar-seccion { font-size:10px; font-weight:700; letter-spacing:1.5px; margin:27px 12px 12px; color:#8392a5; }
.sidebar-nav { display:grid; gap:5px; }
.admin-layout .sidebar-nav a { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:9px; font-size:13px; font-weight:600; transition:background .16s,color .16s; }
.admin-layout .sidebar-nav a:hover { background:#f1f6fc; color:var(--azul); }
.admin-layout .sidebar-nav a.activo { color:var(--azul); background:#eaf2fc; box-shadow:inset 3px 0 var(--azul); }
.sidebar-pie { margin-top:auto; padding-top:36px; }
.sidebar-institucion { display:flex; align-items:center; gap:12px; padding:18px 10px; border-top:1px solid var(--borde); }
.admin-layout .sidebar-institucion img { width:31px; height:62px; object-fit:contain; }
.sidebar-institucion strong { display:block; font-size:11px; line-height:1.5; }
.sidebar-institucion span { display:block; font-size:10px; color:var(--gris); margin-top:5px; }
.admin-layout .sidebar .sidebar-salir { display:flex; gap:12px; align-items:center; padding:13px 14px; font-size:13px; }
.admin-layout .sidebar-salir:hover { color:var(--azul); background:var(--fondo); border-radius:9px; }
.sidebar-logout-form { margin:0; }
.admin-layout .sidebar .sidebar-salir { width:100%; border:0; background:transparent; cursor:pointer; font-family:inherit; color:var(--gris); text-align:left; }
.app-cabecera { height:88px; margin-left:var(--sidebar); padding:0 38px; display:flex; justify-content:space-between; align-items:center; gap:24px; background:#fff; border-bottom:1px solid var(--borde); }
.app-cabecera strong { display:block; font-size:15px; font-weight:600; margin-top:4px; }
.cabecera-contexto { font-size:9px; font-weight:700; letter-spacing:1.5px; color:var(--gris); }
.cabecera-acciones { display:flex; align-items:center; gap:23px; }
.portal-enlace { font-size:12px; font-weight:600; display:flex; align-items:center; gap:9px; }
.portal-enlace svg { width:15px; height:15px; }
.admin-avatar { width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:#eaf2fc; color:var(--azul); font-weight:700; border:1px solid #d9e7f8; }
.admin-layout .content { margin-left:var(--sidebar); padding:32px 38px; background:transparent; overflow:visible; }
.admin-layout .content>.container { max-width:1320px; margin:0 auto; padding:0; }
.dashboard-saludo { margin-bottom:22px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.dashboard-saludo h1 { font-size:25px; letter-spacing:-.7px; margin:0 0 3px; font-weight:650; }
.dashboard-saludo p { margin:0; font-size:13px; color:var(--gris); }
.estado-sistema { font-size:11px; color:#3e6175; display:flex; align-items:center; gap:7px; padding:7px 11px; border:1px solid var(--borde); border-radius:30px; background:white; white-space:nowrap; }
.estado-sistema i { width:6px; height:6px; border-radius:50%; background:#20957a; }
.dashboard-hero { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:28px; padding:36px 40px; background:var(--azul-oscuro); border-radius:15px; color:#fff; min-height:270px; }
.dashboard-hero:after { content:""; position:absolute; width:470px; height:470px; right:-140px; top:-210px; border:1px solid #ffffff12; box-shadow:0 0 0 42px #ffffff04,0 0 0 90px #ffffff04; border-radius:50%; pointer-events:none; }
.hero-texto { position:relative; z-index:1; max-width:540px; }
.hero-etiqueta { display:inline-flex; align-items:center; gap:8px; font-size:10px; font-weight:700; letter-spacing:1.8px; color:#7dd3ef; }
.hero-etiqueta:before { content:""; width:18px; height:2px; background:var(--celeste); }
.dashboard-hero h2 { margin:14px 0 12px; color:white; font-size:clamp(25px,2.6vw,36px); line-height:1.2; font-weight:650; letter-spacing:-.8px; }
.dashboard-hero p { color:#becde0; font-size:13px; line-height:1.75; margin:0 0 22px; max-width:440px; }
.hero-sello { width:194px; height:194px; border-radius:50%; background:white; padding:8px; position:relative; z-index:1; flex-shrink:0; box-shadow:0 0 0 12px #ffffff07; }
.hero-sello img { width:100%; height:100%; object-fit:contain; border-radius:50%; }
.btn-marca { display:inline-flex; justify-content:center; align-items:center; gap:9px; padding:11px 17px; font-size:12px; font-weight:650; border-radius:7px; border:1px solid transparent; cursor:pointer; }
.btn-marca svg { width:17px; height:17px; }
.btn-marca-claro { color:var(--azul-oscuro); background:#fff; }
.btn-marca-claro:hover { background:#e9f4ff; color:var(--azul); }
.btn-marca-azul { background:var(--azul); color:#fff; }
.btn-marca-azul:hover { background:#003b80; color:#fff; }
.dashboard-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:22px 0 30px; }
.stat-card { background:white; border:1px solid var(--borde); border-radius:12px; padding:20px; }
.stat-top { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.stat-top span { font-size:12px; color:var(--gris); font-weight:500; }
.stat-icono { color:var(--azul); background:#edf4fc; width:33px; height:33px; border-radius:8px; display:grid; place-items:center; }
.stat-icono svg { width:17px; height:17px; }
.stat-card strong { display:block; font-size:30px; line-height:1.2; margin:12px 0 6px; letter-spacing:-1px; color:var(--azul-oscuro); }
.stat-card small { display:block; font-size:10px; color:#8492a5; }
.dashboard-seccion-titulo { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:0 0 15px; }
.dashboard-seccion-titulo h2 { margin:0; font-size:17px; font-weight:650; letter-spacing:-.3px; }
.dashboard-seccion-titulo a { font-size:11px; font-weight:600; display:flex; gap:7px; align-items:center; }
.dashboard-seccion-titulo svg { width:15px; height:15px; }
.acciones-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:29px; }
.accion-card { display:block; padding:21px; border:1px solid var(--borde); border-radius:12px; background:white; transition:transform .15s,border-color .15s; }
.accion-card:hover { transform:translateY(-3px); border-color:#a3c6e9; }
.accion-card .accion-icono { width:40px; height:40px; border-radius:10px; display:grid; place-items:center; background:#edf4fc; color:var(--azul); margin-bottom:14px; }
.accion-card:nth-child(2) .accion-icono { background:#e9f8fc; color:#087e9f; }
.accion-card:nth-child(3) .accion-icono { background:#f0f1fa; color:#596197; }
.accion-card h3 { color:var(--tinta); font-size:14px; font-weight:650; margin:0 0 7px; }
.accion-card p { color:var(--gris); font-size:12px; margin:0 0 17px; line-height:1.65; }
.accion-card .accion-enlace { font-size:11px; font-weight:700; display:flex; align-items:center; gap:8px; }
.accion-card .accion-enlace svg { width:15px; height:15px; }
.seminarios-panel { border:1px solid var(--borde); border-radius:12px; background:white; overflow:hidden; }
.seminario-fila { display:flex; align-items:center; gap:16px; padding:18px 22px; border-bottom:1px solid #edf1f6; }
.seminario-fila:last-child { border-bottom:0; }
.seminario-fecha { flex-shrink:0; width:48px; padding:6px; text-align:center; background:#edf4fc; border-radius:8px; color:var(--azul); }
.seminario-fecha strong { display:block; font-size:20px; line-height:1.2; }
.seminario-fecha span { font-size:9px; text-transform:uppercase; letter-spacing:1px; }
.seminario-datos { min-width:0; flex:1; }
.seminario-datos h3 { margin:0 0 4px; font-size:13px; line-height:1.5; font-weight:600; overflow-wrap:anywhere; }
.seminario-datos p { margin:0; font-size:11px; color:var(--gris); }
.seminario-participantes { color:var(--gris); font-size:11px; white-space:nowrap; display:flex; gap:6px; align-items:center; }
.seminario-participantes svg { width:16px; height:16px; }
.seminario-ver { display:grid; place-items:center; width:32px; height:32px; border:1px solid var(--borde); border-radius:7px; }
.seminario-ver:hover { background:#edf4fc; }
.estado-vacio { text-align:center; padding:35px 20px; color:var(--gris); font-size:13px; }
.estado-vacio svg { margin-bottom:10px; color:var(--azul); }
.estado-vacio p { margin:0 0 14px; }
.app-pie { display:flex; justify-content:space-between; gap:16px; border-top:1px solid var(--borde); padding:22px 0 0; margin-top:28px; color:#8190a2; font-size:10px; }
.admin-layout .content>.container>h1 { color:var(--azul-oscuro); font-size:28px; font-weight:650; margin-bottom:25px; letter-spacing:-.6px; }
.admin-layout .content>.container>h2,.admin-layout .form-container h2,.admin-layout .table-container h2 { font-size:20px; color:var(--tinta); }
.admin-layout .content>.container>h3 { font-size:17px; }
.admin-layout .content .form-container,.admin-layout .content .table-container { background:#fff; border:1px solid var(--borde); border-radius:12px; padding:25px; margin-bottom:24px; overflow-x:auto; }
.admin-layout .content>.container>form { background:#fff; border:1px solid var(--borde); padding:26px; border-radius:12px; margin:20px 0; }
.admin-layout .content table { background:#fff; border-radius:10px; font-size:13px; }
.admin-layout .table thead th { color:var(--gris); background:#eff4fa; font-size:11px; font-weight:650; border-bottom:1px solid var(--borde); }
.admin-layout .table td,.admin-layout .table th { vertical-align:middle; }
.form-control { border:1px solid #d6e0eb; border-radius:7px; font-size:14px; min-height:43px; }
.form-control:focus { border-color:#65a4dc; box-shadow:0 0 0 3px #00479812; }
.form-group label,.form-label { font-size:13px; font-weight:600; color:var(--tinta); }
.btn-primary,.btn-success { background:var(--azul); border-color:var(--azul); color:#fff; border-radius:7px; font-size:13px; font-weight:600; padding:10px 17px; }
.btn-primary:hover,.btn-success:hover { background:#003c80; border-color:#003c80; }
.btn-secondary { color:var(--azul); background:#eaf2fc; border-color:#d9e6f6; }
.btn-secondary:hover { color:var(--azul); background:#dceafb; border-color:#d0e1f6; }
.error { color:#9e3535; background:#fff0f0; border:1px solid #f3d0d0; border-radius:8px; padding:12px 15px; margin:16px 0; }
.success { color:#27634d; background:#eaf7f0; border:1px solid #c9e7d8; border-radius:8px; padding:12px 15px; margin:16px 0; }
body.login-page { display:block; background:#fff; }
.login-shell { display:grid; grid-template-columns:1.1fr 1fr; min-height:100dvh; }
.login-presentacion { background:var(--azul-oscuro); padding:52px clamp(30px,5vw,90px); color:#fff; display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; }
.login-presentacion:before { content:""; position:absolute; width:700px; height:700px; border:1px solid #ffffff10; border-radius:50%; right:-380px; top:10%; box-shadow:0 0 0 65px #ffffff03,0 0 0 130px #ffffff03; pointer-events:none; }
.login-marca { width:260px; background:white; border-radius:9px; padding:14px; position:relative; }
.login-marca img { width:100%; display:block; }
.login-relato { position:relative; padding:50px 0; }
.login-relato .hero-sello { width:150px; height:150px; margin-bottom:30px; }
.login-relato h1 { font-size:clamp(30px,3.2vw,48px); line-height:1.2; letter-spacing:-1.2px; margin:15px 0 18px; color:#fff; font-weight:600; }
.login-relato p { color:#becde0; font-size:14px; max-width:400px; line-height:1.8; }
.login-institucion { position:relative; font-size:11px; color:#a5b9d1; border-top:1px solid #ffffff18; padding-top:20px; }
.login-form-panel { display:flex; flex-direction:column; justify-content:center; align-items:center; padding:45px; }
.login-form-inner { width:100%; max-width:360px; }
.login-kicker { font-size:10px; font-weight:700; color:var(--celeste); letter-spacing:2px; }
.login-form-inner h2 { font-size:30px; font-weight:650; letter-spacing:-.8px; margin:12px 0 9px; }
.login-form-inner>p { color:var(--gris); font-size:13px; margin:0 0 32px; }
.login-form-inner label { display:block; font-size:12px; font-weight:600; margin:0 0 8px; }
.login-form-inner input { width:100%; padding:12px 14px; margin-bottom:20px; color:var(--tinta); background:#fbfcfe; }
.login-form-inner .btn-marca { width:100%; margin-top:5px; padding:13px; }
.login-portal { display:block; text-align:center; margin-top:24px; padding-top:24px; border-top:1px solid var(--borde); font-size:12px; }
.login-portal svg { width:15px; margin-left:4px; }
.login-ayuda { font-size:10px; color:#8392a5; text-align:center; margin-top:32px; }
body.certificados-page { display:block; background:var(--fondo); }
.public-cabecera { background:#fff; padding:19px 7%; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--borde); }
.public-cabecera .public-logo { width:260px; max-width:75%; }
.public-cabecera .umsa-logo { height:58px; width:32px; object-fit:contain; }
.certificados-page .card { border:1px solid var(--borde); box-shadow:0 6px 30px #08265308; border-radius:15px; overflow:hidden; }
.certificados-page .card-header { background:var(--azul-oscuro)!important; padding:23px; }
.certificados-page .card-header h3 { font-size:22px; }
.certificados-page .card-body { padding:28px; }
.certificados-page .instrucciones { background:#edf4fc; border-color:#d5e5f5; color:#426484; font-size:13px; }
.certificados-page .instrucciones h5 { color:var(--azul); font-size:14px; }
.certificados-page .btn-success { background:var(--azul); }
.certificados-page .list-group-item { padding:18px; border-color:var(--borde); }
.certificados-page .list-group-item .fw-semibold { color:var(--azul-oscuro); font-size:14px; }
.certificados-page .public-ayuda { font-size:11px; color:var(--gris); line-height:1.7; }
@media(min-width:1600px) { .dashboard-hero { padding:42px 52px; } }
@media(max-width:1100px) { :root { --sidebar:224px; } .admin-layout .content { padding:26px; } .app-cabecera { padding:0 26px; } .dashboard-hero { padding:30px; } .hero-sello { width:150px; height:150px; } .dashboard-stats { gap:12px; } .stat-card { padding:15px; } .acciones-grid { gap:12px; } .accion-card { padding:17px; } }
@media(max-width:800px) { .admin-layout .sidebar { position:static; width:100%; height:auto; padding:18px; border-right:0; border-bottom:1px solid var(--borde); } .admin-layout .sidebar .sidebar-marca { padding:0 0 15px; border:0; max-width:210px; } .sidebar-seccion,.sidebar-pie { display:none; } .sidebar-nav { display:flex; overflow-x:auto; padding-bottom:4px; } .admin-layout .sidebar-nav a { flex-shrink:0; padding:9px 12px; font-size:12px; } .sidebar-nav .marca-icono { width:17px; height:17px; } .app-cabecera { margin-left:0; height:73px; padding:0 22px; } .admin-layout .content { margin-left:0; padding:24px 22px; } .dashboard-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .login-shell { grid-template-columns:1fr; } .login-presentacion { padding:24px; } .login-marca { width:220px; } .login-relato { padding:24px 0 0; } .login-relato h1 { font-size:27px; } .login-relato .hero-sello,.login-institucion,.login-relato p { display:none; } .login-form-panel { padding:35px 24px; } }
@media(max-width:540px) { .cabecera-contexto { font-size:8px; letter-spacing:1px; } .portal-enlace { font-size:0; gap:0; } .portal-enlace svg { width:19px; height:19px; } .cabecera-acciones { gap:15px; } .dashboard-saludo { align-items:flex-start; } .dashboard-saludo h1 { font-size:23px!important; } .estado-sistema { display:none; } .dashboard-hero { padding:26px; } .dashboard-hero h2 { font-size:28px; } .dashboard-hero .hero-sello { display:none; } .acciones-grid { grid-template-columns:1fr; } .accion-card { padding:20px; } .accion-card p { margin-bottom:12px; } .seminario-fila { padding:15px; gap:12px; flex-wrap:wrap; } .seminario-datos { flex-basis:calc(100% - 65px); } .seminario-participantes { margin-left:60px; } .seminario-ver { margin-left:auto; } .app-pie { flex-direction:column; gap:6px; } .admin-layout .content .form-container,.admin-layout .content .table-container { padding:18px; } .public-cabecera { padding:18px 24px; } .public-cabecera .public-logo { width:230px; } .certificados-page .card-body { padding:22px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none!important; } }
@media(max-width:800px) { .sidebar-pie { display:block; padding-top:8px; } .sidebar-institucion { display:none; } .admin-layout .sidebar .sidebar-salir { width:auto; padding:9px 12px; font-size:12px; } }
