/* Full-screen hero styles for thinknprint */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
* { box-sizing: border-box; }
body { font-family: 'Poppins', Arial, Helvetica, sans-serif; margin:0; color:#fff; background: linear-gradient(180deg,#08306b 0%, #0b4e84 50%, #145a9a 100%); }
.hero-full { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:36px 20px; position:relative; }
.hero-inner { max-width:920px; margin:0 auto; }

/* header news scrolling animation */
.header-news-container { overflow:hidden; position:relative; height:24px; /* adjust height as needed */ }
.header-news { display:inline-block; position:absolute; white-space:nowrap; animation:news-scroll 15s linear infinite; font-size:14px; }

@keyframes news-scroll { 0% { left:100%; } 100% { left:-100%; }
}

.status-banner { max-width:820px; margin:0 auto 18px; padding:12px 16px; border-radius:8px; font-weight:600 }
.status-banner.success { background:rgba(34,197,94,0.12); color:#bff7c9; }
.status-banner.error { background:rgba(220,38,38,0.12); color:#ffd6d6; }
.logo-wrap { display:flex; justify-content:center; margin-bottom:12px; }
.logo { width:160px; height:auto; filter: drop-shadow(0 6px 18px rgba(0,0,0,0.25)); }
.brand { font-size:44px; margin:6px 0 6px; letter-spacing:1px; font-weight:700; }
.brand-main { color:#ffffff; }
.brand-accent { color:#ffd24a; margin-left:4px; }
.tagline { font-size:20px; color:#ffd24a; margin:6px 0 10px; font-weight:600; }
.subtitle { color:rgba(255,255,255,0.9); margin:0 0 22px; font-size:16px; }
.cta-row { display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; gap:12px; text-decoration:none; color:#fff; padding:16px 28px; border-radius:48px; font-size:16px; font-weight:600; box-shadow:0 10px 30px rgba(2,16,62,0.28); transition:transform .12s ease, box-shadow .12s ease; }
.btn:active { transform:translateY(1px); }
.btn-login { background: linear-gradient(180deg,#2aa0f2 0%, #0b63d4 100%); }
.btn-register { background: linear-gradient(180deg,#6ad67a 0%, #2aa64a 100%); color:#023; box-shadow:0 10px 30px rgba(2,62,16,0.18); }
.btn::before { display:inline-block; width:22px; height:22px; text-align:center; font-weight:700; }
.btn-login::before { content: '\27A4'; /* arrow */ }
.btn-register::before { content: '\2795'; /* plus */ }
.hero-footer { position: absolute; bottom:14px; left:0; right:0; text-align:center; color:rgba(255,255,255,0.85); font-size:13px; }

@media (max-width:600px) {
	.brand { font-size:32px; }
	.logo { width:120px; }
	.btn { width:100%; justify-content:center; padding:14px 18px; }
	.cta-row { flex-direction:column; gap:12px; }
}

/* Callback bar styles */
#callback-bar { position:fixed; left:0; right:0; bottom:0; display:flex; justify-content:center; pointer-events:auto; z-index:1200; }
#callback-bar .callback-toggle { position:fixed; right:20px; bottom:20px; background:linear-gradient(180deg,#ff8c42,#ff6b00); color:#022; border:none; padding:12px 18px; border-radius:40px; font-weight:700; box-shadow:0 10px 30px rgba(0,0,0,0.25); cursor:pointer; }
.callback-panel { position:fixed; right:20px; bottom:80px; width:360px; max-width:92%; background:linear-gradient(180deg, rgba(255,255,255,0.98), #ffffff); color:#012; border-radius:12px; box-shadow:0 20px 50px rgba(2,16,62,0.25); padding:16px; transform-origin:100% 100%; transition:transform .18s ease, opacity .18s ease; }
.callback-panel h4 { margin:0 0 6px; }
.callback-panel .small { margin:0 0 10px; font-size:13px; color:#444; }
.callback-panel label { display:block; margin:8px 0; font-size:14px; color:#083; }
.callback-panel input[type="text"], .callback-panel input[type="tel"], .callback-panel select, .callback-panel textarea { width:100%; padding:10px; border-radius:8px; border:1px solid #e6e6e6; font-size:14px; }
.callback-actions { display:flex; gap:10px; margin-top:12px; }
.callback-panel .btn { box-shadow:none; border-radius:8px; padding:10px 12px; font-size:14px; }
.callback-open .callback-panel { opacity:1; transform:translateY(0) scale(1); }
.callback-closed .callback-panel { opacity:0; transform:translateY(8px) scale(.98); pointer-events:none; }

@media (max-width:520px){
	.callback-panel { right:12px; left:12px; bottom:72px; width:auto; }
	#callback-bar .callback-toggle { right:12px; bottom:12px; }
}

/* Topbar styles */
.topbar { position:fixed; left:0; right:0; top:0; background: linear-gradient(135deg, #ff9800 0%, #fb8c00 100%) !important; border-bottom:1px solid rgba(255,255,255,0.25) !important; z-index:1100; }
.topbar .topbar-inner { display:flex; align-items:center; justify-content:space-between; padding:10px 20px; gap:16px; }
.topbar-left { display:flex; gap:12px; align-items:center; }
.tb-name { display:block; font-weight:700; color:#fff; }
.tb-role { display:block; font-size:13px; color:#fff; text-transform:capitalize; opacity:0.9; }
.topbar-right { display:flex; gap:14px; align-items:center; }
.tb-wallet { color:#fff; background:rgba(0,0,0,0.15); padding:6px 10px; border-radius:20px; font-weight:700; }
.tb-link, .tb-actions .tb-link, .tb-actions button { color:#fff; text-decoration:none; padding:6px 10px; border-radius:6px; background:rgba(255,255,255,0.18); border:0; }
.tb-avatar-wrap { width:44px; height:44px; overflow:hidden; border-radius:50%; margin-right:10px; }
.tb-avatar { width:44px; height:44px; object-fit:cover; display:block; }
.tb-menu { position:absolute; right:20px; top:56px; background:#fff; color:#111; border-radius:6px; box-shadow:0 8px 24px rgba(2,16,62,0.2); display:none; padding:8px 0; }
.tb-menu a { display:block; padding:8px 14px; color:#111; text-decoration:none; }
.tb-menu a:hover { background:#f2f2f2; }

/* adjust page content to not hide under topbar */
.hero-full { padding-top:90px; }
.admin-wrap { margin-top:110px; }

/* Make generic .btn visible on light containers (admin pages, lists) */
.container .btn, .wrap .btn, .admin-wrap .btn {
	background: #0b63d4;
	color: #fff;
	box-shadow: none;
	padding: 8px 10px;
	border-radius: 6px;
	font-size: 14px;
	text-decoration: none;
}


