/*
 * AI Automation Toolbox structural layout primitives.
 * Keep page widths, gutters, shells, command layouts, grids, flex rows,
 * navigation layout, and section spacing here.
 */

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-width: 0;
}

img,
svg,
video,
canvas {
    max-width: 100%;
    height: auto;
}

main,
section,
article,
aside,
header,
footer,
nav {
    min-width: 0;
}

.wrap,
.shell,
.aat-wrap,
.aat-shell,
.aat-page,
.aat-app-shell,
.aat-command-shell,
.aat-biz-shell,
.aat-ai-page {
    width: min(var(--aat-page-max), calc(100% - var(--aat-page-gutter)));
    max-width: 100%;
    margin-inline: auto;
    min-width: 0;
}

.wrap {
    padding: 26px 0 44px;
}

.aat-public-shell {
    width: min(var(--aat-public-max), calc(100% - 32px));
    max-width: 100%;
    margin-inline: auto;
    min-width: 0;
}

.topbar,
.aat-topbar,
.section-head,
.page-head,
.card-head,
.toolbar,
.tools,
.action-row,
.actions,
.form-actions,
.btn-row,
.manager-actions,
.nav-controls,
.view-controls {
    display: flex;
    align-items: center;
    gap: var(--aat-space-3);
    min-width: 0;
}

.topbar,
.aat-topbar,
.section-head,
.page-head {
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.tools,
.toolbar,
.action-row,
.actions,
.form-actions,
.btn-row,
.manager-actions,
.nav-controls,
.view-controls {
    flex-wrap: wrap;
}

.spread {
    justify-content: space-between;
}

.full {
    width: 100%;
}

.aat-stack,
.stack,
.stack-form,
.column-builder,
.new-import-form {
    display: grid;
    gap: var(--aat-space-4);
}

.aat-grid,
.grid,
.metric-grid,
.quick-help-grid {
    display: grid;
    gap: var(--aat-space-4);
    min-width: 0;
}

.aat-grid-2,
.start-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.aat-grid-3,
.quick-help-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.aat-grid-4,
.metric-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.row-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(170px, 1fr));
    gap: 10px;
    align-items: end;
}

.compact-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 170px auto;
    gap: 8px;
}

.import-form {
    display: grid;
    grid-template-columns: minmax(250px, 1.15fr) minmax(230px, .8fr) minmax(290px, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.aat-command-tab-stack,
.aat-biz-tab-stack {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: grid;
    gap: var(--aat-space-3);
    margin: 14px 0 18px;
}

.aat-tab-panel,
.aat-biz-tab-panel,
.aat-ai-tab-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.table-wrap,
.table-scroll,
.aat-table-wrap,
.data-grid-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

dialog {
    max-width: min(720px, calc(100vw - 32px));
}

.ait-site-header {
    width: 100%;
    min-height: 74px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 22px;
    position: relative;
    z-index: 1000;
}

.ait-site-header-menu {
    position: relative;
    flex: 0 0 auto;
    margin-right: 2px;
}

.ait-site-header-title {
    margin: 0 0 0 1px;
    white-space: nowrap;
}

.ait-site-header-mode {
    margin-left: auto;
    white-space: nowrap;
}

.aat-shared-nav {
    width: 100%;
    max-width: 100%;
    margin: 0 0 16px;
    padding: 10px 0;
}

.aat-shared-nav-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 8px;
    row-gap: 10px;
    width: 100%;
    max-width: 100%;
}

.aat-shared-nav .aat-nav-logout {
    display: inline-flex;
    margin: 0;
}

/* Legacy Agent Command shared-layout compatibility */
.row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--aat-space-3);min-width:0}
.ui-grid,.grid{display:grid;gap:var(--aat-space-4);min-width:0}
.ui-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ui-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ui-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ui-stack,.stack{display:grid;gap:var(--aat-space-4)}
.wide{grid-column:1/-1}


/* Voice Agent shared layout */
#ui-voice-agents.va-shell{width:100%;max-width:100%;min-width:0;display:grid;gap:var(--aat-space-5)}
#ui-voice-agents .va-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--aat-space-5);padding:var(--aat-space-5);border:1px solid var(--aat-border);border-radius:var(--aat-radius-lg);background:linear-gradient(145deg,rgba(255,165,0,.055),var(--aat-surface) 42%);box-shadow:var(--aat-shadow-card)}
#ui-voice-agents .va-hero>div:first-child{max-width:820px;min-width:0}
#ui-voice-agents .va-hero-actions,#ui-voice-agents .va-save-row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--aat-space-3)}
#ui-voice-agents .va-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--aat-space-4)}
#ui-voice-agents .va-grid>.full{grid-column:1/-1}
#ui-voice-agents .va-grid>.third{grid-column:span 2}
#ui-voice-agents .va-grid>.card{grid-column:span 3}
#ui-voice-agents [id^="va-panel-"]{min-width:0}
#ui-voice-agents [id^="va-panel-"]:not(.active){display:none!important}
#ui-voice-agents .va-primary-tabs,#ui-voice-agents .va-tabs{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
#ui-voice-agents .va-tabs{padding:10px;border:1px solid var(--aat-border);border-radius:var(--aat-radius-lg);background:var(--aat-bg-deep)}
#ui-voice-agents .va-tabs-advanced{position:relative}

/* Email Marketing */
.business-content .ui-mail-shell{width:100%;max-width:100%;min-width:0;margin:0;display:grid;gap:var(--aat-space-4)}
.business-content .ui-mail-hero{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:var(--aat-space-4);padding:var(--aat-space-5);border:1px solid var(--aat-border);border-radius:var(--aat-radius-lg);background:linear-gradient(180deg,var(--aat-surface),var(--aat-bg-elevated));box-shadow:var(--aat-shadow-card)}
.business-content .ui-mail-hero>div:first-child{min-width:0;max-width:780px}
.business-content .ui-mail-hero h1{margin:.15rem 0 .4rem;font-size:clamp(1.7rem,3vw,2.35rem)}
.business-content .ui-mail-hero p{margin:0;color:var(--aat-text-muted);max-width:72ch}
.business-content .ui-mail-shell .two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--aat-space-4)}
.business-content .ui-mail-shell .quick-actions{display:flex;flex-wrap:wrap;gap:var(--aat-space-3)}
.business-content .ui-mail-shell .stack{display:grid;gap:var(--aat-space-4)}

/* CRM — Business Command shared layout */
.business-content > .crm {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
}
.business-content .crm > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--aat-space-4);
    padding: var(--aat-space-5);
    margin: 0 0 var(--aat-space-4);
    border: 1px solid var(--aat-border);
    border-radius: var(--aat-radius-lg);
    background: var(--aat-surface);
    box-shadow: var(--aat-shadow-card);
}
.crm-nav, .crm .actions, .crm-lead-actions, .crm-lead-badges, .crm-lead-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--aat-space-2);
    align-items: center;
}

/* CRM navigation + contextual toolbars */
.crm-nav.aat-shared-nav,
.crm-lead-filters.aat-shared-nav {
    border: 1px solid var(--aat-nav-border);
    border-radius: var(--aat-radius-md);
    padding: 10px;
    margin: 0 0 var(--aat-space-4);
}
.crm .crm-view-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--aat-space-2);
    padding: var(--aat-space-3);
    margin: 0 0 var(--aat-space-4);
    border: 1px solid var(--aat-border);
    border-radius: var(--aat-radius-md);
    background: var(--aat-surface-2);
}
.crm .crm-view-actions form { margin: 0; }
.crm .crm-lead-search {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: var(--aat-space-2);
    margin: 0 0 var(--aat-space-3);
}


/* Native Toolbox Command V3 compatibility layouts */
.vs-page,.ab-page,.fs-page,.ui-vd-page{width:100%;max-width:100%;min-width:0}
.vs-hero,.ab-hero,.fs-hero,.ui-vd-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--aat-space-4);flex-wrap:wrap;margin-bottom:var(--aat-space-4)}
.vs-grid-2,.ab-grid-2,.fs-grid-2,.ui-vd-builder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--aat-space-4)}
.vs-grid-3,.ab-grid-3,.fs-grid-3,.ui-vd-provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--aat-space-4)}
.vs-connections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--aat-space-4)}
.vs-stats,.ui-vd-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--aat-space-3)}
.vs-actions,.ab-actions,.fs-actions,.ui-vd-actions,.vs-toolbar,.vs-meta,.ui-vd-provider-top{display:flex;align-items:center;flex-wrap:wrap;gap:var(--aat-space-2)}
.vs-destination-list,.vs-card-stack,.ab-stack,.fs-stack{display:grid;gap:var(--aat-space-3)}
.vs-destination-head,.ui-vd-provider-top{justify-content:space-between;align-items:flex-start}
.vs-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--aat-space-3)}
.vs-table-wrap,.fs-table-wrap,.ui-vd-table-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.vs-section:not(.is-active){display:none}
.vs-section.is-active{display:block}
.vs-schedule,.ui-vd-schedule{display:none}
.vs-schedule.is-visible,.ui-vd-schedule.is-visible{display:grid}
.fs-span-3{grid-column:1/-1}