/* ============================================================ BBS Comunicaciones — Login Skin cPanel / WHM / Webmail Selectores verificados del HTML real ============================================================ */ /* ── Fondo ─────────────────────────────────────────────────── */ body.cp, body.whm, body.wm { background: linear-gradient(135deg, #f5f0e8 0%, #fffdf8 100%) !important; min-height: 100vh; } /* ── Wrapper centrado ───────────────────────────────────────── */ #login-wrapper { display: flex !important; align-items: center !important; justify-content: center !important; min-height: 100vh !important; } /* ── Card principal ─────────────────────────────────────────── */ #login-container { background: rgba(255,255,255,.96) !important; border: 1px solid rgba(0,0,0,.08) !important; border-radius: 16px !important; box-shadow: 0 8px 40px rgba(0,0,0,.18) !important; overflow: hidden !important; } /* ── Header con logo ────────────────────────────────────────── */ #login-sub-header { background: linear-gradient(135deg,#1a1200,#2d1e00) !important; padding: 28px 20px !important; text-align: center !important; } #login-sub-header img { filter: drop-shadow(0 2px 8px rgba(219,149,0,.5)) brightness(1.1) !important; } /* ── Formulario interno ─────────────────────────────────────── */ #login-sub { padding: 24px !important; background: rgba(255,255,255,.98) !important; } /* ── Labels ─────────────────────────────────────────────────── */ #login-sub label { font-size: 10px !important; font-weight: 700 !important; letter-spacing: .8px !important; text-transform: uppercase !important; color: #888 !important; } /* ── Inputs ─────────────────────────────────────────────────── */ #login-sub input[type=text], #login-sub input[type=password] { background: #f8f7f5 !important; border: 1.5px solid #e0ddd8 !important; border-radius: 8px !important; padding: 10px 14px !important; font-size: 14px !important; transition: border-color .2s, box-shadow .2s !important; width: 100% !important; box-sizing: border-box !important; } #login-sub input[type=text]:focus, #login-sub input[type=password]:focus { border-color: #db9500 !important; box-shadow: 0 0 0 3px rgba(219,149,0,.18) !important; outline: none !important; } /* ── Boton submit ───────────────────────────────────────────── */ #login_submit { background: linear-gradient(135deg,#a97518,#db9500) !important; border: none !important; border-radius: 9px !important; color: #000 !important; font-weight: 700 !important; font-size: 14px !important; letter-spacing: .5px !important; padding: 12px 0 !important; width: 100% !important; cursor: pointer !important; box-shadow: 0 3px 14px rgba(219,149,0,.4) !important; transition: all .2s ease !important; } #login_submit:hover { transform: translateY(-1px) !important; box-shadow: 0 5px 18px rgba(219,149,0,.5) !important; } /* ── Links ──────────────────────────────────────────────────── */ #login-sub a, #login-sub-container a { color: #db9500 !important; } #login-sub a:hover, #login-sub-container a:hover { color: #a97518 !important; } /* ── Selector de idioma / footer ────────────────────────────── */ #locale-footer { opacity: .7 !important; } /* ═══════════════════════════════════════════════════════════ MODO OSCURO (toggle via JS — clase .bbs-dm en ) ════════════════════════════════════════════════════════ */ .bbs-dm body.cp, .bbs-dm body.whm, .bbs-dm body.wm { background: linear-gradient(135deg,#0a0700,#150e00,#1f1500) !important; } .bbs-dm #login-container { background: rgba(14,10,2,.96) !important; border-color: rgba(219,149,0,.15) !important; box-shadow: 0 8px 40px rgba(0,0,0,.6) !important; } .bbs-dm #login-sub { background: rgba(14,10,2,.98) !important; } .bbs-dm #login-sub label { color: #a08040 !important; } .bbs-dm #login-sub input[type=text], .bbs-dm #login-sub input[type=password] { background: #1a1200 !important; border-color: rgba(219,149,0,.2) !important; color: #f0e8d0 !important; } .bbs-dm #login-sub input[type=text]:focus, .bbs-dm #login-sub input[type=password]:focus { border-color: #db9500 !important; box-shadow: 0 0 0 3px rgba(219,149,0,.2) !important; } .bbs-dm #login-sub a, .bbs-dm #login-sub-container a { color: #ffc866 !important; } /* ── FIXES FINALES ────────────────────────────────────────── */ /* Header logo — fondo crema, sin recuadro oscuro */ #login-sub-header { background: rgba(255,252,245,0.97) !important; border-bottom: 1px solid rgba(169,117,24,0.15) !important; padding: 24px 20px 18px !important; text-align: center !important; border-radius: 16px 16px 0 0 !important; height: auto !important; } #login-sub-header img { margin-left: auto !important; margin-right: auto !important; display: block !important; max-width: 160px !important; height: auto !important; filter: none !important; } /* Contenedores — mismo ancho, sin offset lateral */ #login-container { width: 370px !important; } #login-sub-container { width: 370px !important; left: 0 !important; border-radius: 16px !important; overflow: hidden !important; box-shadow: 0 8px 40px rgba(169,117,24,0.12) !important; border: 1px solid rgba(169,117,24,0.18) !important; } /* Área del form — padding razonable */ #login-sub { height: auto !important; padding: 20px 20px 24px 20px !important; padding-left: 20px !important; background: rgba(255,252,245,0.97) !important; } /* Forms y login_form — quitar posicionamiento absoluto */ #forms { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; } #login_form, #clickthrough_form { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; } /* Botón — mismo ancho que los inputs */ .login-btn { width: 100% !important; padding-top: 12px !important; float: none !important; box-sizing: border-box !important; } #login_submit { width: 100% !important; box-sizing: border-box !important; display: block !important; } /* Modo oscuro */ html.bbs-dm #login-sub-header { background: rgba(15,10,3,0.97) !important; border-bottom-color: rgba(219,149,0,0.15) !important; } html.bbs-dm #login-sub-container { background: rgba(15,10,3,0.96) !important; } html.bbs-dm #login-sub { background: rgba(15,10,3,0.96) !important; }