/* =========================================

   GunSmasher Whippy Edition - Cleaned & Organized

   Based on Whippy Edition Custom Theme (Dark)

   ========================================= */



/* =========================================

   1. CSS Variables

   ========================================= */

:root {

  /* Assets */

  --gs-bg: url("https://gunsmasher.kr/system/media_attachments/files/115/822/875/821/351/591/original/5654bd98ba291d44.png");

  --gs-logo: url("https://gunsmasher.kr/system/media_attachments/files/115/822/875/534/497/226/original/55eff4360877e508.png");

  --gs-announce-img: url("https://gunsmasher.kr/system/media_attachments/files/115/824/652/162/574/642/original/be1076445a071459.png");



  /* Primary Colors */

  --gs-accent: rgb(10, 243, 8);

  --gs-deep-green: rgb(0, 140, 0);

  --gs-dark-green: rgb(0, 110, 32);

  --gs-forest-green: rgb(30, 52, 24);

  --gs-soft-green: rgb(157, 184, 160);

  --gs-btn-green: rgb(70, 193, 70);

  --gs-btn-green-soft: rgba(70, 193, 70, 0.25);

  --gs-boost-active: rgb(63, 177, 177);



  /* Border & Line Colors */

  --gs-line: rgba(10, 243, 8, 0.55);

  --gs-line-soft: rgba(10, 243, 8, 0.22);

  --gs-border-soft: rgba(10, 243, 8, 0.35);

  --gs-border-strong: rgba(10, 243, 8, 0.70);



  /* Glass & Background */

  --gs-glass: transparent;

  --gs-glass-soft: transparent;

  --gs-glass-input: rgba(255, 255, 255, 0.08);

  --gs-glass-card: rgba(0, 0, 0, 0.80);

  --gs-input-bg: rgba(9, 13, 10, 0.50);

  --gs-input-bg-focus: rgba(9, 13, 10, 0.65);

  --gs-card-glass: rgba(255, 255, 255, 0.45);

  --gs-card-border: rgba(255, 255, 255, 0.3);

  --gs-dark-bg: rgb(23, 23, 23);

  --gs-modal-bg: rgba(0, 0, 0, 0.65);

  --gs-blur: 40px;



  /* Layout */

  --gs-radius: 20px;

  --gs-radius-sm: 14px;

  --gs-radius-xs: 12px;



  /* Z-index */

  --z-base: 1;

  --z-dropdown: 50;

  --z-panel: 100;

  --z-logo: 5000;



  /* Text Colors */

  --txt-main: rgba(245, 255, 245, 0.92);

  --txt-sub: rgba(245, 255, 245, 0.72);

  --txt-dark: #111;

  --gs-icon-gray: #3a3a3a;

  --gs-text-gray: #333;



  /* Handle colors */

  --gs-handle-idle: rgba(0, 0, 0, 0.52);

  --gs-handle-hover: rgb(10, 243, 8);



  /* Auth page */

  --gs-auth-text: rgb(155, 174, 184);

  --gs-auth-title: #fff;



  /* Icon SVGs */

  --icon-reply: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23333333' aria-hidden='true'%3E%3Cpath d='M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z'/%3E%3C/svg%3E") !important;

  --icon-bookmark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333333' stroke-width='2.1' d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'/%3E%3C/svg%3E") !important;

  --icon-bookmark-active: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230af308' d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'/%3E%3C/svg%3E") !important;

  --icon-bookmark-hover: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230af308' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'/%3E%3C/g%3E%3C/svg%3E") !important;

  --icon-bookmark-status-hover: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230af308' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'/%3E%3C/g%3E%3C/svg%3E") !important;

  --icon-bookmark-status-hover-red: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230af308' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'/%3E%3C/g%3E%3C/svg%3E") !important;

  --icon-bookmark-detailed-status-action-bar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333333' stroke-width='2.1' d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'/%3E%3C/svg%3E") !important;

  --icon-bookmark-detailed-status-action-bar-active: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230af308' d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'/%3E%3C/svg%3E") !important;

  --icon-bookmark-detailed-status-action-bar-hover: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='%230af308' aria-hidden='true'%3E%3Cg%3E%3Cpath d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z'/%3E%3C/g%3E%3C/svg%3E") !important;

  --icon-boost-active: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233fb1b1' d='m4.75 3.79 4.603 4.3-1.706 1.82L6 8.38v7.37c0 .97.784 1.75 1.75 1.75H13V20H7.75c-2.347 0-4.25-1.9-4.25-4.25V8.38L1.853 9.91.147 8.09l4.603-4.3zm11.5 2.71H11V4h5.25c2.347 0 4.25 1.9 4.25 4.25v7.37l1.647-1.53 1.706 1.82-4.603 4.3-4.603-4.3 1.706-1.82L18 15.62V8.25c0-.97-.784-1.75-1.75-1.75z'/%3E%3C/svg%3E") !important;

}



/* =========================================

   2. Background

   ========================================= */

html, body, #app, .app-holder, .ui {

  background-image: var(--gs-bg) !important;

  background-size: cover !important;

  background-position: center !important;

  background-repeat: no-repeat !important;

  background-attachment: fixed !important;

}



/* =========================================

   3. Logo

   ========================================= */

.layout-single-column .column-link--logo,

.ui__header__logo {

  width: 280px !important;

  height: 130px !important;

  background-size: contain !important;

  background-position: left center !important;

  background-repeat: no-repeat !important;

}



.ui__header__logo .logo,

.ui__header__logo .logo--icon,

.ui__header__logo .logo--wordmark {

  max-height: 50px !important;

  width: auto !important;

  height: auto !important;

}



.admin-wrapper .sidebar .logo,

.admin-wrapper .sidebar .logo--wordmark {

  max-height: 500px !important;

  max-width: 200px !important;

  width: auto !important;

  height: auto !important;

  margin: 20px 0 10px 5px !important;

  padding: 10px 0 !important;

}



.logo-container .logo--wordmark {

  height: auto !important;

  width: 350px !important;

}



.navigation-panel .column-link.column-link--logo {

  justify-content: flex-start !important;

  padding-left: 0 !important;

}



.navigation-panel .column-link.column-link--logo .logo--wordmark {

  width: 280px !important;

  height: 130px !important;

  max-width: none !important;

  max-height: none !important;

  margin-left: -15px !important;

}



/* =========================================

   4. Search Box

   ========================================= */

.compose-panel .search,

.compose-panel .search-form {

  background: var(--gs-glass-soft) !important;

  border: 1px solid var(--gs-line) !important;

  border-radius: var(--gs-radius-sm) !important;

  padding: 8px 10px !important;

  margin: 0 0 10px !important;

  box-shadow: none !important;

}



.compose-panel .search__input,

.compose-panel .search input,

.compose-panel .search-form input {

  background: transparent !important;

  border: 0 !important;

  box-shadow: none !important;

  outline: none !important;

  color: var(--txt-main) !important;

  padding-left: 10px !important;

}



.compose-panel .search__input::placeholder,

.compose-panel .search input::placeholder,

.compose-panel .search-form input::placeholder {

  color: var(--gs-accent) !important;

  opacity: 0.75 !important;

}



.compose-panel .search:focus-within,

.compose-panel .search-form:focus-within {

  border-color: rgba(10, 243, 8, 0.85) !important;

  box-shadow: 0 0 0 2px rgba(10, 243, 8, 0.12) !important;

}



.compose-panel .search__popout,

.compose-panel .search__results,

.compose-panel .search-results,

.compose-panel .search__dropdown {

  position: absolute !important;

  top: calc(100% + 12px) !important;

  left: 0 !important;

  right: 0 !important;

  min-width: 260px !important;

  max-height: 42vh !important;

  z-index: var(--z-dropdown) !important;

  background: rgba(0, 0, 0, 0.60) !important;

  border: 1px solid var(--gs-line-soft) !important;

  border-radius: var(--gs-radius-sm) !important;

  overflow: auto !important;

  backdrop-filter: blur(18px) saturate(160%) !important;

  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;

}



.compose-panel .search__popout *,

.compose-panel .search__results *,

.compose-panel .search-results *,

.compose-panel .search__dropdown * {

  color: var(--gs-accent) !important;

}



.compose-panel .search__icon,

.compose-panel .search__icon svg,

.compose-panel .search-form__icon,

.compose-panel .search-form__icon svg {

  display: none !important;

}



/* =========================================

   5. Compose Form

   ========================================= */

.compose-panel .compose-form {

  background: transparent !important;

  border: 0 !important;

  border-radius: var(--gs-radius-sm) !important;

  overflow: visible !important;

  padding: 10px !important;

  box-shadow: none !important;

  margin-bottom: 0 !important;

}



.compose-panel .compose-form .autosuggest-textarea,

.compose-panel .compose-form .autosuggest-textarea__textarea,

.compose-panel .compose-form .compose-form__textarea,

.compose-panel .compose-form .compose-form__highlightable,

.compose-panel .compose-form .compose-form__autosuggest-wrapper,

.compose-panel .compose-form .compose-form__upload-wrapper,

.compose-panel .compose-form .compose-form__uploads-wrapper,

.compose-panel .compose-form .compose-form__modifiers {

  background: transparent !important;

  border: 0 !important;

  outline: 0 !important;

  box-shadow: none !important;

}



.compose-panel .compose-form textarea {

  background: var(--gs-input-bg) !important;

  border: 1px solid var(--gs-border-soft) !important;

  border-radius: var(--gs-radius-sm) !important;

  color: var(--txt-main) !important;

  caret-color: var(--gs-accent) !important;

  box-shadow: none !important;

  outline: none !important;

  max-height: clamp(140px, 24vh, 300px) !important;

  overflow-y: auto !important;

  resize: none !important;

}



.compose-panel .compose-form textarea::placeholder {

  color: var(--gs-accent) !important;

  opacity: 0.85 !important;

}



.compose-panel .compose-form textarea:focus {

  border-color: rgba(10, 243, 8, 0.75) !important;

  background: var(--gs-input-bg-focus) !important;

}



.compose-panel .compose-form .compose-form__buttons-wrapper,

.compose-panel .compose-form .compose-form__buttons {

  background: transparent !important;

  border: 0 !important;

  box-shadow: none !important;

  margin-top: 8px !important;

  padding-top: 8px !important;

}



.compose-form .icon-button,

.compose-form .text-icon-button,

.compose-form .compose-form__buttons-wrapper .icon-button,

.compose-form .compose-form__buttons-wrapper .text-icon-button {

  color: var(--gs-accent) !important;

}



.compose-form .icon-button svg,

.compose-form .text-icon-button svg {

  fill: var(--gs-accent) !important;

  stroke: var(--gs-accent) !important;

}



.compose-panel .compose-form__publish,

.compose-panel .compose-form__submit,

.compose-panel .compose-form__publish-button-wrapper {

  position: relative !important;

  background: transparent !important;

  border: 0 !important;

  box-shadow: none !important;

  margin: 0 !important;

  padding: 10px !important;

}



.compose-panel .compose-form__publish-button-wrapper .button,

.compose-panel .compose-form__publish-button-wrapper button {

  background: rgba(10, 243, 8, 0.22) !important;

  border: 1px solid var(--gs-border-strong) !important;

  color: #fff !important;

  font-weight: bold !important;

  border-radius: var(--gs-radius-xs) !important;

  box-shadow: none !important;

}



.compose-panel .compose-form__publish-button-wrapper .button:hover,

.compose-panel .compose-form__publish-button-wrapper button:hover {

  background: rgba(10, 243, 8, 0.30) !important;

}



.compose-panel .privacy-dropdown__value-icon,

.compose-panel .privacy-dropdown__value-icon i,

.compose-panel .privacy-dropdown__value-icon i.fa-cloud,

.compose-panel .privacy-dropdown__value-icon i.fa-cloud::before,

.compose-panel i.fa-cloud,

.compose-form .privacy-dropdown i.fa-cloud,

.compose-form i.fa-cloud {

  color: var(--gs-accent) !important;

}



/* =========================================

   6. Navigation Panel

   ========================================= */

.navigation-panel hr {

  border: 0 !important;

  border-top: 1px solid var(--gs-line-soft) !important;

  margin: 10px 0 !important;

}



.navigation-panel .column-link.active {

  background: rgba(10, 243, 8, 0.14) !important;

  border: 1px solid var(--gs-line) !important;

  border-radius: 15px;

}



/* =========================================

   7. Profile

   ========================================= */

.account__header :is(.account__header__badge, .account__header__identity-badge, .account__header__role, .account-role, .role, .badge, .pill, .tag) {

  color: var(--gs-deep-green) !important;

  border-color: rgba(0, 140, 0, 0.85) !important;

  background: rgba(0, 140, 0, 0.10) !important;

  text-shadow: none !important;

}



.account__header :is(.account__header__badge, .account__header__identity-badge, .account__header__role, .account-role, .role, .badge, .pill, .tag) svg {

  fill: var(--gs-deep-green) !important;

  stroke: var(--gs-deep-green) !important;

}



.account__section-headline a.active::after,

.account__section-headline a[aria-selected="true"]::after {

  background: var(--gs-accent) !important;

}



/* =========================================

   8. Timeline Cards (Glass Effect)

   ========================================= */

.status__wrapper,

.status__wrapper-unlisted,

.status__wrapper--filtered,

div[class*="status__wrapper"] {

  background: transparent !important;

  border: none !important;

  box-shadow: none !important;

}



.status,

.status.status-unlisted,

.status.status-public,

.status.status-private {

  background: var(--gs-card-glass) !important;

  backdrop-filter: blur(16px) !important;

  -webkit-backdrop-filter: blur(16px) !important;

  border: 1px solid var(--gs-card-border) !important;

  border-radius: 16px !important;

  margin: 8px 12px !important;

}



.status__info,

.detailed-status__meta,

.notification__message {

  background: transparent !important;

}



/* =========================================

   9. Timeline Text

   ========================================= */

.status__content,

.status__content p {

  color: var(--txt-dark) !important;

}



.status .display-name strong {

  color: var(--txt-dark) !important;

}



.status__relative-time {

  color: var(--gs-text-gray) !important;

}



.status__content a,

.status__content a.mention,

.status__content .mention,

.status__content .h-card a,

.status .display-name__account {

  color: var(--gs-accent) !important;

}



.status__content a.hashtag,

.status__content .hashtag {

  color: var(--gs-accent) !important;

}



a.status__display-name .display-name__account,

.status__display-name .display-name__account,

.detailed-status__display-name .display-name__account,

.notification__display-name .display-name__account {

  color: var(--gs-handle-idle) !important;

  font-weight: 500 !important;

  opacity: 0.92 !important;

}



a.status__display-name:hover .display-name__account,

a.status__display-name:focus-visible .display-name__account,

.notification:hover .display-name__account {

  color: var(--gs-handle-hover) !important;

}



a.status__display-name,

a.status__display-name:link,

a.status__display-name:visited,

a.status__display-name:hover,

a.status__display-name:active,

a.status__display-name *,

.status__display-name a,

.detailed-status__display-name a,

.notification__display-name a,

.display-name a,

.account__display-name a {

  text-decoration: none !important;

  border-bottom: 0 !important;

  box-shadow: none !important;

  background-image: none !important;

}



/* =========================================

   10. Action Bar Icons

   ========================================= */

.layout-single-column .status__action-bar button,

.layout-single-column .status__action-bar button i,

.layout-single-column .status__action-bar button i::before,

.layout-single-column .status__action-bar .icon-button,

.layout-single-column .status__action-bar .icon-button i,

.layout-single-column .status__action-bar .icon-button i::before,

.layout-single-column .status__action-bar button span,

.layout-single-column .status .icon-button,

.layout-single-column .status .icon-button i {

  color: var(--gs-icon-gray) !important;

}



.layout-single-column .status__visibility-icon,

.layout-single-column .status__visibility-icon i,

.layout-single-column i.fa-cloud,

.layout-single-column i.fa-cloud::before {

  color: var(--gs-icon-gray) !important;

}



.layout-single-column .status__action-bar__button,

.layout-single-column .status__action-bar__button i,

.layout-single-column .status__action-bar__button i::before,

.status__action-bar__button,

.status__action-bar__button i,

.status__action-bar__button i.fa,

.status__action-bar__button i.fa::before {

  color: var(--gs-icon-gray) !important;

}



/* Boost icon gray SVG */

.layout-single-column .status button.icon-button i.fa-retweet,

.layout-single-column button.icon-button i.fa-retweet {

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23555555' d='m4.75 3.79 4.603 4.3-1.706 1.82L6 8.38v7.37c0 .97.784 1.75 1.75 1.75H13V20H7.75c-2.347 0-4.25-1.9-4.25-4.25V8.38L1.853 9.91.147 8.09l4.603-4.3zm11.5 2.71H11V4h5.25c2.347 0 4.25 1.9 4.25 4.25v7.37l1.647-1.53 1.706 1.82-4.603 4.3-4.603-4.3 1.706-1.82L18 15.62V8.25c0-.97-.784-1.75-1.75-1.75z'/%3E%3C/svg%3E") !important;

}



/* Boost active icon */

.layout-single-column button.icon-button.active i.fa-retweet,

.layout-single-column button.icon-button:hover i.fa-retweet,

.layout-single-column .status button.icon-button.active i.fa-retweet,

button.icon-button.active i.fa-retweet,

button.icon-button:hover i.fa-retweet {

  background-image: var(--icon-boost-active) !important;

}



/* Favorite gold */

.layout-single-column .status__action-bar .icon-button.star-icon.active,

.layout-single-column .status__action-bar .icon-button.star-icon.active i,

.layout-single-column .status__action-bar .icon-button.star-icon.active i::before,

.layout-single-column .status .icon-button.star-icon.active,

.layout-single-column .status .icon-button.star-icon.active i {

  color: rgb(255, 241, 50) !important;

}



/* =========================================

   11. Detailed Status

   ========================================= */

.detailed-status,

.detailed-status__wrapper {

  background: var(--gs-card-glass) !important;

  backdrop-filter: blur(16px) !important;

  -webkit-backdrop-filter: blur(16px) !important;

  border: 1px solid var(--gs-card-border) !important;

  border-radius: 16px !important;

  margin: 8px 12px !important;

  padding: 12px 16px !important;

}



.status--in-thread,

.status--in-thread.status {

  border-radius: 16px !important;

  margin: 8px 12px !important;

}



.focusable:focus {

  outline: none !important;

  box-shadow: none !important;

}



.scrollable > div[tabindex="-1"],

.scrollable .focusable {

  margin: 0 !important;

}



.status,

.detailed-status,

.status--in-thread,

.focusable {

  border-bottom: none !important;

  border-top: none !important;

}



.detailed-status__wrapper.detailed-status__wrapper {

  margin: 0 !important;

  padding: 0 !important;

}



.detailed-status__wrapper .detailed-status {

  margin: 0 !important;

}



.status__wrapper-reply,

.status__wrapper-reply.focusable,

.status__wrapper.status__wrapper-reply,

.status__wrapper.status__wrapper-unlisted.status__wrapper-reply {

  background: transparent !important;

  border: none !important;

  margin: 0 !important;

}



div.status__wrapper,

div.status__wrapper.focusable,

div.status__wrapper.status__wrapper-unlisted,

div.status__wrapper.status__wrapper-unlisted.focusable,

div[class*="status__wrapper"] {

  background: transparent !important;

  background-color: transparent !important;

  border: none !important;

  box-shadow: none !important;

}



.detailed-status__button button,

.detailed-status__button button i,

.detailed-status__button button i::before,

.detailed-status__button .icon-button,

.detailed-status__button .icon-button i,

.detailed-status__action-bar button,

.detailed-status__action-bar .icon-button,

.detailed-status__action-bar .icon-button i {

  color: var(--gs-icon-gray) !important;

}



.detailed-status__meta,

.detailed-status__meta a,

.detailed-status__datetime,

.detailed-status__application,

.detailed-status__link {

  color: var(--gs-icon-gray) !important;

}



.detailed-status__button button.star-icon.active,

.detailed-status__button button.star-icon.active i,

.detailed-status__action-bar .star-icon.active,

.detailed-status__action-bar .star-icon.active i {

  color: #ca8f04 !important;

}



.detailed-status__button button.bookmark-icon.active,

.detailed-status__button button.bookmark-icon.active i,

.detailed-status__action-bar .bookmark-icon.active,

.detailed-status__action-bar .bookmark-icon.active i {

  color: var(--gs-accent) !important;

}



.layout-single-column .detailed-status__action-bar .icon-button.active .fa-bookmark:before {

  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='%230af308' d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'/%3E%3C/svg%3E") !important;

}



.layout-single-column .detailed-status__action-bar .fa-bookmark:before {

  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='none' stroke='%23555555' stroke-width='2' d='M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5z'/%3E%3C/svg%3E") !important;

}



.layout-single-column .detailed-status__action-bar .icon-button.star-icon.active .fa-star:before,

.layout-single-column .detailed-status__action-bar button.star-icon.active .fa-star:before {

  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='%23ca8f04' d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") !important;

}



.layout-single-column .detailed-status__action-bar .fa-star:before {

  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='none' stroke='%23555555' stroke-width='2' d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") !important;

}



.layout-single-column .detailed-status__link > .fa-retweet + span::after,

.layout-single-column .detailed-status__link > .fa-star + span::after,

.layout-single-column span.detailed-status__reblogs::after,

.layout-single-column span.detailed-status__favorites::after,

.detailed-status__reblogs,

.detailed-status__favorites,

span.detailed-status__reblogs,

span.detailed-status__favorites {

  color: var(--gs-icon-gray) !important;

}



.detailed-status .display-name strong,

.detailed-status__display-name strong,

.detailed-status__display-name .display-name__html,

.detailed-status .display-name__html,

strong.display-name__html {

  color: var(--txt-dark) !important;

}



/* =========================================

   12. Notifications

   ========================================= */

.icon-with-badge__badge,

.column-link__badge,

.unread-badge {

  background: var(--gs-dark-green) !important;

  color: #fff !important;

}



.notification.notification-follow .notification__icon i,

.notification.notification-follow .notification__icon svg,

.notification-follow .icon,

.notification .fa-user-plus,

.notification .fa-user-plus::before {

  color: var(--gs-accent) !important;

  fill: var(--gs-accent) !important;

}



.column-header__wrapper .column-header__links a.active::after,

.notification__filter-bar button.active::after,

.column-header__collapsible .column-header__button.active::after {

  background: var(--gs-accent) !important;

}



.notification .status,

.notification__report {

  background: var(--gs-card-glass) !important;

  backdrop-filter: blur(16px) !important;

  -webkit-backdrop-filter: blur(16px) !important;

  border: 1px solid var(--gs-card-border) !important;

  border-radius: 16px !important;

  margin: 8px 12px !important;

}



.notification__message {

  background: transparent !important;

  border: none !important;

  border-radius: 0 !important;

  margin: 0 !important;

}



.notification .status__wrapper,

.notification .status__wrapper-reply {

  background: transparent !important;

  border: none !important;

  margin: 0 !important;

}



/* =========================================

   13. Direct Messages

   ========================================= */

.conversation,

.conversation.focusable {

  background: var(--gs-card-glass) !important;

  backdrop-filter: blur(16px) !important;

  -webkit-backdrop-filter: blur(16px) !important;

  border: 1px solid var(--gs-card-border) !important;

  border-radius: 16px !important;

  margin: 8px 12px !important;

}



.conversation__content {

  color: var(--txt-dark) !important;

}



.conversation__content__names,

.conversation__content__names a {

  color: var(--txt-dark) !important;

}



.conversation__content__relative-time {

  color: var(--gs-icon-gray) !important;

}



.column-link.column-link--transparent.active,

a.column-link.column-link--transparent.active,

.column-link.column-link--transparent.active[href="/conversations"] {

  background: transparent !important;

  background-color: transparent !important;

  border: none !important;

  border-color: transparent !important;

  box-shadow: none !important;

  outline: none !important;

}



.layout-single-column .detailed-status-direct::after,

.layout-single-column .status__wrapper-direct::after {

  border-top-color: var(--gs-accent) !important;

}



/* =========================================

   14. Settings Page

   ========================================= */

.simple_form .button,

.simple_form button,

.admin-wrapper .button,

.settings .button,

.button.button-secondary,

a.block-button,

.block-button,

.simple_form a.block-button {

  background: var(--gs-dark-green) !important;

  border-color: var(--gs-dark-green) !important;

  color: #fff !important;

}



.admin-wrapper .sidebar ul .simple-navigation-active-leaf a,

.admin-wrapper .sidebar ul .simple-navigation-active-leaf a:hover {

  background-color: var(--gs-dark-green) !important;

  color: #fff !important;

}



.filters .filter-subset a.selected,

.filter-subset a.selected {

  color: var(--gs-dark-green) !important;

  border-bottom-color: var(--gs-dark-green) !important;

}



.admin-wrapper .content__heading_tabs a.selected,

.content__heading_tabs a.selected,

.content__heading__tabs a.selected {

  background: var(--gs-dark-green) !important;

  color: #fff !important;

}



.simple_form input[type="text"],

.simple_form input[type="email"],

.simple_form input[type="password"],

.simple_form input[type="url"],

.simple_form input[type="number"],

.simple_form textarea,

.simple_form select,

.simple_form .label_input input,

.simple_form .label_input textarea {

  color: #fff !important;

}



.admin-wrapper input[type="email"],

.admin-wrapper input[type="password"],

.admin-wrapper input[type="text"],

.admin-wrapper input.string,

.admin-wrapper input.password {

  color: #fff !important;

}



.simple_form input::placeholder,

.label_input__wrapper input::placeholder {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   15. Auth Pages (Login/Signup)

   ========================================= */

.container-alt,

.container-alt .form-container,

.container-alt form,

.container-alt .fields-group,

.container-alt .input,

.container-alt .label_input,

.container-alt .actions,

.container-alt .form-footer {

  color: var(--gs-auth-text) !important;

}



.container-alt h1.title {

  color: var(--gs-auth-title) !important;

}



.container-alt p.lead {

  color: var(--gs-auth-text) !important;

}



.container-alt label {

  color: var(--gs-auth-text) !important;

}



.container-alt input,

.container-alt textarea,

.container-alt select {

  color: rgba(245, 255, 245, 0.92) !important;

}



.container-alt input::placeholder,

.container-alt textarea::placeholder {

  color: rgba(155, 174, 184, 0.75) !important;

}



.container-alt .form-footer a,

.container-alt .form-container a {

  color: var(--gs-auth-text) !important;

  text-decoration: none !important;

}



.container-alt .form-footer a:hover,

.container-alt .form-container a:hover {

  color: var(--gs-accent) !important;

}



.simple_form input[type="email"],

.simple_form input[type="password"],

.simple_form input[type="text"],

.simple_form textarea,

input#user_email,

input#user_password {

  color: var(--txt-dark) !important;

}



/* =========================================

   16. Invite Pages

   ========================================= */

.container-alt form[action*="/auth/invitation"] a,

.container-alt form[action*="/auth/invitation"] .hint,

.container-alt form[action*="/auth/invitation"] .help,

.container-alt form[action*="/auth/invitation"] .input .hint,

.container-alt form[action*="/auth/invitation"] .input .help,

.container-alt form[action*="/auth/invitation"] .error,

.container-alt form[action*="/auth/invitation"] .simple_form .error,

.container-alt form[action*="/auth/invitation"] .simple_form .hint,

.container-alt form[action*="/auth/invitation"] .form-footer a {

  color: var(--gs-btn-green) !important;

  text-decoration: none !important;

}



.container-alt form[action*="/auth/invitation"] .rules,

.container-alt form[action*="/auth/invitation"] .rules *,

.container-alt form[action*="/auth/invitation"] .invitation-rules,

.container-alt form[action*="/auth/invitation"] .invitation-rules *,

.container-alt form[action*="/auth/invitation"] .rules-text,

.container-alt form[action*="/auth/invitation"] .rules-text * {

  color: #fff !important;

}



.container-alt form[action*="/auth/invitation"] .form-container > p,

.container-alt form[action*="/auth/invitation"] .form-container > div > p {

  color: #fff !important;

}



.container-alt form[action*="/auth/invitation"] .actions .button,

.container-alt form[action*="/auth/invitation"] .actions button,

.container-alt form[action*="/auth/invitation"] .actions input[type="submit"],

.container-alt form[action*="/auth/invitation"] .actions a.button {

  color: var(--txt-dark) !important;

}



.container-alt .rules-list__text {

  color: #fff !important;

}



.container-alt .rules-list > li::before,

.rules-list > li::before,

.rules-list li::before {

  background: var(--gs-deep-green) !important;

  border-color: var(--gs-deep-green) !important;

}



.container-alt .progress-tracker .circle {

  border-color: rgba(70, 193, 70, 0.55) !important;

}



.container-alt .progress-tracker .separator {

  background: rgba(70, 193, 70, 0.55) !important;

}



.container-alt .progress-tracker .active .circle {

  background: var(--gs-btn-green) !important;

  border-color: var(--gs-btn-green) !important;

}



.container-alt .progress-tracker .active .label {

  color: var(--gs-btn-green) !important;

}



.container-alt .progress-tracker li .circle,

.container-alt .progress-tracker li.active .circle,

.container-alt .progress-tracker li.completed .circle {

  background: var(--gs-accent) !important;

  border-color: var(--gs-accent) !important;

  color: #fff !important;

}



.container-alt .progress-tracker li:not(.active):not(.completed) .circle {

  background: transparent !important;

  border: 2px solid var(--gs-accent) !important;

}



.container-alt .progress-tracker .separator,

.container-alt .progress-tracker .separator.completed {

  background: var(--gs-accent) !important;

}



.container-alt .progress-tracker li .circle::before,

.container-alt .progress-tracker li.active .circle::before,

.container-alt .progress-tracker li.completed .circle::before {

  background: var(--gs-deep-green) !important;

  background-color: var(--gs-deep-green) !important;

}



.container-alt .stacked-actions a.button {

  background: var(--gs-dark-green) !important;

  border-color: var(--gs-dark-green) !important;

  color: #fff !important;

}



.container-alt .stacked-actions a.button:hover {

  background: var(--gs-deep-green) !important;

}



.container-alt .stacked-actions a.button.button-tertiary {

  background: transparent !important;

  border: 2px solid var(--gs-dark-green) !important;

  color: #fff !important;

}



.container-alt .stacked-actions a.button.button-tertiary:hover {

  background: rgb(31, 27, 35) !important;

}



.container-alt .progress-tracker li:not(.active) .label {

  color: var(--gs-soft-green) !important;

}



.container-alt p.lead,

.container-alt p.lead.invited-by {

  color: var(--gs-soft-green) !important;

}



.container-alt li a,

.container-alt ul li a,

.container-alt a[href="/auth/sign_in"],

.container-alt a[href="/auth/confirmation/new"],

.container-alt a[href="/auth/edit"],

.container-alt a[href="/auth/sign_out"],

.container-alt a[href="/auth/sign_up"],

.container-alt a[href="/auth/password/new"] {

  color: var(--gs-soft-green) !important;

}



.container-alt label.boolean,

.container-alt label.boolean a,

.container-alt label[for="user_agreement"],

.container-alt label[for="user_agreement"] a {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   17. Toggle Switches

   ========================================= */

.react-toggle--checked .react-toggle-track,

.react-toggle--checked:hover .react-toggle-track {

  background: var(--gs-accent) !important;

  background-color: var(--gs-accent) !important;

}



.react-toggle-track-check svg {

  fill: #fff !important;

}



.react-toggle--checked .react-toggle-thumb {

  border-color: var(--gs-accent) !important;

  background: #fafafa !important;

}



/* =========================================

   18. Column Headers & Collapsibles

   ========================================= */

.column-header__collapsible,

.column-header__collapsible-inner {

  background: var(--gs-dark-bg) !important;

  background-color: var(--gs-dark-bg) !important;

}



.column-header__back-button,

.column-header__back-button span,

.column-header__back-button i {

  color: var(--gs-deep-green) !important;

}



.column-back-button,

.column-back-button span,

.column-back-button i,

.column-back-button__icon {

  color: var(--gs-deep-green) !important;

}



.column-settings__section,

.column-settings__section span,

.setting-toggle__label,

.setting-toggle__label span {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   19. Announcements

   ========================================= */

.announcements,

.announcements__container,

.announcements__item {

  background: rgb(40, 90, 36) !important;

  background-color: rgb(40, 90, 36) !important;

}



/* =========================================

   20. Banners

   ========================================= */

.dismissable-banner,

.dismissable-banner__message {

  background: var(--gs-forest-green) !important;

  background-color: var(--gs-forest-green) !important;

}



.dismissable-banner__action button,

.dismissable-banner__action .icon-button,

.dismissable-banner__action .icon-button i,

.dismissable-banner__action .fa-times,

.dismissable-banner__action .fa-times::before {

  color: var(--gs-accent) !important;

}



.sign-in-banner .button.button--block {

  background: transparent !important;

  background-color: transparent !important;

  border: 1px solid var(--gs-dark-green) !important;

  color: #fff !important;

}



.sign-in-banner .button.button--block.button-tertiary {

  background: transparent !important;

  background-color: transparent !important;

  border: 1px solid var(--gs-dark-green) !important;

  color: #fff !important;

}



.sign-in-banner .button.button--block:hover,

.sign-in-banner a.button.button--block:hover,

.sign-in-banner a.button.button--block.button-tertiary:hover,

.sign-in-banner .button.button--block.button-tertiary:hover {

  background: rgb(31, 27, 35) !important;

  background-color: rgb(31, 27, 35) !important;

}



.sign-in-banner p,

.sign-in-banner p span {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   21. About Page

   ========================================= */

.about__section__title,

.about__section.active .about__section__title,

.about__section .about__section__title {

  background: transparent !important;

  background-color: transparent !important;

  border: 2px solid var(--gs-accent) !important;

  color: var(--gs-accent) !important;

}



.about__section__body,

.about__section__body p,

.about__section__body span,

.about__section__body li,

.rules-list__text,

.about__section.active .about__section__body,

.about__section.active .about__section__body p,

.about__section.active .about__section__body span {

  color: #fff !important;

}



.about__header h1,

.about__header p,

.about__header p span,

.about__header p a,

.about__header .about__mail a {

  color: #fff !important;

}



.about__footer,

.about__footer p,

.about__footer p span {

  color: var(--gs-soft-green) !important;

}



.rules-list li::before,

.rules-list li::marker,

.rules-list > li::before {

  background: var(--gs-deep-green) !important;

  color: #fff !important;

}



/* =========================================

   22. Server Banner

   ========================================= */

.server-banner__meta h4,

.server-banner__meta h4 span,

.server-banner__meta .display-name__account,

.server-banner__meta .account__display-name,

.server-banner__meta__column h4,

.server-banner__meta__column h4 span {

  color: var(--gs-accent) !important;

}



.server-banner__meta .display-name__html,

.server-banner__meta strong.display-name__html {

  color: #fff !important;

}



.server-banner__number,

.server-banner__number span,

strong.server-banner__number {

  color: #fff !important;

}



.server-banner__introduction,

.server-banner__introduction span,

.server-banner__introduction strong {

  color: var(--gs-soft-green) !important;

}



.server-banner__number-label,

.server-banner__number-label span {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   23. Footer

   ========================================= */

.link-footer,

.link-footer a,

.link-footer a span,

.link-footer p,

.link-footer p a,

.link-footer strong,

.link-footer span,

.link-footer span.version {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   24. Onboarding

   ========================================= */

.column-title p,

.column-title p span {

  color: var(--gs-soft-green) !important;

}



p.onboarding__lead,

p.onboarding__lead span {

  color: var(--gs-soft-green) !important;

}



.column-title h3,

.column-title h3 span {

  color: #fff !important;

}



.onboarding__steps__item__icon,

.onboarding__steps__item__icon i,

.onboarding__steps__item__description h6,

.onboarding__steps__item__description h6 span {

  color: var(--gs-deep-green) !important;

}



.onboarding__steps__item__description p,

.onboarding__steps__item__description p span {

  color: var(--gs-soft-green) !important;

}



.onboarding__steps__item__go,

.onboarding__steps__item__go svg {

  color: var(--gs-deep-green) !important;

  fill: var(--gs-deep-green) !important;

}



.onboarding__links,

.onboarding__links a,

.onboarding__link,

.onboarding__link span,

.onboarding__link svg {

  color: var(--gs-deep-green) !important;

  fill: var(--gs-deep-green) !important;

}



/* =========================================

   25. Misc Text Colors

   ========================================= */

/* Soft green text */

.fa-bars,

.fa-bars.fa-fw,

.character-counter__wrapper,

.character-counter__wrapper .character-counter,

span.character-counter,

.icon-with-badge .fa-bullhorn,

.icon-with-badge .fa-sliders,

.status__prepend,

.status__prepend span,

.status__prepend .status__prepend-icon,

.status__prepend .fa-reply,

.status__prepend .fa-envelope,

.status__prepend a,

.follow_requests-unlocked_explanation,

.follow_requests-unlocked_explanation span,

p.hint,

.fields-group .label_input label,

.fields-group label.boolean,

.label_input label,

.simple_form h4,

h4,

.simple_form .hint,

.simple_form span.hint,

.field_with_hint .hint,

.relationships-settings ul li a,

.relationships-settings ul li a.selected,

ul li a[href*="/relationships"],

.display-name__account,

.table-action-link,

.table-action-link i,

small,

.admin-wrapper .sidebar ul li a,

.admin-wrapper .sidebar ul li a i,

.muted-hint,

.muted-hint.center-text,

p.muted-hint,

.flash-message,

label.password,

label.password.required,

a#profile,

a#privacy,

a#verification,

a#featured_tags,

a#profile i,

a#privacy i,

a#verification i,

a#featured_tags i,

.status__prepend a.status__display-name.muted,

.status__prepend a.status__display-name.muted bdi,

.status__prepend a.status__display-name.muted strong,

dl dt,

dl dt.translate,

dl dd,

dl dd.translate,

dl dd span,

.account__section-headline a,

.account__section-headline a span,

.account__header__extra__links a,

.account__header__extra__links a span,

.account__header__fields dl,

.account__header__fields dl dt,

.account__header__fields dl dd,

.account__header__fields dl dd span,

.account__header__fields dl dt::before,

.account__header__fields dl dd::before {

  color: var(--gs-soft-green) !important;

}



/* Deep green links */

.follow_requests-unlocked_explanation a,

.follow_requests-unlocked_explanation a span,

.muted-hint a,

p.muted-hint a {

  color: var(--gs-deep-green) !important;

}



/* White text */

strong.display-name__html,

.display-name__html.emojify,

.muted-hint strong,

p.muted-hint strong,

.account__section-headline a.active,

.account__section-headline a.active span,

.account__section-headline a[aria-current="page"],

.account__section-headline a[aria-current="page"] span,

.account__header__extra__links a strong,

.account__header__extra__links a strong span,

a#profile.selected,

a#privacy.selected,

a#verification.selected,

a#featured_tags.selected,

a#profile.selected i,

a#privacy.selected i,

a#verification.selected i,

a#featured_tags.selected i,

.admin-wrapper .sidebar ul li.selected a,

.admin-wrapper .sidebar ul li.selected a i,

.admin-wrapper .sidebar ul .simple-navigation-active-leaf a,

.admin-wrapper .sidebar ul .simple-navigation-active-leaf a i {

  color: #fff !important;

}



/* Warning items keep original */

.admin-wrapper .sidebar ul li.warning a,

.admin-wrapper .sidebar ul li.warning a i {

  color: #ff5050 !important;

}



/* Settings submenu hover */

a#profile:hover,

a#privacy:hover,

a#verification:hover,

a#featured_tags:hover {

  background: var(--gs-dark-green) !important;

  background-color: var(--gs-dark-green) !important;

  color: #fff !important;

}



a#profile:hover i,

a#privacy:hover i,

a#verification:hover i,

a#featured_tags:hover i {

  color: #fff !important;

}



/* Profile fields icon filter */

.layout-single-column .account__header__bio .account__header__fields dl::before,

.layout-single-column .account__header__bio .account__header__fields dl:not(:has(a))::before {

  filter: brightness(0) saturate(100%) invert(75%) sepia(10%) saturate(500%) hue-rotate(80deg) !important;

}



/* Flash message translation prompt */

.flash-message.translation-prompt {

  color: #fff !important;

}



.flash-message.translation-prompt a {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   26. Close & Active Buttons

   ========================================= */

.icon-button.active,

.icon-button.active i,

.icon-button.active i.fa-close,

.icon-button.active i.fa-times,

.icon-button.active .fa-close::before,

.icon-button.active .fa-times::before,

.compose__action-bar .icon-button.active,

.navigation-bar__actions .icon-button.active {

  color: var(--gs-accent) !important;

}



/* =========================================

   27. Reply Indicator

   ========================================= */

.reply-indicator,

.layout-single-column .reply-indicator {

  background: var(--gs-input-bg) !important;

  background-color: var(--gs-input-bg) !important;

  border: none !important;

  border-radius: var(--gs-radius-sm) !important;

}



.reply-indicator__content a.mention,

.reply-indicator__content a.u-url.mention {

  color: var(--gs-accent) !important;

}



/* =========================================

   28. Read More Button

   ========================================= */

.status__content__read-more-button,

.status__content__read-more-button span,

.status__content__read-more-button i {

  color: var(--gs-soft-green) !important;

}



/* =========================================

   29. Confirmation Modal

   ========================================= */

.modal-root__modal.confirmation-modal {

  background: var(--gs-modal-bg) !important;

  backdrop-filter: blur(20px) !important;

  -webkit-backdrop-filter: blur(20px) !important;

  border: 1px solid var(--gs-accent) !important;

  border-radius: 20px !important;

  overflow: hidden !important;

}



.confirmation-modal__container {

  background: transparent !important;

  color: #fff !important;

  padding: 20px !important;

  font-size: 15px !important;

  line-height: 1.5 !important;

}



.confirmation-modal__action-bar {

  background: transparent !important;

  border-top: none !important;

  padding: 0 20px 20px !important;

  display: flex !important;

  gap: 12px !important;

}



.confirmation-modal__cancel-button {

  background: transparent !important;

  border: none !important;

  color: rgba(255, 255, 255, 0.8) !important;

}



.confirmation-modal__cancel-button:hover {

  background: rgba(255, 255, 255, 0.1) !important;

  color: #fff !important;

}



.confirmation-modal__action-bar .button:not(.confirmation-modal__cancel-button) {

  background: transparent !important;

  border: 1px solid var(--gs-accent) !important;

  color: var(--gs-accent) !important;

}



.confirmation-modal__action-bar .button:not(.confirmation-modal__cancel-button):hover {

  background: rgba(10, 243, 8, 0.15) !important;

}



/* =========================================

   30. Language Dropdown

   ========================================= */

.language-dropdown__dropdown {

  background: transparent !important;

  background-color: transparent !important;

}



.language-dropdown__dropdown__results {

  background: transparent !important;

  background-color: transparent !important;

}



.language-dropdown__dropdown__results__item {

  background: transparent !important;

  color: var(--gs-soft-green) !important;

}



.language-dropdown__dropdown__results__item__native-name,

.language-dropdown__dropdown__results__item__common-name {

  color: var(--gs-soft-green) !important;

}



.language-dropdown__dropdown__results__item.active {

  background: transparent !important;

}



.language-dropdown__dropdown__results__item.active .language-dropdown__dropdown__results__item__native-name,

.language-dropdown__dropdown__results__item.active .language-dropdown__dropdown__results__item__common-name {

  color: #fff !important;

}



.language-dropdown__dropdown__results__item:hover {

  background: rgba(0, 140, 0, 0.3) !important;

}



.language-dropdown__dropdown__results__item:hover .language-dropdown__dropdown__results__item__native-name,

.language-dropdown__dropdown__results__item:hover .language-dropdown__dropdown__results__item__common-name {

  color: #fff !important;

}



.emoji-mart-search {

  background: transparent !important;

}



.emoji-mart-search input[type="search"] {

  background: rgba(30, 30, 30, 0.6) !important;

  backdrop-filter: blur(10px) !important;

  -webkit-backdrop-filter: blur(10px) !important;

  border: none !important;

  border-color: transparent !important;

  color: var(--gs-soft-green) !important;

}



.emoji-mart-search input[type="search"]::placeholder {

  color: var(--gs-soft-green) !important;

}



.emoji-mart-search input[type="search"]:focus {

  border: none !important;

  outline: none !important;

  box-shadow: none !important;

}



.emoji-mart-search .emoji-mart-search-icon,

.emoji-mart-search .emoji-mart-search-icon svg,

.emoji-mart-search .emoji-mart-search-icon svg path {

  color: var(--gs-deep-green) !important;

  fill: var(--gs-deep-green) !important;

}



/* =========================================

   31. Dropdown Menu

   ========================================= */

.dropdown-animation.dropdown-menu {

  background: var(--gs-modal-bg) !important;

  backdrop-filter: blur(20px) !important;

  -webkit-backdrop-filter: blur(20px) !important;

  border: 1px solid var(--gs-accent) !important;

  border-radius: 16px !important;

}



.dropdown-menu__container {

  background: transparent !important;

  border: none !important;

}



.dropdown-menu__container__list {

  background: transparent !important;

}



.dropdown-menu__item {

  background: transparent !important;

}



.dropdown-menu__item a,

.dropdown-menu__item button {

  background: transparent !important;

  color: #fff !important;

}



.dropdown-menu__item a:hover,

.dropdown-menu__item button:hover {

  background: rgba(10, 243, 8, 0.2) !important;

}



.dropdown-menu__separator {

  background: rgba(255, 255, 255, 0.15) !important;

  border: none !important;

}



.dropdown-menu__arrow {

  display: none !important;

}



/* =========================================

   32. Privacy Policy Links

   ========================================= */

p a[href*="github"],

p a[href*="discourse"],

.simple_form p a,

.prose p a,

.legal p a,

.privacy-policy p a,

.terms p a {

  color: var(--gs-deep-green) !important;

}

/* 툿 오른쪽 여백 */

.status__content {

  padding-right: 20px !important;

}



/* Empty column indicator 소프트그린 */

.empty-column-indicator,

.empty-column-indicator span {

  color: var(--gs-soft-green) !important;

}



/* 개인정보처리방침 페이지 */

.privacy-policy .column-title h3,

.privacy-policy .column-title h3 span {

  color: #fff !important;

}



.privacy-policy .column-title p,

.privacy-policy .column-title p span {

  color: var(--gs-soft-green) !important;

}



.privacy-policy__body h1,

.privacy-policy__body h2,

.privacy-policy__body h3,

.privacy-policy__body h4,

.privacy-policy__body h5,

.privacy-policy__body h6,

.privacy-policy__body strong {

  color: #fff !important;

}



.privacy-policy__body,

.privacy-policy__body p,

.privacy-policy__body li,

.privacy-policy__body span {

  color: var(--gs-soft-green) !important;

}



.privacy-policy__body a {

  color: var(--gs-deep-green) !important;

}



/* Input focus 딥그린 + 텍스트 흰색 */

.label_input input:focus,

.simple_form input:focus,

.simple_form textarea:focus,

.simple_form select:focus,

input.password:focus,

input[type="password"]:focus,

input[type="text"]:focus,

input[type="email"]:focus {

  border-color: var(--gs-deep-green) !important;

  outline: none !important;

  box-shadow: 0 0 0 2px rgba(0, 140, 0, 0.3) !important;

}



.label_input input,

.simple_form input,

.simple_form textarea,

input.password,

input[type="password"],

input[type="text"],

input[type="email"] {

  color: #fff !important;

}
