/* Nest theme shell. Components are styled by Nest Core (nest.css). */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.nest-app {
	margin: 0;
	min-height: 100vh;
	font-family: "Baloo 2", "Baloo Bhaijaan 2", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 17px;
	line-height: 1.5;
	color: var(--nest-ink, #1E1650);
	background:
		radial-gradient(600px 400px at 0% 0%, rgba(155, 220, 255, .55), transparent 70%),
		radial-gradient(700px 500px at 100% 10%, rgba(255, 190, 235, .45), transparent 70%),
		radial-gradient(700px 600px at 50% 100%, rgba(190, 240, 210, .45), transparent 70%),
		var(--nest-bg, #F3F0FF);
	background-attachment: fixed;
	-webkit-font-smoothing: antialiased;
}
body.rtl.nest-app, [dir="rtl"] body.nest-app { font-family: "Baloo Bhaijaan 2", "Baloo 2", system-ui, sans-serif; }
img, video { max-width: 100%; height: auto; }
a { color: var(--nest-primary, #6C3CE9); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.skip-link:focus { position: fixed !important; top: 8px; inset-inline-start: 8px; width: auto; height: auto; clip: auto; z-index: 100000; padding: 10px 16px; background: #fff; border-radius: 10px; }
:focus-visible { outline: 3px solid var(--nest-accent, #1FB6FF); outline-offset: 2px; }

/* ---------- Header ---------- */
.nest-header { position: sticky; top: 0; z-index: 50; padding-top: env(safe-area-inset-top); background: rgba(246, 243, 255, .82); backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px); }
.nest-header-inner { max-width: 1180px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px; }
.nest-logo { display: inline-flex; align-items: center; text-decoration: none; }
.nest-logo img { display: block; max-height: 52px; width: auto; }
.nest-logo-text { font-size: 2.2rem; font-weight: 800; line-height: 1; letter-spacing: -.02em; background: linear-gradient(135deg, #3D7BFF 0%, #6C3CE9 55%, #B44CFF 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nest-header-actions { display: flex; align-items: center; gap: 10px; }
.nest-round { position: relative; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: var(--nest-ink, #1E1650); box-shadow: 0 8px 18px -10px rgba(76, 46, 180, .45); text-decoration: none; transition: transform .15s; }
.nest-round:hover { transform: translateY(-2px); color: var(--nest-primary, #6C3CE9); }
.nest-dot { position: absolute; top: 4px; inset-inline-end: 4px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 99px; background: #FF4D6D; color: #fff; font-size: .7rem; font-weight: 800; line-height: 18px; text-align: center; border: 2px solid #fff; }
.nest-dot[hidden] { display: none; }
.nest-me { padding: 3px; background: conic-gradient(#FFB020, #FF4FA3, #8B5CF6, #1FB6FF, #FFB020); }
.nest-me img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid #fff; background: #fff; }
@media (max-width: 380px) { .nest-round { width: 44px; height: 44px; } .nest-logo-text { font-size: 1.9rem; } }

/* ---------- Layout ---------- */
.nest-main { padding: 6px 14px calc(120px + env(safe-area-inset-bottom)); }
.nest-container, .nest-content > .nest-home { max-width: 1180px; margin: 0 auto; }
.nest-builder { max-width: none; }
.nest-title { font-size: clamp(1.7rem, 6vw, 2.4rem); font-weight: 800; margin: 10px 0 16px; }
.nest-content > :first-child { margin-top: 0; }
.nest-archive { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.nest-entry { padding: 14px; }
.nest-entry img { border-radius: 16px; }
.nest-entry h2 { font-size: 1.3rem; margin: 8px 0; }
.nest-entry h2 a { color: inherit; text-decoration: none; }
.nest-404 h1 { margin: 0; }
@media (min-width: 900px) { .nest-main { padding-inline: 24px; } }

/* ---------- Bottom navigation ---------- */
.nest-bottom-nav { position: fixed; inset-inline: 0; bottom: 0; z-index: 60; padding: 0 10px calc(10px + env(safe-area-inset-bottom)); pointer-events: none; }
.nest-bottom-inner { pointer-events: auto; position: relative; max-width: 760px; margin: 0 auto; display: flex; align-items: center; justify-content: space-around; gap: 2px; padding: 8px 8px; border-radius: 30px; background: rgba(255, 255, 255, .96); box-shadow: 0 -2px 0 rgba(255,255,255,.6) inset, 0 18px 40px -12px rgba(46, 26, 140, .35); backdrop-filter: blur(10px); }
.nest-nav-item { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 2px; border-radius: 18px; color: #4B4670; text-decoration: none; font-size: .78rem; font-weight: 600; line-height: 1.1; transition: color .15s, background .15s; -webkit-tap-highlight-color: transparent; }
.nest-nav-item span { white-space: nowrap; }
.nest-nav-item:hover { color: var(--nest-primary, #6C3CE9); }
.nest-nav-item.is-active { color: var(--nest-primary, #6C3CE9); font-weight: 800; }
.nest-nav-item.is-active .nest-i { fill: color-mix(in srgb, var(--nest-primary, #6C3CE9) 25%, transparent); }
.nest-create-btn { flex: none; width: 72px; height: 72px; margin: -38px 4px 0; display: grid; place-items: center; border: 5px solid #fff; border-radius: 50%; color: #fff; cursor: pointer; background: linear-gradient(135deg, #5BC0FF, #6C3CE9 60%, #B44CFF); box-shadow: 0 0 0 4px rgba(108, 60, 233, .18), 0 14px 26px -8px rgba(108, 60, 233, .7); transition: transform .2s cubic-bezier(.2,.9,.3,1.4); -webkit-tap-highlight-color: transparent; }
.nest-create-btn:hover { transform: translateY(-3px) rotate(90deg); }
.nest-create-btn:active { transform: scale(.92); }
@media (min-width: 600px) { .nest-nav-item { font-size: .9rem; } }
@media (max-width: 440px) { .nest-bottom-inner { padding: 8px 4px; } .nest-nav-item { font-size: .68rem; letter-spacing: -.01em; padding-inline: 0; } .nest-nav-item .nest-i { width: 24px; height: 24px; } .nest-create-btn { width: 64px; height: 64px; margin-inline: 2px; } }
@media (max-width: 360px) { .nest-nav-item { font-size: .6rem; } .nest-create-btn { width: 56px; height: 56px; } }

/* ---------- Reels page: immersive ---------- */
body.nest-is-reels { background: #0E0A24; }
body.nest-is-reels .nest-header { display: none; }
body.nest-is-reels .nest-main { padding: 0; }
body.nest-is-reels .nest-bottom-inner { background: rgba(20, 14, 52, .78); }
body.nest-is-reels .nest-nav-item { color: #CFC8F5; }
body.nest-is-reels .nest-nav-item.is-active { color: #fff; }
body.nest-is-reels .nest-create-btn { border-color: #1A1240; }

.nest-dot.is-green { background: #22C55E; }
.nest-round.is-ring .nest-i { animation: nest-ring .9s ease; transform-origin: 50% 10%; }
@keyframes nest-ring { 15% { transform: rotate(14deg); } 30% { transform: rotate(-12deg); } 45% { transform: rotate(9deg); } 60% { transform: rotate(-6deg); } 75% { transform: rotate(3deg); } }
@media (max-width: 380px) { .nest-header-actions { gap: 6px; } .nest-round { width: 42px; height: 42px; } }

/* Some plugins (e.g. BuddyPress/BuddyBoss) turn <body> into a flex box; never let content push the page wider than the screen. */
body.nest-app > .nest-main, body.nest-app > .nest-header, body.nest-app > .nest-bottom-nav { min-width: 0; max-width: 100%; }
body.nest-app > .nest-main { width: 100%; flex: 1 1 auto; }

/* Header: logo always LEFT, every icon grouped on the RIGHT — even when a plugin makes <body> a flex box. */
body.nest-app > .nest-header { width: 100%; align-self: stretch; flex: 0 0 auto; }
.nest-header-inner { width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center; direction: ltr; }
.nest-header-inner > .nest-logo, .nest-header-inner > .custom-logo-link { flex: 0 0 auto; margin-right: auto; margin-left: 0; }
.nest-header-actions { flex: 0 0 auto; margin-left: auto; justify-content: flex-end; }
.nest-round.is-active { background: var(--nest-primary, #6C3CE9); color: #fff; }
.nest-round.is-active:hover { color: #fff; }
@media (max-width: 430px) {
	.nest-header-inner { padding: 8px 12px; gap: 8px; }
	.nest-header-actions { gap: 6px; }
	.nest-round { width: 42px; height: 42px; }
	.nest-round .nest-i { width: 21px; height: 21px; }
	.nest-logo-text { font-size: 1.85rem; }
	.nest-logo img { max-height: 40px; }
	.nest-dot { top: 0; inset-inline-end: 0; }
}
@media (max-width: 359px) {
	.nest-round { width: 38px; height: 38px; }
	.nest-header-actions { gap: 4px; }
	.nest-logo-text { font-size: 1.6rem; }
}
@media (min-width: 900px) { .nest-header-inner { max-width: none; padding-inline: 28px; } }

/* ---------- Full-width desktop ---------- */
.nest-container, .nest-content > .nest-home { max-width: 1920px; }
@media (min-width: 900px) {
	.nest-main { padding-inline: clamp(24px, 2.6vw, 48px); }
	.nest-header-inner { padding-inline: clamp(24px, 2.6vw, 48px); max-width: none; }
}
