/* TaskWala Auth front-end styles */
:root{
	--twa-green:#1dbf73;
	--twa-green-dark:#19a463;
	--twa-black:#111827;
	--twa-gray-900:#1f2937;
	--twa-gray-600:#4b5563;
	--twa-gray-300:#e5e7eb;
	--twa-gray-100:#f6f7f9;
	--twa-white:#ffffff;
	--twa-radius:10px;
	--twa-shadow:0 1px 2px rgba(0,0,0,.06),0 4px 12px rgba(0,0,0,.06);
	--twa-shadow-hover:0 8px 24px rgba(0,0,0,.12);
}

.twa-wrap{max-width:1180px;margin:0 auto;padding:24px 0px 60px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--twa-gray-900);}
.twa-narrow{max-width:460px;}
.twa-center{text-align:center;}

.twa-page-title{font-size:26px;font-weight:700;margin:0 0 6px;color:var(--twa-black);}
.twa-muted{color:var(--twa-gray-600);font-size:14px;margin-bottom:18px;}

/* Banner messages */
.twa-banner{padding:12px 16px;border-radius:var(--twa-radius);margin-bottom:20px;font-size:14px;font-weight:500;}
.twa-banner-success{background:#e7f9f1;color:var(--twa-green-dark);border:1px solid #b7ecd3;}
.twa-banner-error{background:#fdecec;color:#c0392b;border:1px solid #f7c9c9;}

/* Buttons */
.twa-btn{display:inline-block;padding:12px 22px;border-radius:6px;font-weight:700;font-size:14px;text-decoration:none;text-align:center;cursor:pointer;border:2px solid transparent;margin-bottom:10px;margin-right:8px;box-sizing:border-box;}
.twa-btn-block{display:block;width:100%;margin-right:0;}
.twa-btn-primary{background:var(--twa-green);color:#fff;}
.twa-btn-primary:hover{background:var(--twa-green-dark);color:#fff;}
.twa-btn-outline{background:transparent;border-color:var(--twa-black);color:var(--twa-black);}
.twa-btn-outline:hover{background:var(--twa-black);color:#fff;}

.twa-btn-google{background:#fff;border-color:var(--twa-gray-300);color:var(--twa-gray-900);display:flex;align-items:center;justify-content:center;gap:10px;}
.twa-btn-google:hover{border-color:var(--twa-gray-900);color:var(--twa-black);}
.twa-google-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,#4285f4,#34a853,#fbbc05,#ea4335);color:#fff;font-weight:800;font-size:12px;}

.twa-divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--twa-gray-600);font-size:12px;text-transform:uppercase;letter-spacing:.04em;}
.twa-divider::before,.twa-divider::after{content:"";flex:1;height:1px;background:var(--twa-gray-300);}

/* Forms */
.twa-form{background:#fff;border:1px solid var(--twa-gray-300);border-radius:var(--twa-radius);padding:26px;box-shadow:var(--twa-shadow);}
.twa-form label{display:block;font-size:13px;font-weight:700;color:var(--twa-gray-900);margin-bottom:16px;}
.twa-form input[type=text],.twa-form input[type=email],.twa-form input[type=tel],.twa-form input[type=password],.twa-form input[type=file],.twa-form select{width:100%;box-sizing:border-box;margin-top:6px;padding:11px 12px;border:1px solid var(--twa-gray-300);border-radius:6px;font-size:14px;font-family:inherit;}
.twa-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.twa-inline-form{margin-top:-14px;box-shadow:none;border:none;padding:0;background:none;}
.twa-hint{display:block;font-weight:400;color:var(--twa-gray-600);font-size:12px;margin-top:6px;}

.twa-checkbox-label{display:flex;align-items:center;gap:8px;font-weight:500;}
.twa-checkbox-label input{width:auto;margin:0;}

.twa-password-wrap{position:relative;display:block;margin-top:6px;}
.twa-password-wrap .twa-password-input{margin-top:0;padding-right:64px;}
.twa-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--twa-green-dark);font-size:12px;font-weight:700;cursor:pointer;padding:4px 6px;}
.twa-password-toggle:hover{text-decoration:underline;}

.twa-switch{font-size:13.5px;color:var(--twa-gray-600);text-align:center;margin-top:14px;}
.twa-switch a{color:var(--twa-green-dark);font-weight:700;text-decoration:none;}
.twa-switch a:hover{text-decoration:underline;}

/* Dynamic header login/logout button */
.twa-auth-btn{padding:9px 18px;font-size:13px;margin:0;}

/* Account-type role selector */
.twa-role-select{margin-bottom:18px;}
.twa-role-label{font-size:13px;font-weight:700;color:var(--twa-gray-900);margin:0 0 8px;}
.twa-role-option{display:flex;align-items:center;gap:10px;border:1px solid var(--twa-gray-300);border-radius:8px;padding:12px 14px;margin-bottom:10px;font-weight:600;font-size:14px;cursor:pointer;transition:border-color .15s,background .15s;}
.twa-role-option:hover{border-color:var(--twa-green);}
.twa-role-option input[type=radio]{width:auto;margin:0;accent-color:var(--twa-green);}
.twa-role-option:has(input:checked){border-color:var(--twa-green);background:#f2fbf7;}

/* Combined login/signup tabs */
.twa-tab-nav{display:flex;background:var(--twa-gray-100);border-radius:var(--twa-radius);padding:4px;margin-bottom:22px;gap:4px;}
.twa-tab-btn{flex:1;padding:11px 0;border:none;background:transparent;border-radius:7px;font-size:14px;font-weight:700;color:var(--twa-gray-600);cursor:pointer;transition:background .15s,color .15s;}
.twa-tab-btn:hover{color:var(--twa-gray-900);}
.twa-tab-btn-active{background:#fff;color:var(--twa-black);box-shadow:var(--twa-shadow);}
.twa-tab-panel{display:none;}
.twa-tab-panel-active{display:block;}

@media (max-width:640px){
	.twa-form-row{grid-template-columns:1fr;}
}