/* ClarioDB 0.9.56 — fondation commune des skins 01–16. Visuel uniquement. */
body[data-ui-skin]{--skin-sidebar-width:274px;--skin-gap:12px;--skin-panel-border:color-mix(in srgb,var(--border-strong) 86%,transparent);--skin-panel-shadow:0 12px 34px color-mix(in srgb,var(--ink) 10%,transparent);--skin-panel-shadow-hover:0 18px 42px color-mix(in srgb,var(--ink) 15%,transparent);--skin-glass:color-mix(in srgb,var(--surface) 88%,transparent);--skin-glass-strong:color-mix(in srgb,var(--surface) 95%,transparent);--skin-row-hover:color-mix(in srgb,var(--teal) 7%,var(--surface));--skin-inspiration-image:none;--skin-inspiration-opacity:.18;--skin-inspiration-position:center;--skin-inspiration-size:cover}
body[data-ui-skin].shell-app .app{grid-template-columns:var(--skin-sidebar-width) minmax(0,1fr);gap:var(--skin-gap);padding:var(--skin-gap);background:transparent}
body[data-ui-skin].shell-app .sidebar,body[data-ui-skin].shell-app .main{position:relative;min-width:0;border:1px solid var(--skin-panel-border);border-radius:var(--radius-lg);background:var(--skin-glass-strong);box-shadow:var(--skin-panel-shadow)}
body[data-ui-skin].shell-app .sidebar{padding:16px 13px;gap:17px;overflow:hidden;isolation:isolate}body[data-ui-skin].shell-app .main{overflow:hidden}
body[data-ui-skin] .sidebar .brand{position:relative;z-index:2;padding:4px 6px 14px;border-bottom:1px solid var(--border)}body[data-ui-skin] .sidebar .brand img{filter:drop-shadow(0 6px 12px color-mix(in srgb,var(--teal) 20%,transparent))}
body[data-ui-skin] .sidebar>:not(.brand),body[data-ui-skin] .sidebar .tables-block,body[data-ui-skin] .sidebar .nav-bottom{position:relative;z-index:2}
body[data-ui-skin] .conn-card,body[data-ui-skin] .draft-sidebar-status,body[data-ui-skin] .sidebar-draft-status{border:1px solid var(--border-strong);border-radius:calc(var(--radius) + 3px);background:color-mix(in srgb,var(--surface) 91%,transparent);box-shadow:0 5px 14px color-mix(in srgb,var(--ink) 6%,transparent);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
body[data-ui-skin] .filter-input{border-color:var(--border-strong);background:color-mix(in srgb,var(--surface) 91%,transparent);box-shadow:inset 0 1px 2px color-mix(in srgb,var(--ink) 4%,transparent)}
body[data-ui-skin] .table-item{border-radius:calc(var(--radius) + 1px)}body[data-ui-skin] .table-item:hover{background:color-mix(in srgb,var(--teal) 7%,transparent)}body[data-ui-skin] .table-item.active{border-color:color-mix(in srgb,var(--teal) 38%,var(--border));background:color-mix(in srgb,var(--teal) 9%,var(--surface));color:var(--teal-dark);box-shadow:0 6px 14px color-mix(in srgb,var(--ink) 8%,transparent),inset 3px 0 0 var(--teal)}
body[data-ui-skin] .topbar,body[data-ui-skin] .panel-topbar{border-bottom-color:var(--border);background:var(--bg-topbar);box-shadow:var(--shadow-topbar);backdrop-filter:blur(17px) saturate(1.08);-webkit-backdrop-filter:blur(17px) saturate(1.08)}
body[data-ui-skin] :where(.topbar-sql-action,.context-icon-action,.mode-toggle,.user-dropdown-trigger,.btn,.backup-link,.scope-link,.lang-switch){box-shadow:0 3px 10px color-mix(in srgb,var(--ink) 7%,transparent)}
body[data-ui-skin] :where(.overview-agent-strip,.overview-metric-strip,.overview-bulk-toolbar,.overview-table-wrap,.table-wrap,.panel-form,.empty-state,.versions-block,.sql-terminal-form,.sql-execution-report,.draft-card,.operations-card,.trust-card,.audit-card){border-color:var(--skin-panel-border);background:var(--skin-glass-strong);box-shadow:var(--shadow-card);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
body[data-ui-skin] :where(.overview-table tbody tr,.data-table tbody tr,.workbench-grid tbody tr):hover{background:var(--skin-row-hover)}body[data-ui-skin] :where(.overview-table thead th,.data-table thead th,.workbench-grid thead th){background:color-mix(in srgb,var(--surface) 86%,var(--bg-page))}
body[data-ui-skin] .app-footer{background:color-mix(in srgb,var(--bg-page) 92%,transparent)}
body[data-ui-skin].shell-panel{position:relative;isolation:isolate;background:radial-gradient(circle at 15% -5%,color-mix(in srgb,var(--teal) 10%,transparent),transparent 36%),var(--bg-page)}body[data-ui-skin].shell-panel .panel-main{position:relative;z-index:1}body[data-ui-skin].shell-panel .panel-narrow{position:relative}body[data-ui-skin] .conn-grid{gap:15px}
body[data-ui-skin] .conn-tile{border-color:var(--skin-panel-border);background:var(--skin-glass-strong);box-shadow:var(--shadow-card);backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}body[data-ui-skin] .conn-tile:hover{border-color:color-mix(in srgb,var(--teal) 64%,var(--border));box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}
body[data-ui-skin].shell-auth{position:relative;isolation:isolate;background:radial-gradient(circle at 12% 5%,color-mix(in srgb,var(--teal) 13%,transparent),transparent 34%),var(--bg-page)}body[data-ui-skin].shell-auth .auth-inner{position:relative;z-index:2}
body[data-ui-skin].shell-auth .brand-large,body[data-ui-skin].shell-auth .auth-card{border-color:var(--skin-panel-border);background:var(--skin-glass-strong);box-shadow:var(--skin-panel-shadow);backdrop-filter:blur(17px) saturate(1.06);-webkit-backdrop-filter:blur(17px) saturate(1.06)}body[data-ui-skin].shell-auth .brand-large{padding:12px 16px;border:1px solid var(--skin-panel-border);border-radius:var(--radius-lg);margin-bottom:13px}body[data-ui-skin].shell-auth .auth-card{border-width:1px}
body[data-ui-tier="premium"].shell-app .sidebar::before{content:"";position:absolute;z-index:0;inset:0;background-image:linear-gradient(180deg,color-mix(in srgb,var(--bg-sidebar) 70%,transparent),color-mix(in srgb,var(--bg-sidebar) 93%,transparent) 58%),var(--skin-inspiration-image);background-position:center,var(--skin-inspiration-position);background-size:cover,var(--skin-inspiration-size);opacity:var(--skin-inspiration-opacity);pointer-events:none}
body[data-ui-tier="premium"].shell-app .sidebar::after{content:attr(data-ui-skin-number);position:absolute;z-index:1;right:12px;bottom:72px;color:color-mix(in srgb,var(--teal) 10%,transparent);font-family:Georgia,'Times New Roman',serif;font-size:78px;line-height:1;pointer-events:none}
body[data-ui-tier="premium"].shell-app .sidebar{background:color-mix(in srgb,var(--bg-sidebar) 89%,transparent)}
body[data-ui-tier="premium"].shell-panel::before,body[data-ui-tier="premium"].shell-auth::before{content:"";position:fixed;z-index:-1;inset:0;background-image:linear-gradient(90deg,color-mix(in srgb,var(--bg-page) 97%,transparent) 0 34%,color-mix(in srgb,var(--bg-page) 68%,transparent) 64%,color-mix(in srgb,var(--bg-page) 45%,transparent)),var(--skin-inspiration-image);background-position:center,var(--skin-inspiration-position);background-size:cover,cover;opacity:.72;pointer-events:none}
body[data-ui-tier="premium"].shell-panel .panel-main{min-height:calc(100vh - 64px)}body[data-ui-tier="premium"].shell-panel .panel-narrow:has(.dashboard-header){padding:24px;border:1px solid color-mix(in srgb,var(--border-strong) 78%,transparent);border-radius:calc(var(--radius-lg) + 8px);background:color-mix(in srgb,var(--surface) 77%,transparent);box-shadow:0 24px 64px color-mix(in srgb,var(--ink) 13%,transparent);backdrop-filter:blur(20px) saturate(1.08);-webkit-backdrop-filter:blur(20px) saturate(1.08)}
body[data-ui-tier="premium"].shell-auth .auth-wrap{justify-content:flex-end;padding-right:clamp(28px,8vw,120px)}body[data-ui-tier="premium"].shell-auth .auth-inner{max-width:460px}body[data-ui-tier="premium"].shell-auth .auth-card{padding:39px 40px 35px}body[data-ui-tier="premium"].shell-auth .auth-lang-switch{z-index:3;background:color-mix(in srgb,var(--surface) 82%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse){color-scheme:dark}body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) :where(input,select,textarea){color:var(--text);background:color-mix(in srgb,var(--surface) 92%,#000)}body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) :where(.overview-table,.data-table,.workbench-grid){color:var(--text)}
body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) .sql-editor-wrap .sql-terminal-textarea,body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) .sql-editor-mirror,body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) .sql-stmt-sql-pre{color:var(--text);background:color-mix(in srgb,var(--surface) 86%,#000);border-color:var(--border-strong)}
body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) :is(.sql-editor-mirror,.sql-stmt-sql-pre) .tok-keyword{color:var(--teal-light);font-weight:700}body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) :is(.sql-editor-mirror,.sql-stmt-sql-pre) .tok-function{color:#e9a8df}body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) :is(.sql-editor-mirror,.sql-stmt-sql-pre) .tok-string{color:#87dda5}body:is(.ui-skin-graphite-neon,.ui-skin-midnight-copper,.ui-skin-cobalt-pulse) :is(.sql-editor-mirror,.sql-stmt-sql-pre) .tok-number{color:#efc27c}
body.embed-auth-shell[data-ui-skin]{position:relative;min-height:100vh;overflow:hidden;color:var(--text);background:var(--bg-page)}body.embed-auth-shell[data-ui-tier="premium"]::before{content:"";position:fixed;inset:0;z-index:-1;background-image:linear-gradient(120deg,color-mix(in srgb,var(--bg-page) 88%,transparent),color-mix(in srgb,var(--bg-page) 50%,transparent)),var(--skin-inspiration-image);background-position:center;background-size:cover;opacity:.8}body.embed-auth-shell[data-ui-skin] .embed-auth{border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--surface) 88%,transparent);box-shadow:var(--skin-panel-shadow);backdrop-filter:blur(18px) saturate(1.08);-webkit-backdrop-filter:blur(18px) saturate(1.08)}body.embed-auth-shell[data-ui-skin] .embed-submit{background:var(--teal)}
@media(max-width:980px){body[data-ui-skin].shell-app .app{grid-template-columns:232px minmax(0,1fr);gap:8px;padding:8px}body[data-ui-tier="premium"].shell-auth .auth-wrap{justify-content:center;padding-right:24px}}
@media(max-width:760px){body[data-ui-skin].shell-app .app{display:block;padding:0}body[data-ui-skin].shell-app .sidebar,body[data-ui-skin].shell-app .main{border-radius:0;border-left:0;border-right:0}body[data-ui-tier="premium"].shell-panel .panel-narrow:has(.dashboard-header){padding:16px}}

/* ClarioDB 0.9.56 — SQL Studio intégré aux skins Standard 01–08
   --------------------------------------------------------------------------
   Le passage du terminal au shell App en 0.9.55 révélait les anciens styles
   du shell Panel : en-tête empilé, cartes séparées et footer placé au milieu
   de la page. Cette couche ne change aucun skin ; elle leur donne uniquement
   une géométrie SQL cohérente avec la coque applicative. */
body[data-ui-tier="standard"].shell-app .sql-terminal-wrap[data-sql-integrated-workspace="1"] {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 14px 18px 24px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: transparent;
  scrollbar-width: thin;
}

body[data-ui-tier="standard"] .sql-terminal-backlinks {
  min-height: 28px;
  margin: 0;
}

body[data-ui-tier="standard"] .sql-terminal-header {
  position: relative;
  z-index: 25;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  min-height: 82px;
  margin: 0 0 14px;
  padding: 2px 0 12px;
  overflow: visible;
  border-bottom: 1px solid var(--border);
}

body[data-ui-tier="standard"] .sql-terminal-heading {
  min-width: 0;
}

body[data-ui-tier="standard"] .sql-terminal-eyebrow {
  display: block;
  margin: 0 0 4px;
  color: var(--teal);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

body[data-ui-tier="standard"] .sql-terminal-header .page-title {
  margin: 0;
  color: var(--ink);
  font-size: clamp(25px, 2vw, 31px);
  line-height: 1.06;
  letter-spacing: -.035em;
}

body[data-ui-tier="standard"] .sql-terminal-context {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

body[data-ui-tier="standard"] .sql-terminal-header-actions {
  flex: 0 0 auto;
  padding-bottom: 1px;
}

body[data-ui-tier="standard"] .sql-terminal-header-actions .connection-context-actions {
  display: flex;
  gap: 7px;
}

body[data-ui-tier="standard"] .sql-terminal-form {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border-strong);
  border-radius: calc(var(--radius-lg) + 2px);
  background: color-mix(in srgb, var(--surface) 96%, var(--bg-page));
  box-shadow: var(--shadow-card), inset 0 1px rgba(255,255,255,.54);
}

body[data-ui-tier="standard"] .sql-terminal-form > .sql-editor-wrap,
body[data-ui-tier="standard"] .sql-terminal-form > .sql-terminal-textarea {
  width: 100%;
  min-height: clamp(230px, 30vh, 410px);
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body[data-ui-tier="standard"] .sql-editor-wrap .sql-terminal-textarea,
body[data-ui-tier="standard"] .sql-editor-mirror {
  min-height: clamp(230px, 30vh, 410px);
  padding: 18px 18px;
  border: 0;
  border-radius: 0;
  font-size: 13px;
  line-height: 1.6;
}

body[data-ui-tier="standard"] .sql-editor-mirror {
  background: color-mix(in srgb, var(--surface) 95%, var(--bg-page));
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--teal) 62%, transparent);
}

body[data-ui-tier="standard"] .sql-editor-wrap .sql-terminal-textarea {
  border: 0;
  background: transparent;
}

body[data-ui-tier="standard"] .sql-editor-wrap.is-plain .sql-terminal-textarea,
body[data-ui-tier="standard"] .sql-terminal-form > .sql-terminal-textarea {
  padding: 18px 18px;
  color: var(--text);
  caret-color: var(--text);
  background: color-mix(in srgb, var(--surface) 95%, var(--bg-page));
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--teal) 62%, transparent);
}

body[data-ui-tier="standard"] .sql-editor-wrap:focus-within,
body[data-ui-tier="standard"] .sql-terminal-form > .sql-terminal-textarea:focus {
  outline: none;
  box-shadow: inset 0 0 0 2px var(--teal-ring);
}

body[data-ui-tier="standard"] .sql-studio {
  margin: 0;
  overflow: visible;
  border: 0;
  border-top: 1px solid var(--border);
  border-radius: 0;
  background: color-mix(in srgb, var(--bg-page) 58%, var(--surface));
  box-shadow: none;
}

body[data-ui-tier="standard"] .sql-studio-toolbar {
  min-height: 44px;
  padding: 6px 9px;
  gap: 5px;
}

body[data-ui-tier="standard"] .sql-studio-tool {
  min-height: 30px;
  padding: 5px 8px;
  font-size: 11px;
}

body[data-ui-tier="standard"] .sql-studio-privacy {
  padding: 0 11px 7px;
  font-size: 10px;
}

body[data-ui-tier="standard"] .sql-terminal-actions {
  min-height: 52px;
  margin: 0;
  padding: 8px 10px;
  gap: 7px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, var(--bg-page));
}

body[data-ui-tier="standard"] .sql-terminal-actions .btn {
  min-height: 33px;
  padding: 6px 11px;
  border-radius: calc(var(--radius) - 1px);
  font-size: 11px;
}

body[data-ui-tier="standard"] .main > .app-footer {
  margin-top: 0;
}

@media (max-width: 760px) {
  body[data-ui-tier="standard"].shell-app .sql-terminal-wrap[data-sql-integrated-workspace="1"] {
    flex: 0 0 auto;
    min-height: 68vh;
    padding: 14px 12px 36px;
    overflow: visible;
  }

  body[data-ui-tier="standard"] .sql-terminal-header {
    display: block;
    min-height: 0;
  }

  body[data-ui-tier="standard"] .sql-terminal-header-actions {
    margin-top: 10px;
  }
}


/* Le menu Connexion des skins Standard partage le même empilement que les
   Premium : son parent doit rester au-dessus du bloc Tables pour recevoir les
   clics, même lorsque la liste se déploie au-delà de la carte. */
body[data-ui-tier="standard"] .sidebar > div:has(> .conn-card.conn-switch-trigger),
body[data-ui-tier="standard"] .sidebar > .sidebar-connection-block {
  position: relative;
  z-index: 160;
  overflow: visible;
}

body[data-ui-tier="standard"] .sidebar > .tables-block {
  position: relative;
  z-index: 20;
}