/* SC Split Login — salescloud.es */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

.scsl-body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background:#f5f5f5;min-height:100vh;display:flex;align-items:stretch}

.scsl-container{display:flex;width:100%;min-height:100vh}

/* LEFT PANEL */
.scsl-left{position:relative;width:45%;background:linear-gradient(135deg,#1a0033 0%,#330066 40%,#1a0033 100%);background-size:cover;background-position:center;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:60px 50px 50px;color:var(--scsl-text);overflow:hidden}
.scsl-left-overlay{position:absolute;inset:0;background:linear-gradient(160deg,rgba(51,0,102,0.6) 0%,rgba(244,142,80,0.08) 50%,rgba(26,0,51,0.7) 100%);z-index:1}
.scsl-caustics-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0.6}
.scsl-particles-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.scsl-left-content{position:relative;z-index:5;max-width:400px}
.scsl-left-footer{position:absolute;bottom:20px;left:50px;z-index:5;opacity:0.6;font-size:12px}

.scsl-logo{max-width:340px;max-height:90px;margin-bottom:60px}
.scsl-left img.scsl-logo{border-radius:0}
.scsl-tagline{font-size:11px;text-transform:uppercase;letter-spacing:2px;opacity:0.6;margin-bottom:36px}
.scsl-welcome-title{font-size:28px;font-weight:700;line-height:1.2;margin-bottom:12px;color:#F48E50;text-shadow:0 2px 15px rgba(0,0,0,0.3)}
.scsl-welcome-text{font-size:14px;line-height:1.6;opacity:0.8;margin-bottom:20px}

.scsl-features{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.scsl-features li{display:flex;align-items:center;gap:8px;background:rgba(244,142,80,0.1);border:1px solid rgba(244,142,80,0.15);padding:8px 14px;border-radius:35px;font-size:12px;backdrop-filter:blur(4px)}
.scsl-features svg{flex-shrink:0}

/* RIGHT PANEL */
.scsl-right{width:55%;display:flex;align-items:center;justify-content:center;padding:40px;background:#fff}
.scsl-form-wrapper{width:100%;max-width:420px}

.scsl-form-header{margin-bottom:32px}
.scsl-form-title{font-size:26px;font-weight:700;color:#1a1a1a;margin-bottom:6px}
.scsl-form-subtitle{font-size:14px;color:#888}

/* Messages */
.scsl-message{padding:12px 16px;border-radius:35px;font-size:14px;margin-bottom:20px}
.scsl-message-error{background:#fff0f0;color:#c00;border:1px solid #ffccc7}
.scsl-message-success{background:#f0fff4;color:#080;border:1px solid #b7ebc9}

/* Form fields */
.scsl-field{margin-bottom:20px}
.scsl-field label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:6px}
.scsl-field input[type="text"],
.scsl-field input[type="email"],
.scsl-field input[type="password"],
.scsl-field input[type="tel"]{width:100%;padding:12px 16px;border:1.5px solid #ddd;border-radius:35px;font-size:15px;transition:border-color .2s,box-shadow .2s;background:#fafafa}
.scsl-field input:focus{outline:none;border-color:#330066;box-shadow:0 0 0 3px rgba(51,0,102,0.1);background:#fff}

.scsl-password-wrapper{position:relative}
.scsl-toggle-pw{display:flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;color:#999;padding:4px 0;margin-top:6px;font-size:11px;float:right}
.scsl-toggle-pw:hover{color:#330066}
.scsl-toggle-pw svg{flex-shrink:0}

.scsl-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;font-size:14px}
.scsl-remember{display:flex;align-items:center;gap:6px;color:#555}
.scsl-remember input{accent-color:var(--scsl-primary)}
.scsl-link{color:var(--scsl-primary);text-decoration:none;font-weight:500}
.scsl-link:hover{text-decoration:underline}

/* Buttons */
.scsl-btn{width:100%;padding:14px;border:none;border-radius:35px !important;font-size:15px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .2s;--btn-brd-radius:35px}
.scsl-btn:active{transform:scale(0.98)}

.scsl-btn-primary{background:linear-gradient(135deg,#330066,#F48E50);color:#fff !important}
.scsl-btn-primary:hover{background:linear-gradient(135deg,#75458D,#e07630);box-shadow:0 4px 15px rgba(51,0,102,0.3)}

.scsl-btn-google{background:#fff;color:#333;border:1.5px solid #ddd;margin-top:0}
.scsl-btn-google:hover{background:#f8f8f8}

.scsl-spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,0.3);border-top-color:#fff;border-radius:50%;animation:scsl-spin .6s linear infinite}
@keyframes scsl-spin{to{transform:rotate(360deg)}}

/* Divider */
.scsl-divider{display:flex;align-items:center;gap:16px;margin:24px 0;color:#ccc;font-size:13px}
.scsl-divider::before,.scsl-divider::after{content:'';flex:1;height:1px;background:#eee}

/* Terms */
.scsl-terms{margin-bottom:20px;font-size:13px;color:#666}
.scsl-terms a{color:var(--scsl-primary)}
.scsl-terms label{display:flex;align-items:flex-start;gap:8px}
.scsl-terms input{margin-top:2px;accent-color:var(--scsl-primary)}

/* Tab switch */
.scsl-switch{text-align:center;margin-top:28px;font-size:14px;color:#888}
.scsl-switch a{color:var(--scsl-primary);font-weight:600;text-decoration:none}
.scsl-switch a:hover{text-decoration:underline}

/* Mouse ink canvas */
.scsl-mouse-ink-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;opacity:0.5}

/* Stats counter */
.scsl-stats{display:flex;gap:20px;margin-bottom:20px}
.scsl-stat{text-align:center}
.scsl-stat-num{display:block;font-size:26px;font-weight:800;color:#F48E50;text-shadow:0 2px 10px rgba(244,142,80,0.3);line-height:1}
.scsl-stat-label{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;opacity:0.6;margin-top:4px;display:block}

/* Input ink focus effect */
.scsl-field input:focus{outline:none;border-color:#75458D;box-shadow:0 0 0 3px rgba(117,69,141,0.15),0 0 20px rgba(244,142,80,0.08);background:#fff}

/* Button liquid ink hover */
.scsl-btn-primary{background:linear-gradient(135deg,#330066,#F48E50);color:#fff !important;background-size:200% 200%;animation:scsl-ink-flow 4s ease infinite;transition:all .3s}
@keyframes scsl-ink-flow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.scsl-btn-primary:hover{box-shadow:0 6px 25px rgba(51,0,102,0.4),0 0 40px rgba(244,142,80,0.15);transform:translateY(-1px)}
.scsl-btn-primary:active{transform:translateY(0) scale(0.98)}

/* RESPONSIVE */
@media(max-width:900px){
    .scsl-container{flex-direction:column}
    .scsl-left{width:100%;min-height:auto;padding:40px 30px}
    .scsl-right{width:100%;padding:30px}
    .scsl-left-footer{position:static;margin-top:24px}
    .scsl-features{flex-direction:column}
}

@media(max-width:480px){
    .scsl-left{padding:30px 20px}
    .scsl-right{padding:20px}
    .scsl-welcome-title{font-size:24px}
}

/* Mobile touch targets */
@media(max-width:480px){
    .scsl-toggle-pw{min-height:44px;padding:8px 12px;font-size:13px}
    .scsl-btn{font-size:16px;padding:16px;min-height:48px}
    .scsl-stats{flex-wrap:wrap;gap:12px}
    .scsl-stat-num{font-size:22px}
    .scsl-stat-label{font-size:9px}
}

/* Landscape mobile */
@media(max-width:900px) and (orientation:landscape){
    .scsl-left{max-height:200px;overflow:hidden}
    .scsl-right{padding:20px}
    .scsl-form-wrapper{max-width:100%}
}

/* Disable heavy animations on mobile */
@media(max-width:768px){
    .scsl-caustics-canvas,.scsl-particles-canvas,.scsl-mouse-ink-canvas{display:none !important}
}