/**
 * Content Shield — modal styles
 * 8 themes (light, dark, minimal, glass, gradient, neon, sunset, eps)
 * 5 animations (fade, slide, bounce, zoom, flip)
 */

/* Overlay */
.cshield-overlay{
	position:fixed;inset:0;width:100%;height:100%;
	background:rgba(0,0,0,.6);
	-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
	z-index:999999;opacity:0;visibility:hidden;
	transition:opacity .3s ease,visibility .3s ease;
	display:flex;align-items:center;justify-content:center;
}
.cshield-overlay.is-active{opacity:1;visibility:visible;}
.cshield-overlay.pos-top{align-items:flex-start;padding-top:6vh;}
.cshield-overlay.pos-bottom{align-items:flex-end;padding-bottom:6vh;}

/* Modal box */
.cshield-modal{
	position:relative;background:#fff;border-radius:16px;
	box-shadow:0 25px 50px rgba(0,0,0,.25);
	max-width:420px;width:90%;padding:0;
	opacity:0;transform:scale(.8);
	transition:opacity .3s cubic-bezier(.34,1.56,.64,1),transform .3s cubic-bezier(.34,1.56,.64,1);
	font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
.cshield-overlay.is-active .cshield-modal{opacity:1;transform:scale(1);}

.cshield-modal-header{padding:24px 24px 0;text-align:center;}
.cshield-modal-icon{
	width:64px;height:64px;margin:0 auto 16px;
	background:linear-gradient(135deg,#ff6b6b,#ee5a5a);
	border-radius:50%;display:flex;align-items:center;justify-content:center;
	font-size:32px;color:#fff;box-shadow:0 8px 24px rgba(238,90,90,.4);
}
.cshield-modal-title{margin:0;font-size:22px;font-weight:700;color:#1a1a2e;}
.cshield-modal-body{padding:16px 24px 24px;text-align:center;}
.cshield-modal-message{margin:0;font-size:15px;line-height:1.6;color:#666;}
.cshield-modal-footer{padding:0 24px 24px;text-align:center;}
.cshield-modal-btn{
	display:inline-block;padding:14px 48px;
	background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;
	font-size:15px;font-weight:600;border:none;border-radius:50px;cursor:pointer;
	transition:transform .3s ease,box-shadow .3s ease;
	box-shadow:0 4px 15px rgba(102,126,234,.4);
}
.cshield-modal-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,.5);}
.cshield-modal-btn:active{transform:translateY(0);}
.cshield-modal-close{
	position:absolute;top:12px;right:12px;width:32px;height:32px;
	background:#f5f5f5;border:none;border-radius:50%;cursor:pointer;
	display:flex;align-items:center;justify-content:center;
	font-size:18px;color:#999;transition:background .2s,color .2s;line-height:1;
}
.cshield-modal-close:hover{background:#eee;color:#333;}
.cshield-countdown{display:block;margin-top:12px;font-size:12px;opacity:.7;}

/* ---------- Overlays per theme ---------- */
.cshield-overlay.ov-light{background:rgba(100,100,120,.4);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.cshield-overlay.ov-dark{background:linear-gradient(135deg,rgba(10,10,20,.9),rgba(30,20,50,.85));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.cshield-overlay.ov-minimal{background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);}
.cshield-overlay.ov-glass{background:linear-gradient(180deg,rgba(200,200,255,.3),rgba(255,255,255,.4));-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);}
.cshield-overlay.ov-gradient{background:linear-gradient(135deg,rgba(102,126,234,.5),rgba(118,75,162,.5) 50%,rgba(246,79,89,.3));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);}
.cshield-overlay.ov-neon{background:radial-gradient(ellipse at center,rgba(0,255,136,.1),rgba(0,0,0,.9) 70%);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}
.cshield-overlay.ov-sunset{background:linear-gradient(180deg,rgba(255,107,53,.3),rgba(45,27,61,.8) 50%,rgba(26,26,46,.9));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.cshield-overlay.ov-eps{background:linear-gradient(135deg,rgba(20,0,0,.92),rgba(60,5,10,.88));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}

/* ---------- Dark ---------- */
.cshield-modal.t-dark{background:linear-gradient(145deg,#1a1a2e,#16213e);box-shadow:0 25px 60px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.05);}
.cshield-modal.t-dark .cshield-modal-title{color:#fff;}
.cshield-modal.t-dark .cshield-modal-message{color:#a0a0b8;}
.cshield-modal.t-dark .cshield-modal-close{background:rgba(255,255,255,.08);color:#888;}
.cshield-modal.t-dark .cshield-modal-close:hover{background:rgba(255,255,255,.15);color:#fff;}

/* ---------- Minimal ---------- */
.cshield-modal.t-minimal{background:#fff;border-radius:4px;box-shadow:0 4px 20px rgba(0,0,0,.08);border:1px solid #e5e5e5;}
.cshield-modal.t-minimal .cshield-modal-title{color:#1a1a1a;font-weight:500;}
.cshield-modal.t-minimal .cshield-modal-message{color:#555;}
.cshield-modal.t-minimal .cshield-modal-icon{background:#f8f8f8;color:#333;box-shadow:none;border:1px solid #eee;}
.cshield-modal.t-minimal .cshield-modal-btn{background:#1a1a1a;border-radius:4px;box-shadow:none;}
.cshield-modal.t-minimal .cshield-modal-btn:hover{background:#333;box-shadow:none;transform:none;}

/* ---------- Glass ---------- */
.cshield-modal.t-glass{
	background:linear-gradient(135deg,rgba(255,255,255,.25),rgba(255,255,255,.15) 50%,rgba(255,255,255,.25));
	-webkit-backdrop-filter:blur(20px) saturate(1.8);backdrop-filter:blur(20px) saturate(1.8);
	border:1px solid rgba(255,255,255,.4);border-radius:20px;
	box-shadow:0 8px 32px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.5);
}
.cshield-modal.t-glass .cshield-modal-title{color:#2a2a4a;text-shadow:0 1px 2px rgba(255,255,255,.5);}
.cshield-modal.t-glass .cshield-modal-message{color:rgba(40,40,70,.85);}
.cshield-modal.t-glass .cshield-modal-icon{background:linear-gradient(135deg,rgba(102,126,234,.3),rgba(118,75,162,.3));color:#5a6fd6;border:1px solid rgba(102,126,234,.3);box-shadow:none;}

/* ---------- Gradient ---------- */
.cshield-modal.t-gradient{background:linear-gradient(135deg,#667eea,#764ba2 50%,#f64f59);border-radius:20px;box-shadow:0 20px 50px rgba(102,126,234,.3);}
.cshield-modal.t-gradient .cshield-modal-title{color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2);}
.cshield-modal.t-gradient .cshield-modal-message{color:rgba(255,255,255,.9);}
.cshield-modal.t-gradient .cshield-modal-icon{background:rgba(255,255,255,.2);color:#fff;border:1px solid rgba(255,255,255,.3);}
.cshield-modal.t-gradient .cshield-modal-btn{background:rgba(255,255,255,.95);color:#764ba2;font-weight:700;}
.cshield-modal.t-gradient .cshield-modal-btn:hover{background:#fff;}

/* ---------- Neon ---------- */
.cshield-modal.t-neon{background:linear-gradient(180deg,#0a0a0f,#0f0f18);border:2px solid #00ff88;border-radius:16px;box-shadow:0 0 40px rgba(0,255,136,.25),0 0 80px rgba(0,255,136,.1);}
.cshield-modal.t-neon .cshield-modal-title{color:#00ff88;text-shadow:0 0 15px rgba(0,255,136,.7);letter-spacing:1px;}
.cshield-modal.t-neon .cshield-modal-message{color:#aabbcc;}
.cshield-modal.t-neon .cshield-modal-icon{background:rgba(0,255,136,.1);border:2px solid #00ff88;color:#00ff88;box-shadow:0 0 25px rgba(0,255,136,.4);}
.cshield-modal.t-neon .cshield-modal-btn{background:rgba(0,255,136,.1);border:2px solid #00ff88;color:#00ff88;box-shadow:0 0 20px rgba(0,255,136,.3);text-shadow:0 0 8px rgba(0,255,136,.5);}
.cshield-modal.t-neon .cshield-modal-btn:hover{background:#00ff88;color:#0a0a0f;box-shadow:0 0 35px rgba(0,255,136,.7);text-shadow:none;}

/* ---------- Sunset ---------- */
.cshield-modal.t-sunset{background:linear-gradient(180deg,#2d1b3d,#1a1a2e 50%,#0f0f1a);border-radius:20px;box-shadow:0 20px 50px rgba(45,27,61,.5);border:1px solid rgba(255,215,0,.15);}
.cshield-modal.t-sunset .cshield-modal-title{color:#ffd700;text-shadow:0 2px 8px rgba(255,215,0,.3);}
.cshield-modal.t-sunset .cshield-modal-message{color:#ccbbdd;}
.cshield-modal.t-sunset .cshield-modal-icon{background:linear-gradient(135deg,#ff6b35,#f7931e 50%,#ffd700);color:#fff;box-shadow:0 8px 30px rgba(247,147,30,.5);}
.cshield-modal.t-sunset .cshield-modal-btn{background:linear-gradient(135deg,#ff6b35,#f7931e);box-shadow:0 4px 20px rgba(247,147,30,.4);}

/* ---------- EPS (exclusive: red/black branded) ---------- */
.cshield-modal.t-eps{
	background:linear-gradient(160deg,#161013 0%,#1d0d11 55%,#2a0c12 100%);
	border-radius:18px;border:1px solid rgba(214,40,57,.45);
	box-shadow:0 22px 60px rgba(0,0,0,.6),0 0 60px rgba(214,40,57,.15),inset 0 1px 0 rgba(255,255,255,.04);
}
.cshield-modal.t-eps .cshield-modal-title{color:#fff;letter-spacing:.5px;text-shadow:0 2px 10px rgba(214,40,57,.4);}
.cshield-modal.t-eps .cshield-modal-message{color:#c9b8bc;}
.cshield-modal.t-eps .cshield-modal-icon{
	background:linear-gradient(135deg,#d62839,#8a0f1c);color:#fff;
	box-shadow:0 8px 30px rgba(214,40,57,.5),inset 0 1px 0 rgba(255,255,255,.2);
}
.cshield-modal.t-eps .cshield-modal-btn{
	background:linear-gradient(135deg,#d62839,#a51323);box-shadow:0 4px 20px rgba(214,40,57,.45);
	letter-spacing:.5px;
}
.cshield-modal.t-eps .cshield-modal-btn:hover{box-shadow:0 8px 28px rgba(214,40,57,.6);}
.cshield-modal.t-eps .cshield-modal-close{background:rgba(255,255,255,.07);color:#a98;}
.cshield-modal.t-eps .cshield-modal-close:hover{background:rgba(214,40,57,.3);color:#fff;}

/* ---------- Animations ---------- */
.cshield-modal.a-slide{transform:translateY(60px) scale(.96);transition:opacity .4s cubic-bezier(.23,1,.32,1),transform .4s cubic-bezier(.23,1,.32,1);}
.cshield-overlay.is-active .cshield-modal.a-slide{transform:translateY(0) scale(1);}

.cshield-modal.a-bounce{transform:scale(.3);transition:opacity .5s,transform .5s cubic-bezier(.68,-.55,.265,1.55);}
.cshield-overlay.is-active .cshield-modal.a-bounce{transform:scale(1);}

.cshield-modal.a-zoom{transform:scale(0) rotate(-10deg);transition:opacity .35s,transform .35s cubic-bezier(.34,1.56,.64,1);}
.cshield-overlay.is-active .cshield-modal.a-zoom{transform:scale(1) rotate(0);}

.cshield-modal.a-flip{transform:perspective(800px) rotateX(-90deg);transform-origin:top center;transition:opacity .45s,transform .45s cubic-bezier(.34,1.4,.5,1);}
.cshield-overlay.is-active .cshield-modal.a-flip{transform:perspective(800px) rotateX(0);}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
	.cshield-no-motion .cshield-modal,
	.cshield-no-motion .cshield-overlay{transition:opacity .15s ease!important;}
	.cshield-no-motion .cshield-modal{transform:none!important;}
	.cshield-no-motion .cshield-overlay.is-active .cshield-modal{transform:none!important;}
}

/* DevTools blur action */
body.cshield-blurred{filter:blur(12px);transition:filter .25s ease;pointer-events:none;}

/* Responsive */
@media (max-width:480px){
	.cshield-modal{max-width:95%;}
	.cshield-modal-icon{width:56px;height:56px;font-size:28px;}
	.cshield-modal-title{font-size:20px;}
	.cshield-modal-btn{padding:12px 36px;font-size:14px;}
}
