/**
 * Troloo Creators — brand override stylesheet
 * Jaune #F9B800 · Vert #10b981 · Dark #0a0a14
 * Charge après les CSS Dizzy pour remplacer les accents roses.
 * Cache-bust via css.php r=troloo_brand_*
 */

:root {
  --trl-yellow: #F9B800;
  --trl-yellow-dark: #D99F00;
  --trl-green: #10b981;
  --trl-green-dark: #059669;
  --trl-dark: #0a0a14;
  --dizzy-theme-brand-primary: #F9B800 !important;
  --dizzy-theme-brand-secondary: #10b981 !important;
  --dizzy-theme-header-top: linear-gradient(90deg, #F9B800, #10b981) !important;
  --dizzy-player-accent: #10b981 !important;
  /* Anciens accents roses Dizzy → Troloo */
  --dizzy-pink: #F9B800;
  --dizzy-orange: #10b981;
}

/* Header / gradients */
.i_header_container,
.header_top,
.i_header_menu_top,
.landing_header_bg,
.landing_section_one::before,
.landing_section_register .i_singup_claim,
.claimname,
.landing-sticky-footer,
.landing-sticky-footer-in-color-click,
.btn_primary,
.primary_btn,
.transition.primary_btn,
.publish_btn,
.i_become_creator_btn,
.i_modal_content_btn,
.login_form_submit,
.i_login_button,
.i_register_button,
.landing_directory_cta,
.landing_directory_cta_community,
.landing_directory_link,
.i_post_item_user_subscription_btn a,
.i_sub_btn,
.tip_btn,
.boost_btn {
  /* accents remplacés via règles ciblées ci-dessous */
}

/* Remplacements couleur rose Dizzy → jaune Troloo */
.pink,
.i_header_logo_mobile,
.i_alert_point,
.i_topinora_number,
.i_post_menu_item:hover,
.i_left_menu_item:hover .i_left_menu_item_icon,
.i_left_menu_item.active .i_left_menu_item_icon,
.i_left_menu_item.active,
.point_text,
.subscription_price,
.landing_seciond_in_note strong,
.landing_feature_box_icon,
.i_plus_btn,
.plus_btn {
  color: var(--trl-yellow);
}

/* Boutons / CTA */
.i_singup_claim,
.claimname,
.i_login_button,
.i_register_button,
.login_form_submit,
.publish_btn,
.i_become_creator_btn,
.primary_btn,
.btn_primary,
.landing_directory_cta,
.landing_directory_cta_community,
.landing-sticky-footer,
.i_modal_content_btn,
.tip_btn,
.i_sub_btn,
.boost_btn,
.i_post_item_user_subscription_btn a,
.free_live_btn,
.paid_live_btn {
  background: linear-gradient(90deg, var(--trl-yellow), var(--trl-green)) !important;
  background-color: var(--trl-yellow) !important;
  border-color: var(--trl-yellow) !important;
  color: #0a0a14 !important;
}

.i_singup_claim:hover,
.claimname:hover,
.i_login_button:hover,
.i_register_button:hover,
.publish_btn:hover,
.primary_btn:hover,
.landing_directory_cta:hover,
.landing-sticky-footer:hover {
  background: linear-gradient(90deg, var(--trl-yellow-dark), var(--trl-green-dark)) !important;
  filter: brightness(0.97);
}

/* Header bar */
.i_header_container,
.header_menu_container {
  border-bottom-color: rgba(249, 184, 0, 0.25);
}

/* Landing hero accents */
.landing_section_one h1,
.landing_section_five h2,
.landing_section_feature_title {
  color: var(--trl-dark);
}

.landing_feature_box:hover .landing_feature_box_icon,
.landing_directory_kicker {
  color: var(--trl-yellow) !important;
}

.landing_directory_price,
.landing_directory_avatar {
  border-color: var(--trl-yellow);
}

.landing_directory_link {
  color: var(--trl-green-dark) !important;
  background: transparent !important;
}

/* Links & checks */
a.landing_directory_cta,
.toggle.active,
.accordion li a.toggle:hover {
  color: inherit;
}

.tickColor,
.success,
.checked,
.i_checkbox_wrapper input:checked + .i_checkbox_checkmark {
  color: var(--trl-green) !important;
}

/* Logo sizing (Troloo logo is wide 288x90) */
.i_header_logo img,
.logo_container img,
.i_logo img {
  max-height: 40px;
  width: auto;
  object-fit: contain;
}

/* Age confirm / modals accents */
.i_modal_box_header,
.license_status_pill.active,
.license_primary_btn,
.status_badge.on {
  background: linear-gradient(90deg, var(--trl-yellow), var(--trl-green)) !important;
  color: #0a0a14 !important;
}

/* Progress / ranges on landing calculator */
input[type="range"]::-webkit-slider-thumb {
  background: var(--trl-yellow) !important;
}
input[type="range"]::-moz-range-thumb {
  background: var(--trl-yellow) !important;
}

/* Footer sticky signup */
.landing-sticky-footer {
  background: linear-gradient(90deg, #F9B800, #10b981) !important;
  color: #0a0a14 !important;
}
.landing-sticky-footer-in-color-click {
  color: #0a0a14 !important;
  font-weight: 700;
}

/* Scrollbar accent (overrides admin custom CSS pink) */
body::-webkit-scrollbar-thumb {
  background-color: #F9B800 !important;
}

/* ===== App connectée : palette Troloo clair / sombre (#0a0a14) ===== */
html.dark body,
body.night_mode,
body.night-mode,
body.dark_mode,
body.dark-mode {
  --dizzy-theme-page-background: #0a0a14;
  --dizzy-theme-panel-background: #12121f;
  --dizzy-theme-panel-border: rgba(255, 255, 255, 0.08);
  --dizzy-theme-text-primary: #ffffff;
  --dizzy-theme-text-muted: #b3b9cc;
  --dizzy-theme-hover-surface: rgba(249, 184, 0, 0.18);
}

html:not(.dark) body.day_mode,
html:not(.dark) body.day-mode,
html:not(.dark) body.light_mode,
html:not(.dark) body.light-mode {
  --dizzy-theme-page-background: #F0F2F5;
  --dizzy-theme-panel-background: #ffffff;
  --dizzy-theme-panel-border: rgba(82, 92, 122, 0.10);
  --dizzy-theme-text-primary: #0a0a14;
  --dizzy-theme-text-muted: #525c7a;
  --dizzy-theme-hover-surface: rgba(249, 184, 0, 0.12);
}

/* Accents actifs menu / onglets en mode app */
.i_left_menu_item.active,
.i_left_menu_item:hover,
.mobile_menu_item.active,
.tabing_item.active {
  color: var(--trl-yellow) !important;
}

.i_header_container {
  background: var(--dizzy-theme-header-top, linear-gradient(90deg, #F9B800, #10b981));
}

/* Boutons publish / tip / sub — contraste texte sombre sur jaune */
.publish_btn,
.i_login_button button,
.tip_btn,
.i_sub_btn {
  color: #0a0a14 !important;
}

/* Toggle thème : hint jaune Troloo */
.updateTheme:hover,
.updateTheme.active {
  color: var(--trl-yellow) !important;
}

/* ===== Bouton Aller sur Troloo ===== */
.trl-go-troloo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none !important;
  font-weight: 700;
  border-radius: 12px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.trl-go-troloo__mark {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  background: linear-gradient(135deg, #F9B800, #10b981);
  color: #0a0a14;
  font-weight: 900;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.trl-go-troloo__mark--sm {
  width: 20px;
  height: 20px;
  border-radius: 7px;
  font-size: 11px;
}
.trl-go-troloo--header {
  margin-left: 10px;
  padding: 6px 12px 6px 6px;
  background: linear-gradient(135deg, rgba(249,184,0,0.18), rgba(16,185,129,0.14));
  border: 1px solid rgba(249,184,0,0.35);
  color: #0a0a14;
  font-size: 12px;
  white-space: nowrap;
}
body.night_mode .trl-go-troloo--header,
body.night-mode .trl-go-troloo--header,
body.dark_mode .trl-go-troloo--header,
html.dark .trl-go-troloo--header {
  color: #fff;
  border-color: rgba(249,184,0,0.45);
}
.trl-go-troloo--header:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(249,184,0,0.25);
  filter: brightness(1.03);
}
@media (max-width: 720px) {
  .trl-go-troloo--header .trl-go-troloo__text { display: none; }
  .trl-go-troloo--header { padding: 6px; }
}

.trl-theme-btn {
  cursor: pointer;
}
.trl-theme-btn__icon {
  color: var(--trl-yellow) !important;
}

/* ===== Switch langues FR / EN ===== */
.trl-lang-header-wrap {
  display: flex !important;
  align-items: center;
  padding: 0 4px !important;
}
.trl-lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border-radius: 10px;
  border: 1px solid rgba(249, 184, 0, 0.35);
  background: rgba(249, 184, 0, 0.08);
}
.trl-lang-switch__btn {
  min-width: 34px;
  height: 28px;
  padding: 0 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
  line-height: 1;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
.trl-lang-switch__btn:hover {
  color: var(--trl-yellow, #F9B800);
}
.trl-lang-switch__btn.is-active {
  background: linear-gradient(135deg, #F9B800, #10b981);
  color: #0a0a14;
}
.trl-lang-switch--footer {
  margin-right: 0;
}
.trl-lang-switch--footer .trl-lang-switch__btn {
  height: 30px;
  min-width: 36px;
}
.trl-lang-switch--landing {
  border-color: rgba(249, 184, 0, 0.4);
  background: rgba(249, 184, 0, 0.12);
}
body.night_mode .trl-lang-switch,
body.night-mode .trl-lang-switch,
body.dark_mode .trl-lang-switch,
html.dark .trl-lang-switch {
  border-color: rgba(249, 184, 0, 0.45);
  background: rgba(255, 255, 255, 0.06);
}

/* ===== Footer tools ===== */
.trl-footer-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
  width: 100%;
}
.trl-footer-tool {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid rgba(249,184,0,0.3);
  background: rgba(249,184,0,0.08);
  color: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none !important;
}
.trl-footer-tool:hover {
  border-color: rgba(249,184,0,0.55);
  background: rgba(249,184,0,0.16);
  color: var(--trl-yellow);
}
.trl-go-troloo--footer {
  background: linear-gradient(135deg, rgba(249,184,0,0.2), rgba(16,185,129,0.16));
}

/* ===== Left sidebar Troloo item ===== */
.trl-left-troloo {
  background: linear-gradient(135deg, rgba(249,184,0,0.14), rgba(16,185,129,0.1)) !important;
  border: 1px solid rgba(249,184,0,0.28) !important;
  margin-bottom: 6px !important;
}
.trl-left-troloo__mark {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: linear-gradient(135deg, #F9B800, #10b981);
  color: #0a0a14;
  font-weight: 900;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.trl-left-troloo .m_tit {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  gap: 2px;
}
.trl-left-troloo__hint {
  font-size: 11px;
  font-weight: 500;
  opacity: 0.7;
}
.trl-left-troloo:hover {
  border-color: rgba(249,184,0,0.55) !important;
  box-shadow: 0 8px 20px rgba(249,184,0,0.12);
}

.left-menu-pro-v1 .i_left_menu_box.is-active {
  background: rgba(249,184,0,0.12) !important;
  color: var(--trl-yellow) !important;
}
.left-menu-pro-v1 .i_left_menu_box:hover {
  background: rgba(249,184,0,0.08);
}

/* ===== Widget wallet Troloo ===== */
.trl-wallet-widget,
.trl-widget-card {
  position: relative;
  border-radius: 18px;
  padding: 16px;
  margin-bottom: 14px;
  background: linear-gradient(160deg, rgba(249,184,0,0.12), rgba(16,185,129,0.08));
  border: 1px solid rgba(249,184,0,0.28);
  overflow: hidden;
}
.trl-wallet-widget__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 10px;
  color: inherit;
}
.trl-wallet-widget__pay { color: #F9B800; }
.trl-wallet-widget__title {
  font-size: 16px;
  font-weight: 800;
  margin-bottom: 6px;
}
.trl-wallet-widget__desc {
  font-size: 12px;
  line-height: 1.45;
  opacity: 0.8;
  margin: 0 0 12px;
}
.trl-wallet-widget__balance {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,0.55);
  margin-bottom: 12px;
  font-size: 12px;
}
body.night_mode .trl-wallet-widget__balance,
body.night-mode .trl-wallet-widget__balance,
html.dark .trl-wallet-widget__balance {
  background: rgba(255,255,255,0.06);
}
.trl-wallet-widget__balance strong {
  font-size: 14px;
  color: #059669;
}
.trl-wallet-widget__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 11px 14px;
  border-radius: 12px;
  background: linear-gradient(135deg, #F9B800, #D99F00);
  color: #0a0a14 !important;
  font-weight: 800;
  font-size: 13px;
  text-decoration: none !important;
  box-shadow: 0 6px 18px rgba(249,184,0,0.28);
}
.trl-wallet-widget__cta:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
}
.trl-wallet-widget__note,
.trl-widget-pay-note {
  margin-top: 10px;
  font-size: 11px;
  opacity: 0.7;
  text-align: center;
}

/* Profile card accents Troloo */
.i_sidebar_profile_card {
  border: 1px solid rgba(249,184,0,0.18);
  border-radius: 18px;
  overflow: hidden;
}
.i_sidebar_profile_progress_fill {
  background: linear-gradient(90deg, #F9B800, #10b981) !important;
}
.i_sidebar_profile_btn,
.i_sidebar_profile_quick_btn {
  border-color: rgba(249,184,0,0.35) !important;
}
.i_sidebar_profile_btn {
  background: linear-gradient(135deg, #F9B800, #10b981) !important;
  color: #0a0a14 !important;
  border: none !important;
}
