/* Extra visual polish for Connections — loaded after connections-premium.css. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3{
  padding:20px!important;
  border-radius:30px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.90),rgba(255,255,255,.76))!important;
  box-shadow:0 34px 80px rgba(0,91,55,.18),0 8px 24px rgba(0,59,130,.06)!important;
}

.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div{
  min-height:78px;
  padding:16px 18px!important;
  border-width:1px!important;
  border-radius:20px!important;
}

/* Slight provider-tinted backgrounds. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(1){background:linear-gradient(96deg,#F3F4F6 0%,#FFFFFF 28%,#FFFFFF 100%)!important}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(2){background:linear-gradient(96deg,#E9FFF5 0%,#FFFFFF 28%,#FFFFFF 100%)!important}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(3){background:linear-gradient(96deg,#EAFBF6 0%,#FFFFFF 28%,#FFFFFF 100%)!important}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(4){background:linear-gradient(96deg,#FFF0E9 0%,#FFFFFF 28%,#FFFFFF 100%)!important}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(5){background:linear-gradient(96deg,#EEF1FF 0%,#FFFFFF 28%,#FFFFFF 100%)!important}

/* Larger, more recognizable logo tiles. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div > div > div:first-child > div:first-child{
  width:50px!important;
  height:50px!important;
  border-radius:16px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.82),0 10px 24px var(--accent-shadow)!important;
}

/* GitHub keeps its real icon but gets a dark premium tile. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(1) > div > div:first-child > div:first-child{
  background:#171B22!important;
  color:#fff!important;
  border-color:#171B22!important;
}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(1) > div > div:first-child > div:first-child svg{color:#fff!important}

/* Supabase: green lightning-inspired monogram. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(2) > div > div:first-child > div:first-child svg{display:none!important}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(2) > div > div:first-child > div:first-child::after{
  content:"S";
  display:grid;
  place-items:center;
  width:100%;height:100%;
  border-radius:15px;
  background:linear-gradient(135deg,#34D399,#059669);
  color:#fff;
  font-size:21px;
  font-weight:900;
  font-family:ui-sans-serif,system-ui,sans-serif;
}

/* OpenAI: compact AI badge. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(3) > div > div:first-child > div:first-child::after{
  content:"AI"!important;
  display:grid!important;
  place-items:center;
  width:100%;height:100%;
  border-radius:15px;
  background:linear-gradient(135deg,#14B8A6,#0F766E);
  color:#fff!important;
  font-size:15px!important;
  letter-spacing:-.04em;
  font-weight:900;
}

/* Claude: warm orange sun mark. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(4) > div > div:first-child > div:first-child::after{
  content:"✹"!important;
  display:grid!important;
  place-items:center;
  width:100%;height:100%;
  border-radius:15px;
  background:linear-gradient(135deg,#F59E0B,#D97757);
  color:#fff!important;
  font-size:25px!important;
  font-weight:900;
}

/* Gemini: multi-color G style badge. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div:nth-child(5) > div > div:first-child > div:first-child::after{
  content:"G"!important;
  display:grid!important;
  place-items:center;
  width:100%;height:100%;
  border-radius:15px;
  background:conic-gradient(from 210deg,#4285F4,#A855F7,#EA4335,#FBBC05,#34A853,#4285F4);
  color:#fff!important;
  font-size:21px!important;
  font-weight:950;
  text-shadow:0 1px 3px rgba(0,0,0,.18);
}

/* Stronger text hierarchy. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div > div > div:first-child > div:nth-child(2) > div:first-child{
  font-size:14px!important;
  color:#0F2744!important;
}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div > div > div:first-child > div:nth-child(2) > div:nth-child(2){
  margin-top:3px!important;
  font-size:10px!important;
}

/* Provider-color buttons: filled on Connect, outlined on key actions. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div button{
  min-height:38px;
  padding:0 15px!important;
  border-radius:12px!important;
  background:#fff!important;
  color:var(--accent)!important;
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent)!important;
}
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div button:hover{
  background:var(--accent)!important;
  color:#fff!important;
}

/* Colored provider indicator dot near each name. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div > div > div:first-child > div:nth-child(2) > div:first-child::after{
  content:"";
  display:inline-block;
  width:7px;height:7px;
  margin-left:8px;
  border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent);
  vertical-align:middle;
}

/* Decorative Brazil-color strip. */
.ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3::after{
  width:88px!important;
  height:8px!important;
  top:10px!important;
  right:22px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#0052CC 0 33%,#FFC107 33% 66%,#009E49 66% 100%)!important;
}

@media (max-width:720px){
  .ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3{padding:10px!important}
  .ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div{min-height:72px;padding:12px!important}
  .ldp-dark-shell:has(> header + section) > section > .mt-7.space-y-3 > div > div > div:first-child > div:first-child{width:44px!important;height:44px!important}
}
