.directories-settings-screen{
    display:grid;
    gap:18px;
    overflow-anchor:none;
}

.directories-settings-screen:has(.directory-storage-shell),
.directories-settings-screen:has(.device-catalog-shell){
    border:none;
    border-radius:0;
    padding:0;
    background:transparent;
}

body.settings-panel-open .main,
body.settings-panel-open #pageContent,
body.settings-panel-open .directories-settings-screen,
body.settings-panel-open .directories-step-shell,
body.settings-panel-open .directory-storage-layout{
    overflow-anchor:none;
}

.form-settings-screen{
}

.form-settings-screen .directories-step-head{
    margin-top:-79px;
    margin-bottom:79px;
}

.form-settings-screen .directory-screen-grid{
    margin-top:-151px;
}

.directories-step-shell{
    display:grid;
    gap:16px;
    min-height:420px;
    border:1px solid #d9e2f1;
    border-radius:20px;
    background:#fff;
    padding:20px;
    box-shadow:0 12px 30px rgba(15,23,42,0.04);
}

.directory-storage-shell{
    grid-template-rows:auto auto;
    align-content:start;
    min-height:0;
    border:none;
    border-radius:0;
    padding:0;
    box-shadow:none;
}

.device-catalog-shell{
    min-height:0;
    border:none;
    border-radius:0;
    padding:0;
    background:transparent;
    box-shadow:none;
    gap:14px;
}

.device-catalog-import-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:4px;
}

.device-catalog-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(180px, 1fr));
    gap:8px;
    align-items:start;
}

.device-catalog-column{
    min-width:0;
    display:grid;
    gap:12px;
    align-content:start;
}

.device-catalog-column-top{
    min-height:31px;
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}

.device-catalog-add-btn{
    height:30px;
    padding:0 12px;
}

.directory-help-check{
    display:flex;
    align-items:center;
    gap:8px;
}

.directory-help-check input[type="checkbox"]{
    width:16px;
    height:16px;
    margin:0;
}

.directory-help-mark{
    width:18px;
    height:18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid #cbd5e1;
    border-radius:999px;
    color:#64748b;
    font-size:12px;
    font-weight:700;
    cursor:help;
}

.device-catalog-table{
    min-height:395px;
    background:#fff;
}

.device-catalog-head{
    display:grid;
    grid-template-columns:34px minmax(0, 1fr);
    align-items:center;
    min-height:34px;
    background:#e9eaec;
    color:#10233f;
    font-size:13px;
}

.device-catalog-body{
    max-height:366px;
    overflow:auto;
    border-right:1px solid #eef2f7;
}

.device-catalog-row{
    width:100%;
    min-height:30px;
    display:grid;
    grid-template-columns:34px minmax(0, 1fr) 18px;
    align-items:center;
    border:0;
    border-bottom:1px solid #edf0f3;
    background:#fff;
    color:#10233f;
    text-align:left;
    font:inherit;
    cursor:pointer;
}

.device-catalog-row:hover,
.device-catalog-row.active{
    background:#dceafa;
}

.device-catalog-check{
    display:flex;
    justify-content:center;
    align-items:center;
}

.device-catalog-check input{
    width:14px;
    height:14px;
    accent-color:#2563eb;
}

.device-catalog-row-name{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.device-catalog-row-trailing{
    color:#98a2b3;
    text-align:center;
}

.device-catalog-total{
    color:#10233f;
    font-size:12px;
    padding-left:6px;
}

.device-catalog-empty{
    min-height:330px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:24px;
    text-align:center;
    color:#10233f;
}

.device-catalog-empty strong{
    font-size:14px;
    font-weight:700;
}

.device-catalog-empty span{
    max-width:290px;
    color:#10233f;
    font-size:13px;
    line-height:1.35;
}

.device-catalog-empty-icon{
    position:relative;
    width:64px;
    height:48px;
    border:2px solid #3b82f6;
    border-radius:4px;
    background:#eef6ff;
}

.device-catalog-empty-icon::before{
    content:"";
    position:absolute;
    left:14px;
    right:14px;
    top:18px;
    height:9px;
    border:2px solid #3b82f6;
    border-top:0;
    border-radius:0 0 12px 12px;
}

.device-catalog-empty-icon::after{
    content:"";
    position:absolute;
    left:-16px;
    right:-16px;
    top:15px;
    height:8px;
    border-radius:999px;
    background:linear-gradient(90deg, transparent, #dbeafe 18%, #dbeafe 82%, transparent);
    z-index:-1;
}

.directories-step-head{
    display:grid;
    gap:10px;
}

.directories-step-head-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.directory-breadcrumb{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.directory-breadcrumb-link,
.directory-breadcrumb-current{
    color:#111827;
    font-size:20px;
    line-height:1.4;
}

.directory-breadcrumb-link{
    padding:0 0 2px;
    border-radius:0;
    background:transparent;
    border:none;
    border-bottom:1px solid #cfd8e3;
    font-weight:500;
}

.directory-breadcrumb-link:hover{
    color:#111827;
    border-bottom-color:#98a2b3;
}

.directory-breadcrumb-current{
    color:#475467;
    font-weight:700;
}

.directory-breadcrumb-sep{
    color:#98a2b3;
    font-size:18px;
}

.directories-section-head{
    position:relative;
    display:grid;
    gap:6px;
    padding-top:49px;
}

.directories-section-head::before{
    content:"";
    position:absolute;
    top:11px;
    left:0;
    right:0;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg, #2f6fed 0%, #8fb8ff 42%, #d8e8ff 100%);
}

.directories-section-head h3{
    margin:0;
    color:#111827;
    font-size:28px;
}

.directories-section-head-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
}

.directories-section-subtitle{
    color:#667085;
    font-size:14px;
    line-height:1.45;
}

.directory-screen-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:14px;
    align-content:start;
}

.directory-screen-grid-categories{
    grid-template-columns:1fr;
    max-width:520px;
}

.directory-screen-card{
    width:100%;
    min-height:72px;
    padding:14px 18px;
    border-radius:16px;
    border:1px solid #d9e2f1;
    background:#fcfdff;
    text-align:left;
    display:grid;
    gap:4px;
    color:#111827;
    box-shadow:0 4px 14px rgba(15,23,42,0.03);
    transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
    -webkit-tap-highlight-color:transparent;
}

.directory-screen-card:hover{
    border-color:#bdd0ed;
    background:#f1f6ff;
    box-shadow:0 10px 24px rgba(59,130,246,0.08);
    transform:translateY(-1px);
}

.directory-screen-card:focus-visible,
.directory-screen-card:active{
    border-color:#afc8ef;
    background:#e8f1ff;
    box-shadow:0 8px 20px rgba(59,130,246,0.1);
    outline:none;
}

.directory-screen-card-title{
    color:#111827;
    font-size:16px;
    font-weight:700;
}

.directory-screen-card-subtitle{
    color:#475467;
    font-size:13px;
    line-height:1.4;
}

.directory-card-meta{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    color:#667085;
    font-size:12px;
}

.directory-card-code{
    padding:2px 8px;
    border-radius:999px;
    background:#eef3fb;
    color:#4b6486;
    font-weight:700;
}

.directory-screen-card:hover .directory-card-code,
.directory-screen-card:focus-visible .directory-card-code,
.directory-screen-card:active .directory-card-code{
    background:#e4ecf8;
    color:#445b79;
}

.integrations-settings-screen{
    width:100%;
    max-width:none;
}

.integration-import-panel{
    display:grid;
    gap:18px;
    padding:20px;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
    box-shadow:0 10px 28px rgba(15,23,42,0.04);
}

.integration-import-head,
.integration-import-history-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
}

.integration-import-head h3,
.integration-import-history-head h4{
    margin:0;
    color:#111827;
}

.integration-import-head h3{
    font-size:20px;
}

.integration-import-history-head h4{
    font-size:16px;
}

.integration-import-head p{
    max-width:620px;
    margin:6px 0 0;
    color:#667085;
    font-size:14px;
    line-height:1.45;
}

.integration-import-badge{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:4px 10px;
    border-radius:999px;
    background:#eef4ff;
    color:#1d4ed8;
    font-size:12px;
    font-weight:700;
}

.integration-import-form{
    display:grid;
    grid-template-columns:repeat(2, minmax(220px, 1fr));
    gap:12px;
}

.integration-import-form label{
    display:grid;
    gap:6px;
    color:#344054;
    font-size:13px;
    font-weight:700;
}

.integration-import-form input{
    width:100%;
    height:38px;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fbfdff;
    color:#111827;
}

.integration-import-form-wide,
.integration-import-actions{
    grid-column:1 / -1;
}

.integration-import-actions{
    display:flex;
    justify-content:flex-start;
    gap:8px;
    flex-wrap:wrap;
}

.integration-import-history{
    display:grid;
    gap:8px;
}

.integration-import-row{
    display:grid;
    grid-template-columns:86px minmax(0, 1fr);
    gap:12px;
    align-items:start;
    padding:12px;
    border:1px solid #edf1f7;
    border-radius:8px;
    background:#fcfdff;
}

.integration-import-code{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:32px;
    border-radius:8px;
    background:#111827;
    color:#fff;
    font-size:13px;
    font-weight:800;
}

.integration-import-main{
    min-width:0;
    display:grid;
    gap:5px;
}

.integration-import-title{
    color:#111827;
    font-size:14px;
    font-weight:700;
}

.integration-import-meta{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    color:#667085;
    font-size:12px;
}

.integration-import-comment{
    color:#475467;
    font-size:13px;
    line-height:1.35;
}

.integration-import-row-actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    padding-top:4px;
}

.integration-import-row-actions input{
    min-height:36px;
    max-width:320px;
    padding:7px 10px;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
    color:#344054;
    font-size:13px;
}

.integration-import-delete-btn{
    background:#dc2626;
    color:#fff;
}

.integration-import-delete-btn:hover{
    background:#b91c1c;
}

.integration-import-mapping{
    display:grid;
    gap:14px;
    padding:16px;
    border:1px solid #bfd2ff;
    border-radius:8px;
    background:#f8fbff;
}

.integration-import-mapping-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.integration-import-mapping-head h4{
    margin:0;
    color:#111827;
    font-size:16px;
}

.integration-import-mapping-head p{
    margin:4px 0 0;
    color:#667085;
    font-size:13px;
}

.integration-import-mapping-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:10px;
}

/* ── Таблица маппинга импорта ────────────────────────────────── */
.import-map-table{
    width:100%;
    border-collapse:collapse;
    border:1px solid #d9e2f1;
    border-radius:8px;
    overflow:hidden;
    background:#fff;
    font-size:13px;
}

.import-map-table thead{
    background:#f1f5ff;
}

.import-map-table th{
    padding:10px 12px;
    text-align:left;
    font-size:12px;
    font-weight:600;
    color:#667085;
    text-transform:uppercase;
    letter-spacing:.04em;
    border-bottom:1px solid #d9e2f1;
    white-space:nowrap;
}

.import-map-th-col   { width:22%; }
.import-map-th-examples { width:36%; }
.import-map-th-arrow { width:28px; }
.import-map-th-field { width:42%; }

.import-map-row{
    border-bottom:1px solid #e5eaf4;
    transition:background .12s;
}
.import-map-row:last-child{ border-bottom:none; }
.import-map-row:hover{ background:#f0f5ff; }

/* Авто-определённые — зелёная полоска слева + фон */
.import-map-row--detected{
    background:#f0fdf6;
    box-shadow:inset 3px 0 0 #22c55e;
}
.import-map-row--detected:hover{ background:#e4faea; }

/* Пропускаемые — серый фон, текст заметнее */
.import-map-row--skip{
    background:#f9fafb;
}
.import-map-row--skip .import-map-col-name{
    color:#9aa5b8;
}
.import-map-row--skip .import-map-example{
    background:#eef0f4;
    color:#aab4c6;
}
.import-map-row--skip .import-map-arrow{
    color:#d1d9e6;
}
.import-map-row--skip:hover{
    background:#f1f3f7;
}
.import-map-row--skip:hover .import-map-col-name{ color:#667085; }
.import-map-row--skip:hover .import-map-example{ color:#667085; background:#e8eaf0; }

.import-map-col{
    padding:11px 14px;
    vertical-align:middle;
}
.import-map-col-name{
    display:block;
    font-weight:600;
    color:#1d2939;
    font-size:13px;
    line-height:1.4;
}
.import-map-badge-auto{
    display:inline-flex;
    align-items:center;
    gap:3px;
    margin-top:4px;
    padding:2px 7px;
    border-radius:20px;
    background:#16a34a;
    color:#fff;
    font-size:10px;
    font-weight:700;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.import-map-examples{
    padding:11px 12px;
    vertical-align:middle;
}
.import-map-example{
    display:inline-block;
    margin:2px 4px 2px 0;
    padding:3px 8px;
    border-radius:5px;
    background:#e8eef8;
    color:#344054;
    font-size:12px;
    max-width:200px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    vertical-align:middle;
    border:1px solid #d5dff0;
}

.import-map-arrow{
    padding:11px 6px;
    vertical-align:middle;
    color:#4a7eff;
    font-size:18px;
    font-weight:700;
    text-align:center;
    white-space:nowrap;
}

.import-map-field{
    padding:8px 14px 8px 0;
    vertical-align:middle;
}
.import-map-field .integration-import-map-select-row select{
    height:36px;
    min-height:36px;
    font-size:13px;
    background:#fff;
    border:2px solid #b8c9e8;
    border-radius:7px;
    color:#111827;
    padding:0 32px 0 10px;
    font-weight:500;
}
.import-map-field .integration-import-map-select-row select:focus{
    border-color:#4a7eff;
    outline:none;
}
.import-map-row--detected .import-map-field .integration-import-map-select-row select{
    border-color:#86efac;
    background:#fff;
}
.import-map-field .integration-import-map-more{
    height:36px;
    min-height:36px;
    width:36px;
    min-width:36px;
    background:#fff;
    border:2px solid #b8c9e8;
    border-radius:7px;
    color:#344054;
    font-size:16px;
    font-weight:700;
}

.integration-import-map-field{
    display:grid;
    gap:6px;
    padding:10px;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
}

.integration-import-map-field span{
    color:#344054;
    font-size:13px;
    font-weight:700;
}

.integration-import-map-field select{
    height:40px;
    min-height:40px;
    padding:0 34px 0 10px;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
    color:#111827;
    font-size:14px;
    line-height:40px;
}

.integration-import-map-select-row{
    display:flex;
    gap:6px;
}

.integration-import-map-select-row select{
    min-width:0;
    flex:1;
}

.integration-import-map-more{
    width:40px;
    min-width:40px;
    height:40px;
    min-height:40px;
    padding:0;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
    color:#344054;
    font-size:18px;
    font-weight:700;
    line-height:1;
}

.integration-import-status-modal-backdrop{
    position:fixed;
    inset:0;
    z-index:1200;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(15,23,42,0.38);
}

.integration-import-status-mapping{
    width:min(760px, calc(100vw - 48px));
    max-height:calc(100vh - 48px);
    display:grid;
    gap:10px;
    padding:18px;
    border:1px solid #d9e2f1;
    border-radius:12px;
    background:#fff;
    box-shadow:0 24px 70px rgba(15,23,42,0.24);
    overflow:auto;
}

.integration-import-status-mapping-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.integration-import-status-mapping-head h4{
    margin:0;
    color:#111827;
    font-size:18px;
}

.integration-import-status-mapping-actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.integration-import-status-close{
    width:34px;
    min-width:34px;
    height:34px;
    min-height:34px;
    padding:0;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
    color:#667085;
    font-size:22px;
    line-height:1;
}

.integration-import-status-mapping-list{
    display:grid;
    gap:8px;
}

.integration-import-status-mapping-row{
    display:grid;
    grid-template-columns:minmax(180px, 1fr) minmax(220px, 1fr) 40px;
    gap:8px;
}

.integration-import-status-mapping-row input,
.integration-import-status-mapping-row select{
    width:100%;
    height:40px;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
    color:#111827;
    font-size:14px;
}

.integration-import-status-remove{
    width:40px;
    min-width:40px;
    height:40px;
    min-height:40px;
    padding:0;
    border:1px solid #fee2e2;
    border-radius:8px;
    background:#fff;
    color:#dc2626;
    font-size:22px;
    line-height:1;
}

.integration-import-map-field em{
    min-height:18px;
    color:#667085;
    font-size:12px;
    font-style:normal;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.integration-import-preview-table-wrap{
    width:100%;
    max-width:100%;
    overflow:auto;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#fff;
}

.integration-import-preview-table{
    width:max-content;
    min-width:100%;
    table-layout:auto;
}

.integration-import-preview-table th,
.integration-import-preview-table td{
    min-width:160px;
    max-width:260px;
    height:auto;
    min-height:32px;
    max-height:none;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.integration-import-empty{
    padding:18px;
    border:1px dashed #d9e2f1;
    border-radius:8px;
    color:#667085;
    background:#fbfdff;
    text-align:center;
}

@media (max-width: 720px){
    .integration-import-form{
        grid-template-columns:1fr;
    }

    .integration-import-row{
        grid-template-columns:1fr;
    }

    .integration-import-code{
        justify-content:flex-start;
        width:max-content;
        padding:0 10px;
    }
}

.directory-detail-summary{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:6px 12px;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    font-size:13px;
    font-weight:700;
}

.directory-toolbar{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
    justify-content:flex-start;
    margin-top:0;
}

.directory-search-input{
    min-width:260px;
    max-width:320px;
    border-radius:12px;
    border:1px solid #d9e2f1;
    background:#fbfdff;
}

.directory-chip-grid{
    display:flex;
    flex-direction:column;
    gap:10px;
    align-items:stretch;
}

.directory-chip{
    position:relative;
    display:flex;
    align-items:center;
    gap:8px;
    width:100%;
    min-height:48px;
    padding:6px 8px;
    border-radius:14px;
    background:#f8fbff;
    border:1px solid #d8e4f4;
    transition:background .18s ease, border-color .18s ease;
}

.directory-chip-tree{
    margin-left:calc(var(--tree-level, 0) * 24px);
    width:calc(100% - (var(--tree-level, 0) * 24px));
}

.directory-tree-caret{
    width:14px;
    color:#667085;
    font-size:14px;
    line-height:1;
}

.directory-warehouse-list{
    display:grid;
    gap:12px;
}

.directory-warehouse-group{
    display:grid;
    gap:8px;
    padding:10px;
    border:1px solid #d8e4f4;
    border-radius:14px;
    background:#f8fbff;
}

.directory-warehouse-group.inactive{
    background:#f7f9fc;
    border-color:#e1e7ef;
}

.directory-warehouse-head{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:38px;
}

.directory-warehouse-main{
    display:flex;
    align-items:center;
    gap:8px;
    flex:1;
    min-height:34px;
    padding:0 10px;
    border:none;
    border-radius:10px;
    background:transparent;
    color:#111827;
    font-size:14px;
    font-weight:700;
    text-align:left;
    cursor:pointer;
}

.directory-warehouse-main:hover,
.directory-warehouse-main:focus-visible{
    background:rgba(59, 130, 246, 0.08);
    outline:none;
}

.directory-warehouse-categories{
    display:grid;
    gap:8px;
}

.directory-storage-layout{
    display:grid;
    grid-template-columns:minmax(288px, 25.6%) minmax(620px, 1fr);
    grid-template-rows:42px auto;
    grid-template-areas:
        "toolbar detail-head"
        "tree detail";
    column-gap:14px;
    row-gap:10px;
    align-items:flex-start;
    margin-top:0;
}

.directory-storage-toolbar{
    grid-area:toolbar;
    height:42px;
    min-height:42px;
    align-content:center;
}

.directory-storage-tree{
    grid-area:tree;
    display:grid;
    gap:2px;
    align-content:start;
    min-width:0;
    min-height:260px;
    border:1px solid #d8e4f4;
    border-radius:14px;
    background:#fbfdff;
    padding:8px;
}

.directory-storage-tree-row{
    display:flex;
    align-items:center;
    gap:8px;
    width:100%;
    min-width:0;
    height:34px;
    min-height:34px;
    padding:0 8px 0 calc(8px + var(--tree-level, 0) * 18px);
    border:none;
    border-radius:8px;
    background:transparent;
    color:#1f2937;
    font-size:13px;
    line-height:1;
    text-align:left;
    cursor:pointer;
    box-sizing:border-box;
}

.directory-storage-tree-row:hover,
.directory-storage-tree-row.active{
    background:#eaf2ff;
}

.directory-storage-tree-row:focus{
    outline:none;
}

.directory-storage-tree-row.inactive{
    color:#667085;
}

.directory-storage-tree-title{
    flex:1;
    min-width:0;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:700;
    line-height:1;
}

.directory-storage-tree-caret{
    flex:0 0 12px;
    width:12px;
    color:#667085;
}

.directory-storage-tree-kind,
.directory-storage-tree-count{
    flex-shrink:0;
    min-width:20px;
    height:20px;
    padding:0 6px;
    border-radius:999px;
    background:#fff;
    color:#475467;
    font-size:11px;
    font-weight:700;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.directory-storage-detail{
    grid-area:detail;
    display:grid;
    gap:10px;
    min-width:0;
    min-height:0;
    align-content:start;
}

.directory-storage-content-search{
    width:360px;
    min-width:240px;
    max-width:360px;
}

.directory-storage-detail-head{
    grid-area:detail-head;
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    justify-content:flex-start;
    gap:12px;
    height:42px;
    min-height:42px;
    margin-top:0;
    margin-bottom:0;
}

.directory-storage-detail-head h4{
    margin:0;
    color:#111827;
    font-size:18px;
    line-height:1;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.directory-storage-breadcrumb{
    display:flex;
    align-items:center;
    gap:4px;
    overflow:hidden;
    min-width:0;
}

.directory-storage-breadcrumb-link{
    background:none;
    border:none;
    padding:0;
    font-size:15px;
    font-weight:600;
    color:#3b82f6;
    cursor:pointer;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:none;
}

.directory-storage-breadcrumb-link:hover{
    text-decoration:underline;
}

.directory-storage-breadcrumb-sep{
    color:#9ca3af;
    font-size:14px;
    flex-shrink:0;
}

.directory-storage-breadcrumb-current{
    font-size:15px;
    font-weight:700;
    color:#111827;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:none;
}

.directory-storage-detail-head p{
    margin:4px 0 0;
    color:#667085;
    font-size:13px;
}

.directory-storage-detail-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.directory-storage-head-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
}

.directory-storage-actions-wrap,
.directory-storage-columns-wrap{
    position:relative;
}

.directory-storage-toolbar-btn,
.directory-storage-toolbar-icon-btn{
    height:30px;
    border:1px solid #cad5e6;
    border-radius:4px;
    background:#fff;
    color:#1d2c42;
    font-size:12px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.directory-storage-toolbar-btn.active,
.directory-storage-toolbar-icon-btn.active{
    border-color:#2d72f7;
    box-shadow:0 0 0 2px rgba(45,114,247,0.12);
}

.directory-storage-toolbar-btn{
    padding:0 10px;
}

.directory-storage-toolbar-icon-btn{
    width:40px;
    padding:0;
}

.directory-storage-actions-menu{
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    z-index:25;
    width:200px;
    padding:6px 0;
    border:1px solid #dce3ee;
    border-radius:8px;
    background:#fff;
    box-shadow:0 10px 26px rgba(31,47,70,0.14);
}

.directory-storage-actions-menu button{
    width:100%;
    height:27px;
    border:none;
    background:transparent;
    padding:0 10px;
    color:#2a394d;
    font-size:13px;
    text-align:left;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:8px;
}

.directory-storage-actions-menu button:hover{
    background:#eaf2ff;
}

.directory-storage-action-icon{
    width:18px;
    color:#2a394d;
    font-size:15px;
    line-height:1;
    text-align:center;
    flex:0 0 18px;
}

.directory-storage-columns-menu{
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    z-index:25;
    width:200px;
    padding:8px 0;
    border:1px solid #dce3ee;
    border-radius:8px;
    background:#fff;
    box-shadow:0 10px 26px rgba(31,47,70,0.14);
}

.directory-storage-columns-menu label{
    height:24px;
    padding:0 10px;
    display:flex;
    align-items:center;
    gap:8px;
    color:#2a394d;
    font-size:13px;
    cursor:pointer;
}

.directory-storage-columns-menu label:hover{
    background:#eaf2ff;
}

.directory-storage-columns-menu input{
    width:14px;
    height:14px;
    accent-color:#2d72f7;
}

.directory-storage-table-wrap{
    overflow-x:auto;
    overflow-y:visible;
    border:1px solid #d8e4f4;
    border-radius:12px;
    align-self:start;
    min-height:0;
}

.directory-storage-table{
    width:100%;
    border-collapse:collapse;
    min-width:1200px;
    table-layout:fixed;
}

.directory-storage-table th,
.directory-storage-table td{
    padding:10px 8px;
    border-bottom:1px solid #e5edf7;
    border-right:1px solid #e5edf7;
    color:#1f2937;
    font-size:12px;
    text-align:left;
    vertical-align:middle;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.directory-storage-table th{
    position:relative;
    background:#f3f6fb;
    color:#475467;
    font-weight:500;
    line-height:1.25;
    user-select:none;
}

.directory-storage-table tr.directory-storage-row-selected td{
    background:#eef5ff;
}

.directory-storage-table thead tr:first-child th{
    height:38px;
}

.directory-storage-table th[draggable="true"]{
    cursor:grab;
}

.directory-storage-table th[draggable="true"]:active{
    cursor:grabbing;
}

.directory-storage-table th.dragging{
    opacity:.55;
}

.directory-storage-th-content{
    display:flex;
    align-items:center;
    min-width:0;
    width:100%;
    height:100%;
}

.directory-storage-th-title{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.directory-storage-col-resizer{
    position:absolute;
    top:0;
    right:-3px;
    z-index:2;
    width:7px;
    height:100%;
    cursor:col-resize;
}

.directory-storage-col-resizer::after{
    content:"";
    position:absolute;
    top:8px;
    right:3px;
    bottom:8px;
    width:1px;
    background:transparent;
}

.directory-storage-col-resizer:hover::after,
body.directory-storage-resizing .directory-storage-col-resizer::after{
    background:#2d72f7;
}

body.directory-storage-resizing{
    cursor:col-resize;
    user-select:none;
}

.directory-storage-check-col{
    width:34px;
    text-align:center !important;
}

.directory-storage-check-col input{
    width:14px;
    height:14px;
}

.directory-storage-name-col{
    background:#d9dcdf !important;
}

.directory-storage-sort-icon{
    float:right;
    color:#a5afbd;
    font-size:11px;
    margin-left:6px;
}

.directory-storage-item-name{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
}

.directory-storage-image-cell{
    text-align:center;
}

.directory-storage-image-cell img{
    display:inline-block;
    width:34px;
    height:34px;
    object-fit:contain;
    vertical-align:middle;
}

.directory-storage-table tr:last-child td{
    border-bottom:none;
}

.directory-storage-table tbody tr:hover{
    background:#f8fbff;
}

.directory-table-action{
    border:none;
    background:transparent;
    color:#1269e8;
    font-size:12px;
    font-weight:700;
    cursor:pointer;
}

.directory-storage-empty{
    color:#667085;
    text-align:center;
}

.directory-storage-pagination{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:12px;
    color:#475467;
    font-size:12px;
}

.directory-storage-page-summary{
    margin-right:auto;
}

.directory-storage-bulkbar{
    display:none;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:4px 0 0;
    width:100%;
}

.directory-storage-bulkbar.show{
    display:flex;
}

.directory-storage-bulk-left{
    display:inline-flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.directory-storage-bulk-actions-wrap{
    position:relative;
}

.directory-storage-bulk-btn{
    min-height:29px;
    padding:5px 12px;
    border:1px solid #cfd6df;
    border-radius:3px;
    background:#fff;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    cursor:pointer;
}

.directory-storage-bulk-btn:hover,
.directory-storage-bulk-btn.active{
    background:#f5f7fa;
    color:#1f2937;
}

.directory-storage-bulk-actions-menu{
    left:0;
    right:auto;
    bottom:calc(100% + 6px);
    top:auto;
}

.directory-storage-bulk-count{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
}

.directory-storage-bulk-clear{
    width:17px;
    height:17px;
    min-height:17px;
    padding:0;
    border:none;
    border-radius:999px;
    background:#c7cbd1;
    color:#fff;
    font-size:12px;
    line-height:1;
    cursor:pointer;
}

.directory-storage-bulk-clear:hover{
    background:#9ca3af;
    color:#fff;
}

.directory-storage-move-note{
    color:#667085;
    font-size:13px;
}

.directory-storage-bulk-delete{
    display:none;
    width:50px;
    height:34px;
    margin-left:auto;
    border:none;
    border-radius:4px;
    background:#ff1f1f;
    color:#fff;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.directory-storage-bulk-delete.show{
    display:inline-flex;
}

.directory-storage-bulk-delete:hover{
    background:#e51515;
}

.directory-storage-bulk-delete:disabled{
    cursor:default;
    opacity:.55;
}

.directory-storage-bulk-delete svg{
    width:18px;
    height:18px;
    fill:currentColor;
}

.directory-storage-page-size{
    display:inline-flex;
    align-items:center;
    gap:8px;
}

.directory-storage-page-size select{
    height:30px;
    border:1px solid #cad5e6;
    border-radius:6px;
    background:#fff;
    color:#1d2c42;
    font-size:12px;
    padding:0 8px;
}

.directory-storage-page-buttons{
    display:inline-flex;
    align-items:center;
    gap:8px;
}

.directory-storage-page-buttons button{
    width:30px;
    height:30px;
    border:1px solid #cad5e6;
    border-radius:6px;
    background:#fff;
    color:#1d2c42;
    font-size:16px;
    line-height:1;
    cursor:pointer;
}

.directory-storage-page-buttons button:disabled{
    cursor:default;
    opacity:.45;
}

@media (max-width: 1100px){
    .device-catalog-grid{
        grid-template-columns:repeat(2, minmax(220px, 1fr));
    }
}

@media (max-width: 900px){
    .directory-storage-layout{
        grid-template-columns:1fr;
        grid-template-areas:
            "toolbar"
            "detail-head"
            "tree"
            "detail";
    }

    .directory-storage-detail-head{
        grid-template-columns:1fr;
    }

    .directory-storage-content-search{
        width:100%;
        max-width:none;
    }
}

@media (max-width: 720px){
    .device-catalog-grid{
        grid-template-columns:1fr;
    }
}

.directory-chip:hover{
    background:#f1f6ff;
    border-color:#c9d7ea;
}

.directory-chip-reorderable{
    cursor:grab;
}

.directory-chip-reorderable:active{
    cursor:grabbing;
}

.directory-chip.dragging{
    opacity:.55;
}

.directory-chip.drag-over{
    background:#eaf2ff;
    border-color:#2d72f7;
    box-shadow:inset 0 0 0 1px rgba(45, 114, 247, 0.35);
}

.directory-chip.inactive{
    background:#f7f9fc;
    border-color:#e1e7ef;
}

.directory-chip-main{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex:1;
    gap:8px;
    min-height:34px;
    padding:0 10px;
    border-radius:10px;
    background:transparent;
    color:#1f2937;
    font-size:14px;
    font-weight:600;
    text-align:left;
    border:none;
    outline:none;
    box-shadow:none;
    transition:background .18s ease, color .18s ease;
    cursor:pointer;
}

.directory-chip:hover .directory-chip-main,
.directory-chip:focus-within .directory-chip-main{
    background:rgba(59, 130, 246, 0.08);
}

.directory-chip-main:focus-visible{
    background:rgba(59, 130, 246, 0.1);
}

.directory-chip.inactive .directory-chip-main{
    color:#667085;
}

.directory-chip-count{
    min-width:22px;
    height:22px;
    padding:0 6px;
    border-radius:999px;
    background:#ffffff;
    color:#475467;
    font-size:12px;
    font-weight:700;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.directory-chip-state{
    padding:2px 8px;
    border-radius:999px;
    background:#ffffff;
    color:#7a271a;
    font-size:11px;
    font-weight:700;
    margin-left:auto;
}

.directory-chip-actions{
    display:flex;
    align-items:center;
    gap:4px;
    opacity:0;
    pointer-events:none;
    transition:opacity .16s ease;
}

.directory-chip:hover .directory-chip-actions,
.directory-chip:focus-within .directory-chip-actions{
    opacity:1;
    pointer-events:auto;
}

.directory-chip-action{
    min-width:28px;
    height:28px;
    padding:0 8px;
    border-radius:999px;
    border:1px solid #d6deea;
    background:#fff;
    color:#475467;
    font-size:11px;
    font-weight:700;
}

.directory-chip-action.danger{
    color:#b42318;
}

.directory-chip-editor,
.directory-chip-creator{
    width:100%;
    min-width:0;
    padding:7px 10px;
    background:#f8fbff;
    border-style:dashed;
}

.directory-chip-input{
    width:100%;
    min-height:30px;
    border:none;
    outline:none;
    background:transparent;
    padding:0 4px;
    color:#111827;
    font-size:14px;
}

.directory-item-dialog{
    max-width:560px;
}

.directory-item-dialog-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.directory-item-dialog-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    margin-left:auto;
}

.directory-panel-empty{
    display:grid;
    gap:8px;
    padding:18px;
    border:1px dashed #d6deea;
    border-radius:16px;
    background:#fcfdff;
    color:#667085;
}

.directory-panel-empty.compact{
    min-width:260px;
    max-width:360px;
}

.directory-panel-empty strong{
    color:#111827;
    font-size:15px;
}

.directory-screen-error{
    display:grid;
    gap:10px;
    padding:18px;
    border:1px solid #f2c9c9;
    border-radius:16px;
    background:#fff7f7;
    color:#7a271a;
}

.finance-settings-grid{
    max-width:720px;
}

.finance-settings-card{
    min-height:112px;
    align-items:flex-start;
}

.finance-settings-card-meta{
    display:inline-flex;
    width:max-content;
    margin-top:6px;
    border:1px solid #dbe4f0;
    border-radius:999px;
    padding:3px 9px;
    color:#475569;
    font-size:12px;
}

.finance-price-settings-card{
    max-width:920px;
    border:1px solid #d9e2f1;
    border-radius:12px;
    background:#fff;
    overflow:hidden;
}

.finance-payment-settings-card{
    max-width:980px;
    border:1px solid #d9e2f1;
    border-radius:12px;
    background:#fff;
    overflow:hidden;
}

.general-settings-screen .directories-step-shell{
    gap:18px;
}

.general-settings-card{
    width:100%;
    max-width:980px;
    border:1px solid #d9e2f1;
    border-radius:12px;
    background:#fff;
    overflow:hidden;
    box-shadow:0 10px 28px rgba(15,23,42,0.05);
}

.general-settings-card-muted{
    border-style:dashed;
    background:#f8fafc;
}

.general-settings-card-head{
    width:100%;
    min-height:78px;
    padding:16px 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    border-bottom:1px solid #cdd9eb;
    background:linear-gradient(180deg, #f8fafc 0%, #eef4fb 100%);
}

.general-settings-card-toggle{
    border-width:0 0 1px;
    border-style:solid;
    border-color:#cdd9eb;
    color:inherit;
    font:inherit;
    text-align:left;
    cursor:pointer;
}

.general-settings-card-toggle:hover{
    background:linear-gradient(180deg, #fbfdff 0%, #eaf3ff 100%);
}

.general-settings-card-toggle:focus-visible{
    outline:2px solid #2563eb;
    outline-offset:-2px;
}

.general-settings-card-muted .general-settings-card-head{
    border-bottom:none;
    background:transparent;
}

.general-settings-card-head h3{
    margin:4px 0 5px;
    color:#111827;
    font-size:18px;
    font-weight:800;
    line-height:1.25;
}

.general-settings-card-head p{
    margin:0;
    color:#667085;
    font-size:12px;
    line-height:1.35;
}

.general-settings-card-kicker{
    display:inline-flex;
    align-items:center;
    min-height:20px;
    padding:2px 8px;
    border:1px solid #cbd5e1;
    border-radius:999px;
    background:#fff;
    color:#475569;
    font-size:11px;
    font-weight:700;
    line-height:1;
}

.general-settings-card-chevron{
    flex:0 0 auto;
    width:34px;
    height:34px;
    border:1px solid #cbd5e1;
    border-radius:999px;
    background:#fff;
    position:relative;
}

.general-settings-card-chevron::before{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:8px;
    height:8px;
    border-right:2px solid #334155;
    border-bottom:2px solid #334155;
    transform:translate(-50%, -64%) rotate(45deg);
    transition:transform .16s ease;
}

.general-settings-card.is-collapsed .general-settings-card-chevron::before{
    transform:translate(-64%, -50%) rotate(-45deg);
}

.general-settings-options{
    display:grid;
    gap:0;
    padding:6px 0;
}

.general-settings-card.is-collapsed .general-settings-options{
    display:none;
}

.general-settings-option{
    position:relative;
    min-height:66px;
    padding:12px 18px 12px 20px;
    display:grid;
    grid-template-columns:18px minmax(0, 1fr);
    align-items:flex-start;
    gap:12px;
    border-top:1px solid #edf2f7;
    background:#fff;
    cursor:pointer;
}

.general-settings-option:first-child{
    border-top:none;
}

.general-settings-option.is-active{
    background:#f1f7ff;
}

.general-settings-option.is-active::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:4px;
    background:#2563eb;
}

.general-settings-option input{
    margin-top:2px;
}

.general-settings-option span{
    min-width:0;
    display:grid;
    gap:4px;
}

.general-settings-option strong{
    color:#10233f;
    font-size:13px;
    font-weight:700;
    line-height:1.3;
}

.general-settings-option small{
    color:#64748b;
    font-size:12px;
    line-height:1.35;
}

.finance-category-settings-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    width:100%;
    max-width:none;
}

.finance-category-settings-card{
    width:100%;
    border:1px solid #d9e2f1;
    border-radius:12px;
    background:#fff;
    overflow:hidden;
}

.finance-category-settings-title{
    min-height:58px;
    padding:10px 12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border-bottom:1px solid #d8e3f2;
}

.finance-category-settings-title h3{
    margin:0;
    color:#111827;
    font-size:16px;
    line-height:1.25;
}

.finance-category-settings-title span{
    color:#667085;
    font-size:12px;
}

.finance-price-settings-head,
.finance-price-settings-row,
.finance-payment-settings-head,
.finance-payment-settings-row,
.finance-category-settings-head,
.finance-category-settings-row{
    display:grid;
    align-items:center;
}

.finance-price-settings-head,
.finance-price-settings-row{
    grid-template-columns:minmax(220px, 1fr) 180px 96px 110px;
}

.finance-payment-settings-head,
.finance-payment-settings-row{
    grid-template-columns:minmax(180px, 1fr) minmax(200px, 1fr) 170px 82px 110px;
}

.finance-category-settings-head,
.finance-category-settings-row{
    grid-template-columns:minmax(320px, 2fr) minmax(220px, 1fr) minmax(150px, .8fr) 92px;
}

.finance-price-settings-head,
.finance-payment-settings-head,
.finance-category-settings-head{
    min-height:36px;
    background:#f2f5f9;
    color:#334155;
    font-size:12px;
    font-weight:600;
}

.finance-price-settings-head span,
.finance-payment-settings-head span,
.finance-category-settings-head span{
    padding:0 12px;
}

.finance-price-settings-row,
.finance-payment-settings-row,
.finance-category-settings-row{
    min-height:54px;
    border-top:1px solid #d8e3f2;
    border-left:3px solid #c7d7ee;
    background:#fff;
    box-shadow:inset 0 -1px 0 #d8e3f2;
}

.finance-payment-settings-row:nth-child(even){
    background:#f3f7fd;
}

.finance-category-settings-row:nth-child(even){
    background:#f3f7fd;
}

.finance-category-settings-row.is-hidden{
    border-left-color:#cbd5e1;
    background:#f8fafc;
    opacity:.72;
}

.finance-category-settings-row.is-hidden:nth-child(even){
    background:#f1f5f9;
}

.finance-category-name-btn{
    min-width:0;
    margin:0 8px 0 12px;
    padding:0;
    border:none;
    background:transparent;
    color:#10233f;
    font-size:13px;
    font-weight:600;
    text-align:left;
    cursor:pointer;
    display:grid;
    gap:2px;
    white-space:normal;
}

.finance-category-name-btn span,
.finance-category-name-btn small{
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    line-height:1.25;
}

.finance-category-name-btn small{
    color:#64748b;
    font-size:11px;
    font-weight:500;
}

.finance-category-settings-row.is-hidden .finance-category-name-btn small{
    width:max-content;
    padding:2px 7px;
    border:1px solid #cbd5e1;
    border-radius:999px;
    background:#fff;
    color:#64748b;
}

.finance-category-name-btn:hover{
    color:#1d4ed8;
}

.finance-category-usage{
    color:#475467;
    font-size:13px;
    text-align:center;
}

.finance-category-scope{
    color:#475467;
    font-size:12px;
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    line-height:1.25;
    padding-right:12px;
}

@media (max-width: 980px){
    .finance-category-settings-card{
        overflow-x:auto;
    }

    .finance-category-settings-head,
    .finance-category-settings-row{
        min-width:860px;
        grid-template-columns:minmax(360px, 2fr) minmax(220px, 1fr) 86px;
    }
}

.finance-category-dialog-footer{
    justify-content:space-between;
}

.finance-category-dialog-left,
.finance-category-dialog-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.finance-category-empty{
    padding:14px 12px;
    border-top:1px solid #d8e3f2;
    color:#667085;
    font-size:13px;
}

.finance-price-settings-row > input,
.finance-payment-settings-row > input,
.finance-payment-settings-row > select,
.finance-price-percent-input input{
    width:100%;
    height:30px;
    border:1px solid #cbd5e1;
    border-radius:6px;
    padding:0 9px;
    color:#10233f;
    font-size:13px;
}

.finance-payment-commission-cell{
    display:grid;
    grid-template-columns:28px minmax(54px, 1fr) 54px;
    align-items:center;
    gap:6px;
    padding:0 8px;
}

.finance-payment-commission-enabled{
    display:flex;
    justify-content:center;
}

.finance-payment-commission-cell input[type="number"],
.finance-payment-commission-cell select{
    width:100%;
    height:30px;
    border:1px solid #cbd5e1;
    border-radius:6px;
    padding:0 8px;
    color:#10233f;
    font-size:13px;
}

.finance-payment-delete-btn{
    width:38px;
    height:34px;
    border:1px solid #d4deec;
    border-radius:8px;
    background:#f8fbff;
    color:#64748b;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.finance-payment-delete-btn:hover{
    border-color:#fecaca;
    background:#fff1f2;
    color:#dc2626;
}

.finance-payment-delete-btn svg{
    width:17px;
    height:17px;
    fill:currentColor;
}

.finance-price-settings-row > input,
.finance-payment-settings-row > input,
.finance-payment-settings-row > select{
    margin:0 8px 0 12px;
    width:calc(100% - 20px);
}

.finance-price-percent-input{
    display:grid;
    grid-template-columns:minmax(0, 1fr) 22px;
    align-items:center;
    padding:0 8px;
}

.finance-price-percent-input span{
    color:#64748b;
    font-size:13px;
    text-align:center;
}

.finance-price-active-check{
    display:flex;
    align-items:center;
    justify-content:center;
}

.finance-price-active-check input{
    width:16px;
    height:16px;
    accent-color:#2563eb;
}

.finance-price-settings-row .btn-light{
    justify-self:end;
    margin-right:8px;
}

/* ── Spreadsheet-маппинг импорта ─────────────────────────────────── */
.import-spreadsheet-wrap{
    width:100%;
    overflow-x:auto;
    overflow-y:visible;
    border:1px solid #d9e2f1;
    border-radius:10px;
    background:#fff;
    /* По умолчанию высота под содержимое (5 строк) */
}

/* Когда показаны все строки — занять весь экран */
.import-spreadsheet-wrap--expanded{
    overflow:auto;
    height:calc(100vh - 242px);
    min-height:300px;
}

.import-spreadsheet{
    border-collapse:collapse;
    width:max-content;
    min-width:100%;
    font-size:13px;
}

/* Общая ячейка */
.import-sp-cell{
    padding:0;
    border-right:1px solid #e5eaf4;
    border-bottom:1px solid #e5eaf4;
    vertical-align:middle;
    white-space:nowrap;
}
.import-sp-cell:last-child{ border-right:none; }

/* Строка 1: dropdowns — прилипает при скролле вниз (только в expanded режиме) */
.import-sp-row-select .import-sp-cell{
    background:#f4f7fd;
    padding:8px 10px;
    min-width:170px;
    max-width:240px;
}
.import-spreadsheet-wrap--expanded .import-sp-row-select .import-sp-cell{
    position:sticky;
    top:0;
    z-index:3;
}

.import-sp-select-wrap{
    display:flex;
    gap:5px;
    align-items:center;
}

.import-sp-select-wrap select{
    flex:1;
    min-width:0;
    height:32px;
    font-size:12px;
    font-weight:500;
    background:#fff;
    border:1.5px solid #c4d3ed;
    border-radius:6px;
    color:#1d2939;
    padding:0 6px;
    cursor:pointer;
}
.import-sp-select-wrap select:focus{
    border-color:#4a7eff;
    outline:none;
}

.import-sp-select-wrap .integration-import-map-more{
    width:30px;
    min-width:30px;
    height:30px;
    min-height:30px;
    font-size:14px;
    border:1.5px solid #c4d3ed;
    border-radius:6px;
    background:#fff;
    color:#344054;
    font-weight:700;
    line-height:1;
    padding:0;
    flex-shrink:0;
}
.import-sp-select-wrap .integration-import-map-more:hover{
    background:#f0f4ff;
    border-color:#4a7eff;
    color:#4a7eff;
}

/* Строка 2: названия колонок из файла — прилипает под строкой dropdowns (только expanded) */
.import-sp-row-header .import-sp-cell{
    background:#edf1fa;
    padding:6px 10px;
    font-size:11.5px;
    font-weight:700;
    color:#667085;
    letter-spacing:.01em;
    border-bottom:2px solid #d9e2f1;
}
.import-spreadsheet-wrap--expanded .import-sp-row-header .import-sp-cell{
    position:sticky;
    top:48px;   /* высота строки с dropdowns */
    z-index:2;
}

/* Строки данных */
.import-sp-data-cell{
    padding:7px 10px;
    font-size:13px;
    color:#344054;
    max-width:220px;
    overflow:hidden;
    text-overflow:ellipsis;
}

.import-sp-row-data:last-child .import-sp-cell{ border-bottom:none; }
.import-sp-row-data:hover .import-sp-data-cell{ background:#f8faff; }

/* Состояние: авто-определено (зелёное) */
.import-sp-col--detected.import-sp-select-cell{
    background:#f0fdf6;
    box-shadow:inset 0 3px 0 #22c55e;
}
.import-sp-col--detected.import-sp-select-cell select{
    border-color:#86efac;
}
.import-sp-col--detected.import-sp-col-name{
    background:#e8fdf0;
    color:#166534;
    box-shadow:inset 0 -2px 0 #22c55e;
}
.import-sp-col--detected.import-sp-data-cell{
    background:#f7fef9;
}

/* Состояние: пропустить (серое) */
.import-sp-col--skip.import-sp-select-cell{
    background:#f5f6f8;
}
.import-sp-col--skip.import-sp-select-cell select{
    color:#9aa5b8;
    border-color:#dde3ef;
}
.import-sp-col--skip.import-sp-col-name{
    background:#f0f1f5;
    color:#aab4c6;
}
.import-sp-col--skip.import-sp-data-cell{
    color:#b8c4d4;
}

/* Состояние: назначено (синяя шапка) */
.import-sp-col--mapped.import-sp-select-cell{
    background:#f0f5ff;
    box-shadow:inset 0 3px 0 #4a7eff;
}
.import-sp-col--mapped.import-sp-select-cell select{
    border-color:#93b4f8;
}
.import-sp-col--mapped.import-sp-col-name{
    background:#e8efff;
    color:#1d4ed8;
    box-shadow:inset 0 -2px 0 #4a7eff;
}

/* Badge "авто" в заголовке */
.import-sp-col-name .import-map-badge-auto{
    margin-left:5px;
    margin-top:0;
    font-size:9px;
    padding:1px 5px;
    vertical-align:middle;
}

/* Панель "показать ещё строки" */
.import-sp-more-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 14px;
    background:#f8faff;
    border:1px solid #d9e2f1;
    border-radius:8px;
    font-size:13px;
    color:#667085;
    flex-wrap:wrap;
}

.import-sp-show-all-btn{
    white-space:nowrap;
    padding:6px 14px;
    border:1.5px solid #b8c9e8;
    border-radius:7px;
    background:#fff;
    color:#344054;
    font-size:13px;
    font-weight:500;
    cursor:pointer;
}
.import-sp-show-all-btn:hover{
    border-color:#4a7eff;
    color:#4a7eff;
    background:#f0f5ff;
}

/* Панель предупреждения */
.import-sp-warning-bar{
    display:grid;
    gap:12px;
    padding:14px 16px;
    background:#fffbeb;
    border:1.5px solid #fcd34d;
    border-radius:8px;
    font-size:13px;
    color:#78350f;
}

.import-sp-warning-text{
    line-height:1.6;
}

.import-sp-warning-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.import-sp-show-all-confirm{
    padding:7px 16px;
    border:1.5px solid #f59e0b;
    border-radius:7px;
    background:#fff;
    color:#92400e;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
}
.import-sp-show-all-confirm:hover{
    background:#fef3c7;
}