.ava-integration-item{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ava-integration-item .item-main{min-width:220px;flex:1}
.ava-integration-item .item-main small{display:block}
.ava-integration-item .item-actions{display:flex;gap:8px;flex-wrap:wrap}
.ava-whatsapp-form,.ava-team-hub-form{width:100%;display:flex;gap:9px;flex-wrap:wrap;margin-top:8px}
.ava-whatsapp-form[hidden],.ava-team-hub-form[hidden]{display:none!important}
.ava-whatsapp-form input,.ava-team-hub-form input{min-width:170px;flex:1;padding:10px 12px;background:var(--panel2,#282828);color:var(--text,#fff);border:1px solid var(--edge,#444);border-radius:9px}
.ava-integration-item button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:680px){.ava-integration-item .item-actions{width:100%}.ava-whatsapp-form,.ava-team-hub-form{flex-direction:column}}

/* Settings layout: three compact account/team/support cards, other panels full width.
 * The compound selector deliberately overrides generic .cols breakpoint rules. */
#settings-section > .cols.settings-stack{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:stretch}
#settings-section > .settings-stack > .panel{width:100%;min-width:0}
#settings-section .settings-overview-grid{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;
 align-items:stretch;min-width:0
}
#settings-section .settings-overview-grid > .panel{min-width:0;width:100%;align-self:stretch}
@media(max-width:1100px){
 #settings-section .settings-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 #settings-section .settings-overview-grid{grid-template-columns:minmax(0,1fr)}
}
#settings-section .ava-integration-item{position:relative}
#settings-section .ava-integration-item .item-main{min-width:0;flex:1 1 240px}
#settings-section .ava-integration-item .item-actions{display:flex;align-items:center;flex:0 0 auto;gap:8px}
#settings-section .axle-settings-actions{display:flex;align-items:center;gap:8px}
#settings-section .ava-integration-menu{position:relative;display:inline-flex;align-items:center}
#settings-section .ava-integration-menu[hidden]{display:none!important}
#settings-section .ava-integration-menu > summary.ava-menu-trigger{
 display:inline-flex;align-items:center;justify-content:center;list-style:none;
 width:36px;height:36px;padding:0;border:1px solid var(--edge);
 border-radius:9px;background:var(--panel2,#282828);color:var(--text,#fff);
 font:700 24px/1 Manrope,Arial,sans-serif;cursor:pointer
}
#settings-section .ava-integration-menu > summary::-webkit-details-marker{display:none}
#settings-section .ava-integration-menu > summary.ava-menu-trigger:hover,
#settings-section .ava-integration-menu[open] > summary.ava-menu-trigger{
 background:#333;border-color:#4d4d4d
}
#settings-section .ava-integration-menu > summary.ava-menu-trigger:focus-visible{
 outline:2px solid var(--gold);outline-offset:3px
}
#settings-section .ava-menu-list{
 position:absolute;top:calc(100% + 6px);right:0;z-index:120;
 display:grid;gap:3px;min-width:192px;padding:6px;
 background:var(--panel,#181818);color:var(--text,#fff);
 border:1px solid #3e3e3e;border-radius:11px;box-shadow:0 16px 40px #0008
}
#dashboard #settings-section .ava-menu-list button{
 display:flex;width:100%;min-height:36px;justify-content:flex-start;
 padding:8px 11px;border:0;border-radius:7px;background:transparent;
 color:var(--text,#fff);font:600 12px/1.4 Manrope,Arial,sans-serif;
 text-align:left;white-space:nowrap;cursor:pointer
}
#dashboard #settings-section .ava-menu-list button:hover:not(:disabled),
#dashboard #settings-section .ava-menu-list button:focus-visible{
 background:var(--panel2,#282828);color:var(--text,#fff)
}
#dashboard #settings-section .ava-menu-list button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:580px){
 #settings-section .ava-integration-item{align-items:stretch}
 #settings-section .ava-integration-item .item-actions{width:100%;justify-content:flex-start}
 #settings-section .ava-menu-list{min-width:180px}
}

/* Each lower Settings card is an accessible native disclosure. The outer
   .panel retains all of its original section ID and data hooks. */
#settings-section .settings-collapsible{display:block;width:100%;min-width:0}
#settings-section .settings-collapsible > summary.settings-collapsible-trigger{
 display:flex;align-items:center;justify-content:space-between;gap:16px;
 min-height:28px;width:100%;margin:0;padding:0;
 color:var(--text,#fff);cursor:pointer;list-style:none
}
#settings-section .settings-collapsible > summary.settings-collapsible-trigger::-webkit-details-marker{display:none}
#settings-section .settings-collapsible > summary.settings-collapsible-trigger h2{
 margin:0;line-height:1.5;min-width:0
}
#settings-section .settings-collapsible > summary.settings-collapsible-trigger:hover h2{
 color:var(--text,#fff)
}
#settings-section .settings-collapsible > summary.settings-collapsible-trigger:focus-visible{
 outline:2px solid var(--gold,#e7b122);outline-offset:4px;border-radius:3px
}
#settings-section .settings-collapsible[open] > summary.settings-collapsible-trigger{
 border-bottom:1px solid var(--edge,#333);
 margin-bottom:16px;padding-bottom:13px
}


#settings-section .ava-team-hub-form small{flex:1 0 100%;color:var(--muted,#aaa);font-size:11px;line-height:1.5}

/* Integrations can expand to show forms. The general workspace .item-list
 * height cap previously hid the credential fields beneath the final row. */
#dashboard #settings-section #ava-integrations-list{
 max-height:none;
 overflow:visible;
 scrollbar-gutter:auto
}
#dashboard #settings-section .ava-team-hub-form:not([hidden]){
 display:flex;
 flex-wrap:wrap;
 align-items:center
}
#dashboard #settings-section .ava-team-hub-form input{
 box-sizing:border-box;
 min-width:0;
 flex:1 1 190px
}
#dashboard #settings-section .ava-team-hub-form button{
 flex:0 0 auto
}
@media(max-width:580px){
 #dashboard #settings-section .ava-team-hub-form input,
 #dashboard #settings-section .ava-team-hub-form button{width:100%;flex-basis:100%}
}
