/* AI Bloom Safe Global CSS-only + custom colors AI_BLOOM_COLORS_20260515_205705 */
/* Aucun JS. Ne cache rien. Ne déplace rien. */

:root{
  --abg-coral:#fb4f8a;
  --abg-pink:#f9a8d4;
  --abg-yellow:#facc15;
  --abg-cyan:#38bdf8;
  --abg-violet:#8b5cf6;
  --abg-green:#22c55e;
  --abg-ink:#101828;
  --abg-muted:#64748b;
  --abg-bg:#fff7ed;
  --abg-card:#ffffff;
  --abg-soft:#fff1f2;
  --abg-glass:color-mix(in srgb, var(--abg-card) 86%, rgba(255,255,255,.86));
  --abg-border:rgba(255,255,255,.92);
}

/* Page */
html,
body{
  background:
    linear-gradient(180deg,rgba(255,255,255,.84),rgba(255,255,255,.96)),
    url('/public/assets/img/ai_bloom_safe/header.svg?v=AI_BLOOM_COLORS_20260515_205705') center top / 1600px auto no-repeat,
    var(--abg-bg) !important;
  color:var(--abg-ink) !important;
}

/* Sidebar / menu gauche */
aside.sidebar,
.sidebar,
nav.sidebar,
[class*="sidebar"],
[class*="side-bar"],
[class*="sidenav"]{
  background:
    linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78)),
    url('/public/assets/img/ai_bloom_safe/sidebar.svg?v=AI_BLOOM_COLORS_20260515_205705') center top / cover no-repeat !important;
  border-right:1px solid var(--abg-border) !important;
  box-shadow:16px 0 44px rgba(15,23,42,.10) !important;
  color:var(--abg-ink) !important;
}

aside.sidebar *,
.sidebar *,
nav.sidebar *,
[class*="sidebar"] *,
[class*="side-bar"] *,
[class*="sidenav"] *{
  color:var(--abg-ink) !important;
}

aside.sidebar a,
.sidebar a,
nav.sidebar a,
[class*="sidebar"] a,
[class*="side-bar"] a,
[class*="sidenav"] a{
  border-radius:16px !important;
  text-decoration:none !important;
  transition:.15s ease !important;
}

aside.sidebar a:hover,
.sidebar a:hover,
nav.sidebar a:hover,
[class*="sidebar"] a:hover,
[class*="side-bar"] a:hover,
[class*="sidenav"] a:hover{
  background:color-mix(in srgb, var(--abg-soft) 64%, rgba(255,255,255,.76)) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.075) !important;
}

/* Top header existant, sans le remplacer */
header,
.topbar,
.page-header,
.admin-header,
.content-header{
  border-radius:24px !important;
  border:1px solid var(--abg-border) !important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.78),rgba(255,255,255,.38)),
    url('/public/assets/img/ai_bloom_safe/header.svg?v=AI_BLOOM_COLORS_20260515_205705') center / cover no-repeat !important;
  box-shadow:0 18px 50px rgba(15,23,42,.10) !important;
  color:var(--abg-ink) !important;
  backdrop-filter:blur(16px) saturate(145%) !important;
}

/* Cards / panels / boxes */
.sb-card,
.card,
.panel,
.box,
.content-card,
.form-card,
.settings-card,
.title-ai-workflow,
.sb-final-catqty-card,
.sb-available-sizes-card,
.sb-oracal-colors-card,
.sb-variations-card,
.sb-media-studio-card,
.sb-results-library-card,
section,
fieldset{
  background:var(--abg-glass) !important;
  border-color:var(--abg-border) !important;
  box-shadow:0 14px 38px rgba(15,23,42,.07) !important;
  backdrop-filter:blur(16px) saturate(145%) !important;
}

/* Tables */
table,
.settings-table,
.table{
  background:var(--abg-glass) !important;
  border-color:var(--abg-border) !important;
  box-shadow:0 14px 38px rgba(15,23,42,.07) !important;
  border-radius:18px !important;
  overflow:hidden !important;
}

th{
  background:rgba(255,255,255,.72) !important;
  color:var(--abg-ink) !important;
  font-weight:900 !important;
}

td{
  color:var(--abg-ink) !important;
}

/* Onglets */
.tabs a,
.tab,
.nav-tab,
button.tab,
[role="tab"]{
  border-radius:999px !important;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(255,255,255,.90) !important;
  color:var(--abg-ink) !important;
  font-weight:900 !important;
}

.tabs a.active,
.tab.active,
.nav-tab.active,
[role="tab"][aria-selected="true"]{
  background:linear-gradient(135deg,var(--abg-coral),var(--abg-cyan),var(--abg-violet)) !important;
  color:#fff !important;
}

/* Inputs */
input,
select,
textarea{
  border-color:#e2e8f0 !important;
  border-radius:12px !important;
}

input:focus,
select:focus,
textarea:focus{
  border-color:var(--abg-coral) !important;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--abg-coral) 18%, transparent) !important;
  outline:none !important;
}

/* Boutons */
button[type="submit"],
.btn-primary,
.button-primary,
.save,
.save-btn,
input[type="submit"],
.sb-final-create-btn,
.sb-media-btn-primary{
  background:linear-gradient(135deg,var(--abg-coral),var(--abg-cyan),var(--abg-violet)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 12px 28px color-mix(in srgb, var(--abg-coral) 24%, transparent) !important;
  border-radius:14px !important;
  font-weight:900 !important;
}

/* Chips */
.ai-word,
.ai-tag-word,
.sb-size-chip,
.sb-color-chip,
.sb-preset-chip,
.sb-color-preset,
.chip,
.badge,
.pill{
  background:color-mix(in srgb, var(--abg-soft) 66%, rgba(255,255,255,.82)) !important;
  border-color:rgba(255,255,255,.90) !important;
  box-shadow:0 6px 18px rgba(15,23,42,.045) !important;
}

/* Surtout ne rien cacher */
#title-settings,
.title-settings,
[name*="title"],
[id*="title"],
[class*="title"],
header,
.topbar,
.page-header,
.admin-header,
.content-header{
  visibility:visible !important;
}

/* =========================================================
   BOTVINYL GLOBAL HEADER — OAuth style standard
   ========================================================= */

header,
.topbar,
.page-header,
.admin-header,
.content-header,
.oauth-topbar,
.sb-page-header,
.main-header{
  min-height:74px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  margin:0 0 18px !important;
  padding:14px 18px !important;
  border-radius:26px !important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,.82),rgba(255,255,255,.54)),
    url('/public/assets/img/ai_bloom_safe/header.svg') center / cover no-repeat !important;
  border:1px solid rgba(255,255,255,.92) !important;
  box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
  color:var(--abg-ink,#102018) !important;
  backdrop-filter:blur(14px) saturate(145%) !important;
}

/* Bloc titre à gauche */
header h1,
.topbar h1,
.page-header h1,
.admin-header h1,
.content-header h1,
.oauth-topbar-title,
.sb-page-header h1,
.main-header h1{
  margin:0 !important;
  font-size:24px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
  color:var(--abg-ink,#102018) !important;
}

/* Sous-titre */
header p,
.topbar p,
.page-header p,
.admin-header p,
.content-header p,
.oauth-topbar-sub,
.sb-page-header p,
.main-header p{
  margin:4px 0 0 !important;
  color:#64748b !important;
  font-size:13px !important;
  font-weight:850 !important;
}

/* Icône header standard si présente */
.oauth-topbar-logo,
.oauth-topbar-badge,
.topbar-badge,
.header-icon,
.page-header-icon,
.sb-header-icon{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  border-radius:16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(135deg,var(--abg-coral,#22c55e),var(--abg-cyan,#16a34a)) !important;
  color:#fff !important;
  font-size:21px !important;
  font-weight:950 !important;
  box-shadow:0 10px 24px color-mix(in srgb,var(--abg-coral,#22c55e) 22%, transparent) !important;
}

/* User pill à droite */
.oauth-topbar-user,
.topbar-user,
.header-user,
.admin-user,
.user-pill,
.sb-user-pill{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:9px 13px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(255,255,255,.95) !important;
  box-shadow:0 8px 22px rgba(15,23,42,.055) !important;
  color:var(--abg-ink,#102018) !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

/* Avatar user */
.oauth-topbar-avatar,
.topbar-avatar,
.header-avatar,
.user-avatar,
.sb-user-avatar{
  width:30px !important;
  height:30px !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(135deg,var(--abg-coral,#22c55e),var(--abg-cyan,#16a34a)) !important;
  color:#fff !important;
  font-weight:950 !important;
  font-size:13px !important;
}

/* Corrige les headers trop hauts sur les pages existantes */
.page-title,
.board-title,
.content-title{
  margin-top:0 !important;
}

/* Mobile */
@media(max-width:900px){
  header,
  .topbar,
  .page-header,
  .admin-header,
  .content-header,
  .oauth-topbar,
  .sb-page-header,
  .main-header{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .oauth-topbar-user,
  .topbar-user,
  .header-user,
  .admin-user,
  .user-pill,
  .sb-user-pill{
    align-self:flex-start !important;
  }
}

