/* Minimal modal styles for Cobakali auth modal */
.cobakali-auth-modal { display:none; position:fixed; inset:0; z-index:20000; align-items:center; justify-content:center; }
.cobakali-auth-modal.open { display:flex; }
.cobakali-auth-backdrop { position:absolute; inset:0; background:rgba(0,0,0,0.6); z-index:1; }
.cobakali-auth-panel-wrapper{ position:relative; display:inline-block; z-index:99999; }
.cobakali-auth-panel { position:relative; width:100%; max-width:420px; background:#0b1220; color:#e6eef8; border-radius:12px; padding:18px 20px; box-shadow:0 14px 48px rgba(2,6,23,0.7); pointer-events:auto; overflow:visible; }
.cobakali-auth-body { position:relative; }
.cobakali-auth-form label { display:block; font-size:0.95rem; margin-bottom:6px; color:#cbd5e1; }
.cobakali-auth-form input { width:100%; padding:12px 14px; margin-top:8px; margin-bottom:12px; border-radius:10px; border:1px solid rgba(255,255,255,0.06); background:#0b1220; color:#e6eef8; height:44px; box-sizing:border-box; }
.cobakali-auth-panel .forgot-link { display:inline-block; font-size:0.95rem; color:#9ca3af; text-decoration:none; margin:0; padding:6px 10px; border-radius:8px; }
.field-remember .remember-label { display:inline-flex; gap:10px; align-items:center; color:#cbd5e1; }
.field-remember .remember-label input[type="checkbox"] { width:18px; height:18px; margin:0; accent-color:#ffffff; transform:translateY(1px); }
.cobakali-auth-links { margin-top:6px; font-size:0.95rem; color:#9ca3af; }
.cobakali-auth-links a { color:#3b82f6; text-decoration:none; font-weight:600; margin-left:6px; }
.primary-btn { display:block; width:100%; padding:12px 16px; background:#2563eb; color:#fff; border-radius:10px; border:none; font-size:1.02rem; margin-top:10px; cursor:pointer; box-shadow: 0 6px 18px rgba(37,99,235,0.18); }
.resend-btn{ display:inline-block; padding:8px 12px; background:transparent; color:#60a5fa; border-radius:8px; border:1px solid rgba(96,165,250,0.12); cursor:pointer; }
.cobakali-auth-footer { color:#9ca3af; text-align:center; margin-top:12px; font-size:12px; }
.cobakali-auth-error{ color:#ffb3b3; margin-top:6px; }
.cobakali-auth-close{ position:absolute; right:12px; top:12px; color:#e6eef8; cursor:pointer; background:rgba(6,10,16,0.6); border-radius:10px; padding:0; width:44px; height:44px; display:flex; align-items:center; justify-content:center; border:none; z-index:100000; box-shadow: 0 8px 20px rgba(2,6,23,0.5); }
.cobakali-auth-close svg, .cobakali-auth-close { font-size:22px; }
.cobakali-auth-close:focus{ outline:3px solid rgba(59,130,246,0.18); box-shadow:0 12px 30px rgba(2,6,23,0.6), 0 0 0 3px rgba(59,130,246,0.06); }
.cobakali-auth-close::before{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:72px; height:72px; border-radius:12px; background:transparent; }

/* Hover / active states */
.cobakali-auth-close:hover{ transform:translateY(-2px); background:rgba(10,14,20,0.72); color:#ffffff; }
.cobakali-auth-close:active{ transform:translateY(0); box-shadow:0 6px 12px rgba(2,6,23,0.5); }
.cobakali-auth-close svg{ transition: transform 160ms ease, opacity 160ms ease; }
.cobakali-auth-close:hover svg{ transform:rotate(10deg); }

/* Screen-reader only helper */
.sr-only{ position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); white-space:nowrap; border:0; padding:0; margin:-1px; }
@media (max-width:600px){ .cobakali-auth-panel{ margin: 12px; width: calc(100% - 24px); } }

/* Mobile (small devices) improvements */
@media (max-width:600px){
	.cobakali-auth-panel-wrapper{ width:100%; display:flex; justify-content:center; }
	.cobakali-auth-panel{
		max-width: 92%;
		padding:18px 14px 14px;
		border-radius:10px;
		/* keep the panel within viewport and allow scrolling inside */
		max-height: calc(100vh - 24px);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.cobakali-auth-body{ padding-bottom:14px; }
	.cobakali-auth-form input{ height:48px; padding:12px 14px; font-size:1rem; }
	.primary-btn{ padding:14px 14px; font-size:1.02rem; border-radius:10px; }
	.cobakali-auth-close{ width:40px; height:40px; right:12px; top:12px; border-radius:8px; }
		/* reduce the invisible hit-area on very small screens so it doesn't cover content */
		.cobakali-auth-close::before{ width:48px; height:48px; }
	.cobakali-auth-close svg{ font-size:18px; }
		/* headline sizing for mobile */
		.cobakali-auth-panel h3{ font-size:1.12rem; margin:0 0 12px 0; font-weight:700; }
		.cobakali-auth-form label{ font-size:0.98rem; }
	/* Make the 'forgot' and other small links easier to tap */
	.cobakali-auth-forgot .forgot-link{ display:block; padding:8px 6px; }
	.cobakali-auth-links{ font-size:0.98rem; }
}

/* Ensure links inside panel are clickable and visible */
.cobakali-auth-panel a { color:#3b82f6; cursor:pointer; }

/* Small responsive tweak for the forgot link to be tappable */
.cobakali-auth-forgot { display:block; }
.cobakali-auth-forgot .forgot-link { color:#9ca3af; }