/* Schema Manager */

.schemaManager {
    padding: 0;
}

.schemaManagerContent {
    padding: 10px 20px 20px;
}

.schemaManager .tableHeader {
    background: var(--dark-purple);
    margin:
        0
        calc(-1 * var(--standard-padding))
        18px
        calc(-1 * var(--standard-padding));
    padding: 10px;
}

/* Schema metadata tables */

.schemaTableWrap {
    width: 100%;
    overflow-x: auto;
}

.schemaTable {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--roboto-condensed);
    font-size: 14px;
}

.schemaTable th,
.schemaTable td {
    padding: 7px 10px;
    border-bottom: 1px solid #ddd;
    text-align: left;
    white-space: nowrap;
}

.schemaTable th {
    background: var(--dark-green);
    color: white;
}

.schemaTableRow {
    cursor: pointer;
}

.schemaTableRow:hover td {
    background: #f2f2f2;
}


/* Schema Manager sections */

.schemaManagerSection {
    margin-top: 1rem;
}

.schemaManagerContent > .schemaManagerSection:first-child {
    margin-top: 0;
}

.schemaManagerSectionHeader {
    align-items: baseline;
    display: flex;
    gap: 0.8rem;
    justify-content: space-between;
    margin-bottom: 0.65rem;
    padding-bottom: 0;
}

.schemaManagerSectionHeader h3 {
    margin: 0;
}

.schemaManagerSectionContext {
    color: rgba(17, 17, 17, 0.62);
    font-family: var(--roboto-condensed);
    font-size: 0.92rem;
}


/* Column metadata editor */

.schemaColumnRecord {
    margin-top: 0;
    max-width: none;
    width: 100%;
}

.schemaColumnRecordTitle {
    display: none;
}

.schemaColumnType {
    opacity: 0.6;
}

.schemaColumnRecordSection {
    border-bottom: 1px solid rgba(33, 71, 0, 0.16);
    margin-bottom: 0;
    padding: 0.7rem 0;
}

.schemaColumnRecordSection:first-of-type {
    padding-top: 0;
}

.schemaColumnRecordSection h4 {
    font-family: var(--roboto-condensed);
    font-size: 0.86rem;
    font-style: normal;
    letter-spacing: 0.06em;
    margin: 0 0 0.55rem;
    text-transform: uppercase;
}

.schemaManagerSection .schemaSaveBar {
    margin-top: 0.65rem;
}


/* Record-style schema fields */

.schemaRecordFields,
.schemaLookupFields {
    display: grid;
    gap: 0.45rem;
}

.schemaRecordField {
    align-items                 : center ;
    display                     : grid ;
    gap                         : 0.75rem ;
    grid-template-columns       :
        180px
        minmax(0, 1fr)
        minmax(240px, 0.9fr)
        minmax(220px, 0.8fr) ;
    margin                      : 0 ;
}

.schemaRecordField > span:first-child {
    font-weight: 600;
}

.schemaRecordField input[type="text"],
.schemaRecordField select {
    box-sizing: border-box;
    max-width: 100%;
}

.schemaRecordGuidance {
    color: rgba(17, 17, 17, 0.68);
    font-size: 0.88em;
    line-height: 1.3;
}

.schemaRecordInline {
    align-items: center;
    display: grid;
    gap: 0.4rem;
    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);
}

.schemaFlagChoices {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.8rem;
}

.schemaLookupFields [data-lookup-mode][hidden] {
    display: none;
}


/* Explicit/default state */

.schemaMetadataSource {
    display: inline-block;
    margin-right: 0.45rem;
    padding: 0.08rem 0.35rem;
    border-radius: 3px;
    font-family: var(--roboto-condensed);
    font-size: 0.78em;
    font-weight: 700;
    text-transform: uppercase;
}

.schemaMetadataSource--explicit {
    background: var(--light-green);
    color: var(--dark-green);
}

.schemaMetadataSource--default {
    background: #eeeeee;
    color: #666666;
}


@media (max-width: 800px) {

    .schemaRecordField {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }

    .schemaRecordGuidance {
        margin-bottom: 0.35rem;
    }

    .schemaRecordInline {
        grid-template-columns: 1fr;
    }

    .schemaManagerSectionHeader {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }
}

.schemaTableRow.schemaSelected td {
    background: #dcffdb;
}

.schemaTable input[type="checkbox"] {
    width: 16px;
    height: 16px;
}

.schemaManager .schemaTable td, th {
    font-family                 : "Roboto Condensed", sans-serif ;
}

.schemaManager .schemaRecordField {
    font-family                 : "Roboto Condensed", sans-serif ;
}

.schemaRecordCurrent {
    font-family                 : "Roboto Condensed", sans-serif ;
    font-size                   : 0.88em ;
}

.schemaRecordCurrent--default {
    font-style                  : italic ;
    opacity                     : 0.65 ;
}

/* =========================================================
   USER MANAGER
   ========================================================= */

.userManagerAccountRows {
    display: grid;
    gap: 0.65rem;
}

.userManagerAccountRow {
    align-items: center;
    display: grid;
    gap: 0.7rem;
}

.userManagerAccountRow--identity {
    grid-template-columns:
        max-content
        minmax(120px, 1fr)
        max-content
        minmax(180px, 1fr);
}

.userManagerAccountRow--email {
    grid-template-columns:
        max-content
        minmax(0, 1fr);
}

.userManagerAccountRow--access {
    grid-template-columns:
        max-content
        minmax(180px, 1fr)
        max-content
        auto
        max-content
        minmax(180px, 1fr);
}

.userManagerAccountRow input,
.userManagerAccountRow select {
    box-sizing: border-box;
    min-height: 2.45rem;
    width: 100%;
}

.userManagerFieldLabel {
    font-family: var(--roboto-condensed);
    font-weight: 700;
    white-space: nowrap;
}


/* Active Yes / No switch */

.userManagerBoolean {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
}

.userManagerBoolean input {
    height: 1px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 1px;
}

.userManagerBooleanTrack {
    background: #dcffdb;
    border: 1px solid var(--dark-green);
    border-radius: 1.3rem;
    display: block;
    height: 2.3rem;
    min-width: 5.5rem;
    position: relative;
    transition: background 0.15s ease;
}

.userManagerBooleanHandle {
    background: #fff;
    border: 1px solid var(--dark-green);
    border-radius: 50%;
    height: 1rem;
    left: 0.7rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: left 0.15s ease;
    width: 1rem;
    z-index: 2;
}

.userManagerBooleanNo,
.userManagerBooleanYes {
    font-family: var(--roboto-condensed);
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 2.45rem;
    position: absolute;
    top: 0;
    transition: opacity 0.15s ease;
}

.userManagerBooleanNo {
    color: var(--dark-green);
    opacity: 1;
    right: 0.8rem;
}

.userManagerBooleanYes {
    color: #dcffdb;
    left: 0.8rem;
    opacity: 0;
}

.userManagerBoolean input:checked
+ .userManagerBooleanTrack {
    background: var(--dark-green);
}

.userManagerBoolean input:checked
+ .userManagerBooleanTrack
.userManagerBooleanHandle {
    left: calc(100% - 1.7rem);
}

.userManagerBoolean input:checked
+ .userManagerBooleanTrack
.userManagerBooleanNo {
    opacity: 0;
}

.userManagerBoolean input:checked
+ .userManagerBooleanTrack
.userManagerBooleanYes {
    opacity: 1;
}

/* Channels */

.userManagerChannels {
    border-top:
        1px solid
        rgba(33, 71, 0, 0.16);
    margin-top: 1rem;
    padding-top: 1rem;
}

.userManagerChannelGrid {
    display: grid;
    gap: 0.45rem;
    grid-template-columns:
        repeat(
            auto-fit,
            minmax(220px, 1fr)
        );
}

.userManagerChannel {
    align-items: center;
    border:
        1px solid
        rgba(33, 71, 0, 0.22);
    border-radius: 5px;
    cursor: pointer;
    display: grid;
    gap: 0.5rem;
    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;
    min-height: 2.6rem;
    padding: 0.45rem 0.65rem;
}

.userManagerChannel input {
    height: 16px;
    margin: 0;
    width: 16px;
}

.userManagerChannel span {
    font-family: var(--roboto-condensed);
    font-weight: 700;
}

.userManagerChannel small {
    font-family: var(--roboto-condensed);
    opacity: 0.6;
}

.userManagerEmpty {
    font-family: var(--roboto-condensed);
    opacity: 0.65;
}


@media (max-width: 800px) {

    .userManagerAccountRow--identity,
    .userManagerAccountRow--email,
    .userManagerAccountRow--access {
        grid-template-columns:
            minmax(110px, auto)
            minmax(0, 1fr);
    }

}

/* Explicit access roles */

.userManagerRoleGrid {
    display: grid;
    gap: 0.55rem;
    grid-template-columns:
        repeat(
            auto-fit,
            minmax(260px, 1fr)
        );
}

.userManagerRole {
    align-items: flex-start;
    border:
        1px solid
        rgba(33, 71, 0, 0.22);
    border-radius: 5px;
    cursor: pointer;
    display: grid;
    gap: 0.65rem;
    grid-template-columns:
        auto
        minmax(0, 1fr);
    padding: 0.65rem;
}

.userManagerRole input {
    height: 16px;
    margin: 0.2rem 0 0;
    width: 16px;
}

.userManagerRoleText {
    display: grid;
    gap: 0.15rem;
}

.userManagerRoleText b,
.userManagerRoleText small {
    font-family: var(--roboto-condensed);
}

.userManagerRoleText small {
    opacity: 0.6;
}

.userManagerRoleText > span {
    font-size: 0.85rem;
    opacity: 0.8;
}

.userManagerAddForm {
    display: grid;
    gap: 0.7rem;
    text-align: left;
}

.userManagerAddForm label {
    display: grid;
    gap: 0.25rem;
}

.userManagerAddForm label > span {
    font-family: var(--roboto-condensed);
    font-size: 0.85rem;
    font-weight: 700;
}

.userManagerAddForm .swal2-input {
    box-sizing: border-box;
    margin: 0;
    width: 100%;
}

.userManagerAddForm small {
    line-height: 1.4;
    opacity: 0.7;
}


/* =========================================================
   USER MANAGER — CHANNEL MULTI-SELECT
   ========================================================= */

.userManagerChannelGrid {
    border                      : 1px solid rgba(33, 71, 0, 0.28) ;
    border-radius               : 4px ;
    display                     : grid ;
    grid-template-columns       : repeat(3, minmax(0, 1fr)) ;
    overflow                    : hidden ;
}


.userManagerChannel {
    align-items                 : center ;
    background                  : transparent ;
    border                      : 0 ;
    border-bottom               : 1px solid rgba(33, 71, 0, 0.16) ;
    border-radius               : 0 ;
    border-right                : 1px solid rgba(33, 71, 0, 0.16) ;
    box-shadow                  : none ;
    box-sizing                  : border-box ;
    cursor                      : pointer ;
    display                     : grid ;
    gap                         : 10px ;
    grid-template-columns       : auto minmax(0, 1fr) auto ;
    margin                      : 0 ;
    min-height                  : 36px ;
    padding                     : 3px 10px ;
}


/*
 * No right divider on final column.
 */

.userManagerChannel:nth-child(3n) {
    border-right                : 0 ;
}


/*
 * Remove bottom border from final grid row.
 */

.userManagerChannel:nth-last-child(-n + 3) {
    border-bottom               : 0 ;
}


/*
 * Subtle alternating multi-select rows.
 */

.userManagerChannel:nth-child(6n + 1),
.userManagerChannel:nth-child(6n + 2),
.userManagerChannel:nth-child(6n + 3) {
    background                  : rgba(255, 255, 255, 0.12) ;
}


.userManagerChannel:hover {
    background                  : rgba(255, 255, 255, 0.38) ;
}


.userManagerChannel:has(input:checked) {
    background                  : #ffffff ;
    box-shadow                  : inset 3px 0 0 var(--dark-purple) ;
}


.userManagerChannel input {
    margin                      : 0 ;
}


.userManagerChannel span {
    font-weight                 : 700 ;
    min-width                   : 0 ;
}


.userManagerChannel small {
    color                       : #777 ;
    font-family                 : var(--roboto-condensed) ;
    font-weight                 : 400 ;
    white-space                 : nowrap ;
}


/*
 * Two-column tablet layout.
 */

@media (max-width: 900px) {

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

    .userManagerChannel,
    .userManagerChannel:nth-child(3n) {
        border-right            : 1px solid rgba(33, 71, 0, 0.16) ;
    }

    .userManagerChannel:nth-child(2n) {
        border-right            : 0 ;
    }

    .userManagerChannel:nth-last-child(-n + 3) {
        border-bottom           : 1px solid rgba(33, 71, 0, 0.16) ;
    }

    .userManagerChannel:nth-last-child(-n + 2) {
        border-bottom           : 0 ;
    }
}


/*
 * Single-column mobile layout.
 */

@media (max-width: 600px) {

    .userManagerChannelGrid {
        grid-template-columns   : 1fr ;
    }

    .userManagerChannel,
    .userManagerChannel:nth-child(2n),
    .userManagerChannel:nth-child(3n) {
        border-right            : 0 ;
    }

    .userManagerChannel:nth-last-child(-n + 2) {
        border-bottom           : 1px solid rgba(33, 71, 0, 0.16) ;
    }

    .userManagerChannel:last-child {
        border-bottom           : 0 ;
    }
}