/* ==========================================================================
   GPN Theme — Core Components
   Mobile-first. Consumes design tokens from tokens.css.
   ========================================================================== */

/* --- Base globals --- */
body {
	background: var(--gpnt-bg);
	color: var(--gpnt-text);
	font-family: var(--gpnt-font-sans);
	font-size: var(--gpnt-text-base);
	line-height: var(--gpnt-leading-normal);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

a { color: var(--gpnt-accent-2); text-decoration: none; }
a:hover { color: var(--gpnt-accent-hover); }

h1, h2, h3, h4 { color: var(--gpnt-text); font-weight: var(--gpnt-weight-bold); line-height: var(--gpnt-leading-tight); margin: 0 0 var(--gpnt-space-3); }
h1 { font-size: var(--gpnt-text-2xl); }
h2 { font-size: var(--gpnt-text-xl); }
h3 { font-size: var(--gpnt-text-lg); }
p { margin: 0 0 var(--gpnt-space-3); }

img, video { max-width: 100%; height: auto; display: block; }

/* --- Layout shell --- */
.site-content {
	max-width: var(--gpnt-feed-max);
	margin: 0 auto;
	padding: var(--gpnt-space-4) var(--gpnt-space-3);
	padding-bottom: calc(var(--gpnt-tabbar-h) + var(--gpnt-space-5)); /* clear the bottom tab bar on mobile */
}

/* --- Header --- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	height: var(--gpnt-header-h);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 var(--gpnt-space-4);
	background: rgba(11, 26, 46, 0.85);
	backdrop-filter: saturate(150%) blur(10px);
	border-bottom: 0.5px solid var(--gpnt-border);
}
.site-branding a { color: var(--gpnt-text); font-weight: var(--gpnt-weight-bold); font-size: var(--gpnt-text-lg); letter-spacing: 0.3px; }
.custom-logo { max-height: 34px; width: auto; }

/* --- Buttons --- */
.gpn-btn,
input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--gpnt-space-2);
	min-height: var(--gpnt-tap-min);
	padding: 0 var(--gpnt-space-4);
	background: var(--gpnt-accent);
	color: var(--gpnt-text-on-accent);
	font-family: inherit;
	font-size: var(--gpnt-text-base);
	font-weight: var(--gpnt-weight-medium);
	border: none;
	border-radius: var(--gpnt-radius-md);
	cursor: pointer;
	transition: background 0.15s ease, transform 0.05s ease;
}
.gpn-btn:hover, input[type="submit"]:hover { background: var(--gpnt-accent-hover); }
.gpn-btn:active, input[type="submit"]:active { background: var(--gpnt-accent-active); transform: scale(0.98); }

/* Bare <button> elements are FLAT by default — no pill, no box.
   Opt into the filled look explicitly with the .gpn-btn class. */
button {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
}

.gpn-btn--secondary {
	background: var(--gpnt-surface-2);
	color: var(--gpnt-text);
}
.gpn-btn--secondary:hover { background: var(--gpnt-surface-3); }

.gpn-btn--ghost {
	background: transparent;
	color: var(--gpnt-text-secondary);
	border: 0.5px solid var(--gpnt-border);
}
.gpn-btn--pill { border-radius: var(--gpnt-radius-pill); }

/* --- Cards --- */
.gpn-card {
	background: var(--gpnt-surface);
	border: 0.5px solid var(--gpnt-border);
	border-radius: var(--gpnt-radius-lg);
	padding: var(--gpnt-space-4);
	margin-bottom: var(--gpnt-space-4);
}

/* --- Avatars --- */
.gpn-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--gpnt-surface-2);
	color: var(--gpnt-accent-2);
	font-size: var(--gpnt-text-sm);
	font-weight: var(--gpnt-weight-medium);
	object-fit: cover;
	flex-shrink: 0;
	overflow: hidden;
}
.gpn-avatar--sm { width: 32px; height: 32px; }
.gpn-avatar--lg { width: 72px; height: 72px; font-size: var(--gpnt-text-lg); }

/* --- Post card --- */
.gpn-post { background: var(--gpnt-surface); border: 0.5px solid var(--gpnt-border); border-radius: var(--gpnt-radius-lg); padding: var(--gpnt-space-4); margin-bottom: var(--gpnt-space-4); }
.gpn-post__head { display: flex; align-items: center; gap: var(--gpnt-space-3); margin-bottom: var(--gpnt-space-3); }
.gpn-post__author { color: var(--gpnt-text); font-weight: var(--gpnt-weight-medium); font-size: var(--gpnt-text-sm); }
.gpn-post__meta { color: var(--gpnt-text-muted); font-size: var(--gpnt-text-xs); }
.gpn-post__body { color: var(--gpnt-text); font-size: var(--gpnt-text-base); line-height: var(--gpnt-leading-normal); margin-bottom: var(--gpnt-space-3); }
.gpn-post__media { border-radius: var(--gpnt-radius-md); overflow: hidden; border: 0.5px solid var(--gpnt-border); margin-bottom: var(--gpnt-space-3); }
.gpn-post__actions { display: flex; align-items: center; gap: var(--gpnt-space-5); color: var(--gpnt-text-secondary); }
.gpn-post__action { display: inline-flex; align-items: center; gap: var(--gpnt-space-2); font-size: var(--gpnt-text-sm); background: none; border: none; border-radius: 0; min-height: auto; padding: var(--gpnt-space-1) 0; color: var(--gpnt-text-secondary); cursor: pointer; }
.gpn-post__action svg { width: 19px; height: 19px; display: block; }
.gpn-post__action:hover { background: none; color: var(--gpnt-accent); }
.gpn-post__action.is-active { color: var(--gpnt-accent); }

/* --- Forms --- */
input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="url"], textarea, select {
	width: 100%;
	min-height: var(--gpnt-tap-min);
	padding: var(--gpnt-space-3);
	background: var(--gpnt-surface);
	color: var(--gpnt-text);
	font-family: inherit;
	font-size: var(--gpnt-text-md); /* 16px avoids iOS zoom-on-focus */
	border: 0.5px solid var(--gpnt-border);
	border-radius: var(--gpnt-radius-md);
}
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--gpnt-accent); box-shadow: 0 0 0 3px var(--gpnt-accent-soft); }
::placeholder { color: var(--gpnt-text-muted); }
textarea { min-height: 96px; resize: vertical; }

/* --- Primary nav (desktop top bar) --- */
.main-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--gpnt-space-4); }
.main-navigation a { color: var(--gpnt-text-secondary); font-weight: var(--gpnt-weight-medium); }
.main-navigation a:hover, .main-navigation .current-menu-item a { color: var(--gpnt-text); }

/* --- Bottom tab bar (mobile native-style) --- */
.gpn-tabbar {
	position: fixed;
	bottom: 0; left: 0; right: 0;
	z-index: 60;
	height: var(--gpnt-tabbar-h);
	display: flex;
	align-items: center;
	justify-content: space-around;
	background: rgba(11, 26, 46, 0.92);
	backdrop-filter: saturate(150%) blur(10px);
	border-top: 0.5px solid var(--gpnt-border);
	padding-bottom: env(safe-area-inset-bottom); /* iPhone home indicator */
}
.gpn-tabbar__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--gpnt-tap-min);
	min-height: var(--gpnt-tap-min);
	color: var(--gpnt-text-muted);
	font-size: 1.4rem;
}
.gpn-tabbar__item.is-active { color: var(--gpnt-accent); }
.gpn-tabbar__compose {
	width: 40px; height: 40px;
	background: var(--gpnt-accent);
	color: var(--gpnt-text-on-accent);
	border-radius: var(--gpnt-radius-md);
}

/* --- Utilities --- */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* --- Desktop: hide bottom tab bar, use top nav, add side breathing room --- */
@media (min-width: 768px) {
	.gpn-tabbar { display: none; }
	.site-content { padding-bottom: var(--gpnt-space-6); }
}

/* --- Focus & tap: no square outlines or tap-flash --- */
html { -webkit-tap-highlight-color: transparent; }
button:focus, .gpn-btn:focus, .gpn-post__action:focus, a:focus { outline: none; box-shadow: none; }
/* Keyboard users still get a clean, rounded focus ring (not on tap/click) */
.gpn-btn:focus-visible, input[type="submit"]:focus-visible { outline: 2px solid var(--gpnt-accent); outline-offset: 2px; }
.gpn-post__action:focus-visible, a:focus-visible { outline: none; color: var(--gpnt-accent); }

/* --- Full-width / Elementor pages: escape the feed-column constraint --- */
body.elementor-page #content.site-content,
body.page-template-full-width-php #content.site-content { max-width: none; padding: 0; }
.site-main--full { width: 100%; }

/* --- Header actions (login/account) --- */
.site-header__actions { margin-left: auto; display: flex; align-items: center; gap: var(--gpnt-space-3); }
.site-header__actions .gpn-btn { min-height: 38px; padding: 0 var(--gpnt-space-4); font-size: var(--gpnt-text-sm); }

/* --- Secondary/ghost button text fix (ensure readable light text) --- */
.gpn-btn--secondary { color: var(--gpnt-text); }
.gpn-btn--ghost { color: var(--gpnt-text-secondary); }
.site-header__actions .gpn-btn--secondary,
.site-header__actions .gpn-btn--ghost { color: var(--gpnt-text); }

/* --- Header button text — force readable (beat any plugin/global override) --- */
.site-header__actions a.gpn-btn--secondary,
.site-header__actions a.gpn-btn--ghost { color: var(--gpnt-text) !important; }
.site-header__actions a.gpn-btn { color: var(--gpnt-text) !important; }

/* --- Primary nav: desktop only; tab bar handles mobile --- */
.main-navigation { display: none; }
@media (min-width: 768px) { .main-navigation { display: block; } }

/* --- Desktop layout: main + sidebar (>=1024px); mobile unchanged --- */
.gpn-sidebar { display: none; }
@media (min-width: 1024px) {
  body.gpn-has-sidebar .site-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 24px;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    align-items: start;
  }
  body.gpn-has-sidebar .site-content > #primary { min-width: 0; max-width: none; }
  .gpn-sidebar { display: flex; flex-direction: column; gap: 16px; }
  .gpn-sidebar__widget { background: var(--gpnt-surface); border: 0.5px solid var(--gpnt-border); border-radius: var(--gpnt-radius-md); padding: 14px 16px; }
  .gpn-sidebar__title { margin: 0 0 8px; font-size: var(--gpnt-text-sm, 14px); font-weight: 500; color: var(--gpnt-text); }
  .gpn-sidebar__filler { margin: 0; font-size: 13px; color: var(--gpnt-text-muted); }
}

/* --- Desktop wide (no sidebar) pages e.g. profiles: widen single column on desktop --- */
@media (min-width: 1024px) {
  body.gpn-desktop-wide .site-content { max-width: 900px !important; margin-left: auto !important; margin-right: auto !important; }
  body.gpn-desktop-wide .site-content > #primary { max-width: none !important; width: 100% !important; }
}

/* --- Tab bar labels: stack icon + text, flatten compose to flat 'Post' --- */
.gpn-tabbar__item { flex-direction: column !important; gap: 2px !important; font-size: 1.25rem !important; padding: 4px 2px !important; flex: 1 1 0 !important; }
.gpn-tabbar__label { font-size: 10px !important; line-height: 1 !important; font-weight: 500 !important; letter-spacing: 0.2px !important; }
.gpn-tabbar__compose { width: auto !important; height: auto !important; background: transparent !important; color: var(--gpnt-text-muted) !important; border-radius: 0 !important; }
.gpn-tabbar__item svg { width: 22px !important; height: 22px !important; }
.gpn-tabbar { height: auto !important; min-height: var(--gpnt-tabbar-h) !important; padding-top: 4px !important; }

/* --- Login + PMPro form fields: light fields + dark text on the white login card.
   Autofill-proof: autofill paints a light background, so dark text stays readable
   in every state (empty, autofilled, typing, focused). No dark-field hacks. --- */
form#loginform input.input,
form#loginform input#user_login,
form#loginform input#user_pass,
form#loginform input[type=text],
form#loginform input[type=password],
form#loginform input[type=email],
.pmpro_form input[type=text],
.pmpro_form input[type=password],
.pmpro_form input[type=email],
.pmpro_login_wrap input[type=text],
.pmpro_login_wrap input[type=email],
.pmpro_login_wrap input[type=password],
#pmpro_login_wrapper input.input,
#pmpro_login_wrapper input#user_login,
#pmpro_login_wrapper input#user_pass,
#pmpro_login_wrapper input[type=text],
#pmpro_login_wrapper input[type=password],
#pmpro_login_wrapper input[type=email] {
  background-color: #FFFFFF !important;
  color: #0B1A2E !important;
  -webkit-text-fill-color: #0B1A2E !important;
  caret-color: #0B1A2E !important;
  border: 1px solid #C7D2E0 !important;
  border-radius: 8px !important;
  opacity: 1 !important;
  color-scheme: light !important;
}
form#loginform input::placeholder,
.pmpro_form input::placeholder,
.pmpro_login_wrap input::placeholder,
#pmpro_login_wrapper input::placeholder { color: #6B7E98 !important; -webkit-text-fill-color: #6B7E98 !important; }
/* Autofill stays light-bg + dark-text (covers -webkit-autofill and the standard :autofill) */
form#loginform input:-webkit-autofill,
form#loginform input:-webkit-autofill:hover,
form#loginform input:-webkit-autofill:focus,
form#loginform input:-webkit-autofill:active,
.pmpro_form input:-webkit-autofill,
.pmpro_login_wrap input:-webkit-autofill,
#pmpro_login_wrapper input:-webkit-autofill,
form#loginform input:autofill,
.pmpro_form input:autofill,
.pmpro_login_wrap input:autofill,
#pmpro_login_wrapper input:autofill {
  -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset !important;
  box-shadow: 0 0 0 1000px #FFFFFF inset !important;
  -webkit-text-fill-color: #0B1A2E !important;
  caret-color: #0B1A2E !important;
  color: #0B1A2E !important;
}
form#loginform .button:not(.button-primary),
#pmpro_login_wrapper .button:not(.button-primary),
a.button.pmpro_btn-register,
.pmpro_btn-register,
input#wp-submit.button-secondary,
.bp-login-widget-register-link a,
a.button[href*='register'], a.button[href*='checkout'] {
  background: transparent !important;
  color: var(--gpnt-accent-2) !important;
  border: 1px solid var(--gpnt-accent) !important;
}
form#loginform label, .pmpro_form label, #pmpro_login_wrapper label, .pmpro_card label { color: var(--gpnt-text) !important; }

/* --- Dark theme for PMPro cards & messages (login / checkout / account) --- */
.pmpro_card { background: var(--gpnt-surface) !important; color: var(--gpnt-text) !important; border-color: var(--gpnt-border) !important; }
.pmpro_card h1, .pmpro_card h2, .pmpro_card h3, .pmpro_card legend, .pmpro_card .pmpro_card_title, .pmpro_card p, .pmpro_card li, .pmpro_card td, .pmpro_card th { color: var(--gpnt-text) !important; }
.pmpro_message { background: var(--gpnt-surface-2) !important; color: var(--gpnt-text) !important; border-color: var(--gpnt-border) !important; }
.pmpro_message.pmpro_error { border-left: 4px solid #e06a6a !important; }
.pmpro_message.pmpro_success { border-left: 4px solid #4caf7d !important; }

/* --- Dark theme for the bbPress Visual (TinyMCE) editor chrome --- */
#bbpress-forums .mce-tinymce.mce-container { border: 1px solid var(--gpnt-border) !important; box-shadow: none !important; }
#bbpress-forums .mce-panel, #bbpress-forums .mce-toolbar-grp, #bbpress-forums .mce-top-part, #bbpress-forums .mce-statusbar, #bbpress-forums .mce-edit-area { background: var(--gpnt-surface) !important; border-color: var(--gpnt-border) !important; }
#bbpress-forums .mce-btn, #bbpress-forums .mce-btn button { background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--gpnt-text) !important; }
#bbpress-forums .mce-btn:hover, #bbpress-forums .mce-btn button:hover, #bbpress-forums .mce-btn.mce-active, #bbpress-forums .mce-btn.mce-active button { background: var(--gpnt-surface-2) !important; }
#bbpress-forums .mce-ico { color: var(--gpnt-text) !important; }
#bbpress-forums .mce-btn.mce-disabled .mce-ico { color: var(--gpnt-text-muted) !important; opacity: .5 !important; }
#bbpress-forums .mce-statusbar, #bbpress-forums .mce-statusbar .mce-path, #bbpress-forums .mce-statusbar .mce-path-item { color: var(--gpnt-text-muted) !important; }

/* --- GPN emoji picker popover --- */
.gpn-emoji-pop { position: absolute; z-index: 100001; background: var(--gpnt-surface-2); border: 1px solid var(--gpnt-border); border-radius: 10px; padding: 6px; box-shadow: 0 8px 28px rgba(0,0,0,.45); display: grid; grid-template-columns: repeat(8, 30px); gap: 2px; }
.gpn-emoji-item { background: transparent; border: 0; cursor: pointer; font-size: 20px; line-height: 1; width: 30px; height: 30px; padding: 0; border-radius: 6px; display: flex; align-items: center; justify-content: center; }
.gpn-emoji-item:hover { background: var(--gpnt-surface) !important; }
#bbpress-forums .mce-gpn-emoji-btn button, #bbpress-forums .mce-gpn-emoji-btn .mce-txt { font-size: 18px !important; line-height: 1 !important; }

/* --- GPN media (photo/video) popover --- */
.gpn-media-pop { position: absolute; z-index: 100001; width: 280px; max-width: calc(100vw - 24px); background: var(--gpnt-surface-2); border: 1px solid var(--gpnt-border); border-radius: 10px; padding: 12px; box-shadow: 0 8px 28px rgba(0,0,0,.45); color: var(--gpnt-text, #EAF0F7); }
.gpn-media-title { font-weight: 600; font-size: 14px; margin-bottom: 8px; color: var(--gpnt-text, #EAF0F7); }
.gpn-media-label { display: block; font-size: 12px; color: var(--gpnt-text-secondary); margin-bottom: 4px; }
.gpn-media-row { display: flex; gap: 6px; }
.gpn-media-input { flex: 1 1 auto; min-width: 0; background: var(--gpnt-surface); color: var(--gpnt-text, #EAF0F7); border: 1px solid var(--gpnt-border); border-radius: 6px; padding: 6px 8px; font-size: 13px; }
.gpn-media-input:focus { outline: none; border-color: var(--gpnt-accent); }
.gpn-media-insert { background: var(--gpnt-accent); color: #fff; border: 0; border-radius: 6px; padding: 6px 12px; font-size: 13px; cursor: pointer; white-space: nowrap; }
.gpn-media-insert:hover { filter: brightness(1.08); }
.gpn-media-err { color: #E0707A; font-size: 12px; min-height: 14px; margin-top: 4px; }
.gpn-media-divider { text-align: center; font-size: 11px; color: var(--gpnt-text-muted); text-transform: uppercase; letter-spacing: .05em; margin: 8px 0; }
.gpn-media-upload { width: 100%; background: var(--gpnt-surface); color: var(--gpnt-text, #EAF0F7); border: 1px solid var(--gpnt-border); border-radius: 6px; padding: 8px 10px; font-size: 13px; cursor: pointer; text-align: center; }
.gpn-media-upload:hover:not(:disabled) { border-color: var(--gpnt-accent); }
.gpn-media-upload:disabled { opacity: .55; cursor: not-allowed; }
.gpn-media-note { font-size: 11px; color: var(--gpnt-text-muted); margin-top: 6px; text-align: center; }
#bbpress-forums .mce-gpn-video-btn button, #bbpress-forums .mce-gpn-video-btn .mce-txt,
#bbpress-forums .mce-gpn-photo-btn button, #bbpress-forums .mce-gpn-photo-btn .mce-txt { font-size: 17px !important; line-height: 1 !important; }

/* Keep linked / uploaded images inside the forum layout */
#bbpress-forums .bbp-topic-content img, #bbpress-forums .bbp-reply-content img { max-width: 100%; height: auto; }

/* --- Footer legal links --- */
.site-footer { text-align: center; padding: 18px 16px; }
.gpn-legal-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 10px; margin-bottom: 8px; }
.gpn-legal-links a { color: var(--gpnt-text-secondary); text-decoration: none; font-size: 13px; }
.gpn-legal-links a:hover { color: var(--gpnt-accent-2); text-decoration: underline; }
.gpn-legal-links .sep { color: var(--gpnt-text-muted); font-size: 12px; }
.site-footer .site-info { color: var(--gpnt-text-muted); font-size: 12px; }
@media (max-width: 767px) { .site-footer { padding-bottom: calc(var(--gpnt-tabbar-h, 64px) + 20px); } }


/* --- Header brand name layout (logo + site name, nav starts to the right) --- */
.site-branding { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.site-branding .custom-logo, .site-branding img { height: 36px; width: auto; display: block; }
.gpn-site-name { color: var(--gpnt-text) !important; font-weight: var(--gpnt-weight-bold); font-size: var(--gpnt-text-lg); letter-spacing: 0.3px; white-space: nowrap; text-decoration: none; line-height: 1; }
.gpn-site-name:hover { color: var(--gpnt-accent-2) !important; }
.site-header .main-navigation { margin-left: var(--gpnt-space-6, 28px); }
.main-navigation ul li a { color: var(--gpnt-text-secondary); text-decoration: none; font-weight: var(--gpnt-weight-medium, 500); }
.main-navigation ul li a:hover { color: var(--gpnt-text); }

/* --- Newest topics widget --- */
.gpn-newest-topics__list { list-style: none; margin: 0; padding: 0; }
.gpn-newest-topics__list li { padding: 8px 0; border-bottom: 0.5px solid var(--gpnt-border); }
.gpn-newest-topics__list li:last-child { border-bottom: none; }
.gpn-newest-topics__list a { display: block; color: var(--gpnt-text); text-decoration: none; font-size: 14px; line-height: 1.35; }
.gpn-newest-topics__list a:hover { color: var(--gpnt-accent-2); }
.gpn-newest-topics__date { display: block; color: var(--gpnt-text-muted); font-size: 11px; margin-top: 2px; }

/* --- Sidebar people/group lists (avatar + name rows) --- */
.gpn-people__list, .gpn-yourgroups__list { list-style:none; margin:0; padding:0; }
.gpn-people__list li, .gpn-yourgroups__list li { padding:6px 0; border-bottom:0.5px solid var(--gpnt-border); }
.gpn-people__list li:last-child, .gpn-yourgroups__list li:last-child { border-bottom:none; }
.gpn-people__list a, .gpn-yourgroups__list a { display:flex; align-items:center; gap:10px; color:var(--gpnt-text); text-decoration:none; font-size:14px; }
.gpn-people__list a:hover span, .gpn-yourgroups__list a:hover span { color:var(--gpnt-accent-2); }
.gpn-people__list img, .gpn-yourgroups__list img { width:36px; height:36px; border-radius:50%; flex:0 0 36px; object-fit:cover; }
.gpn-people__list span, .gpn-yourgroups__list span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* --- Site name desktop-only (hide on mobile, matches nav breakpoint 768px) --- */
.gpn-site-name { display: none; }
@media (min-width: 768px) { .gpn-site-name { display: inline-block; } }


/* === GPN Messages header icon (Better Messages entry point) === */
.site-header__actions .gpn-msg{position:relative;display:inline-flex;align-items:center;justify-content:center;width:40px;height:38px;color:var(--gpnt-text-secondary);text-decoration:none;border-radius:8px;transition:color .15s ease,background .15s ease}
.site-header__actions .gpn-msg:hover{color:var(--gpnt-text);background:var(--gpnt-accent-soft)}
.site-header__actions .gpn-msg svg{width:22px;height:22px}
.site-header__actions .gpn-msg__badge{position:absolute;top:3px;right:2px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:var(--gpnt-danger);color:#fff;font-size:10px;line-height:16px;font-weight:700;text-align:center;box-shadow:0 0 0 2px var(--gpnt-bg)}