.settings-nav-link { min-height: 48px; padding: 0 13px; border-radius: 10px; color: #d6e5e9; display: flex; align-items: center; gap: 12px; text-decoration: none; font-size: 13px; font-weight: 650; }.settings-nav-link:hover { color: white; background: rgba(255,255,255,.1); }.settings-nav-link span { margin-left: auto; min-width: 23px; padding: 4px 6px; border-radius: 99px; background: rgba(255,255,255,.1); color: #d7e8ed; font-size: 10px; text-align: center; }.sidebar-settings.active { color: white; background: rgba(255,255,255,.1); box-shadow: inset 3px 0 var(--admin-lime); }
.settings-content { min-width: 0; padding: 27px clamp(22px,3.3vw,52px) 45px; }.settings-breadcrumb { display: flex; gap: 9px; align-items: center; margin-bottom: 22px; color: #819299; font-size: 10px; }.settings-breadcrumb a { color: var(--admin-petrol); text-decoration: none; }.settings-breadcrumb strong { color: var(--admin-ink); }.settings-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }.settings-header h1 { margin: 0; font-size: clamp(34px,4vw,48px); line-height: 1; letter-spacing: -.045em; }.settings-header > div > p:last-child { max-width: 710px; margin: 10px 0 0; color: var(--admin-muted); font-size: 10px; line-height: 1.5; }.settings-header > button { min-height: 47px; padding: 0 16px; border: 0; border-radius: 10px; background: var(--admin-petrol); color: white; display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 9px; font-weight: 750; box-shadow: 0 9px 22px rgba(4,60,81,.17); }.settings-header > button svg { color: var(--admin-lime); }
.settings-notice { margin-bottom: 14px; padding: 12px 14px; border: 1px solid #d2dfbc; border-radius: 11px; background: #f4f8e6; display: flex; align-items: center; gap: 10px; }.settings-notice > span { width: 27px; height: 27px; flex: 0 0 auto; border-radius: 50%; background: var(--admin-lime); color: var(--admin-ink); display: grid; place-items: center; font-family: Georgia,serif; font-weight: 850; }.settings-notice p { flex: 1; margin: 0; color: #52643e; font-size: 9px; }.settings-notice button { width: 28px; height: 28px; border: 0; border-radius: 50%; background: white; color: var(--admin-ink); cursor: pointer; font-size: 17px; }
.connection-overview { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; margin-bottom: 15px; }.connection-overview article { min-height: 94px; padding: 15px; border: 1px solid var(--admin-line); border-radius: 14px; background: white; display: grid; grid-template-columns: 43px 1fr auto; gap: 11px; align-items: center; box-shadow: 0 7px 22px rgba(8,44,61,.04); }.service-logo { width: 43px; height: 43px; flex: 0 0 auto; border-radius: 11px; display: grid; place-items: center; font-weight: 900; font-size: 17px; }.service-logo.monday { background: linear-gradient(135deg,#f53c4d,#ee822b); color: white; }.service-logo.drive { background: #e9f3ed; color: var(--admin-green); }.service-logo.secure { background: #e7f1f4; color: var(--admin-petrol); }.connection-overview small,.connection-overview strong { display: block; }.connection-overview small { color: #84959b; font-size: 7px; text-transform: uppercase; letter-spacing: .07em; }.connection-overview strong { margin-top: 4px; font-size: 11px; }.connection-overview p { margin: 4px 0 0; color: var(--admin-muted); font-size: 7px; }.connection-overview em { padding: 5px 7px; border-radius: 99px; background: #fff0de; color: #a56210; font-size: 7px; font-style: normal; font-weight: 750; }.connection-overview em.ready { background: #e2f3e7; color: var(--admin-green); }
.settings-layout { display: grid; grid-template-columns: 225px minmax(0,1fr); gap: 14px; align-items: start; }.settings-tabs { padding: 7px; border: 1px solid var(--admin-line); border-radius: 14px; background: white; display: grid; gap: 4px; box-shadow: 0 7px 22px rgba(8,44,61,.04); }.settings-tabs button { min-height: 62px; padding: 9px 10px; border: 0; border-radius: 9px; background: transparent; color: var(--admin-muted); display: grid; grid-template-columns: 24px 1fr; gap: 8px; align-items: center; text-align: left; cursor: pointer; }.settings-tabs button.active { background: #eaf4f4; color: var(--admin-petrol); }.settings-tabs button > svg { width: 18px; height: 18px; }.settings-tabs strong,.settings-tabs small { display: block; }.settings-tabs strong { font-size: 9px; }.settings-tabs small { margin-top: 4px; color: #84969c; font-size: 7px; }.settings-panel { min-width: 0; border: 1px solid var(--admin-line); border-radius: 14px; background: white; box-shadow: 0 7px 22px rgba(8,44,61,.04); overflow: hidden; }.connections-form,.columns-contract,.drive-contract { padding: 22px; }.settings-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 17px; }.settings-section-heading > div { display: flex; align-items: center; gap: 11px; }.settings-section-heading h2 { margin: 0; font-size: 15px; }.settings-section-heading p { margin: 4px 0 0; color: var(--admin-muted); font-size: 8px; line-height: 1.4; }.settings-section-heading > a { color: var(--admin-petrol); display: flex; align-items: center; gap: 5px; white-space: nowrap; text-decoration: none; font-size: 7px; font-weight: 700; }.settings-section-heading > a svg { width: 13px; height: 13px; }
.config-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.config-grid label { display: grid; gap: 5px; color: #526a73; font-size: 8px; font-weight: 750; }.config-grid label.wide { grid-column: 1 / -1; }.config-grid input { width: 100%; min-height: 40px; padding: 0 10px; border: 1px solid #cad7d6; border-radius: 8px; background: white; color: var(--admin-ink); font-size: 9px; outline: 0; }.config-grid input:focus { border-color: var(--admin-petrol); box-shadow: 0 0 0 3px #e7f1f3; }.config-grid label small { color: #8a9aa0; font-size: 7px; font-weight: 500; }.secret-placeholder { min-height: 57px; padding: 10px; border: 1px dashed #afc6c8; border-radius: 9px; background: #f7faf9; display: grid; grid-template-columns: 30px 1fr auto; gap: 9px; align-items: center; }.secret-placeholder > svg { width: 19px; color: var(--admin-green); }.secret-placeholder strong { font-size: 8px; }.secret-placeholder p { margin: 3px 0 0; color: var(--admin-muted); font-size: 7px; line-height: 1.35; }.secret-placeholder > span { padding: 4px 6px; border-radius: 99px; background: #e5f2ed; color: var(--admin-green); font-size: 6px; font-weight: 800; text-transform: uppercase; }.settings-divider { height: 1px; margin: 24px 0 20px; background: var(--admin-line); }
.contract-version { padding: 5px 8px; border-radius: 99px; background: #e7f3ef; color: var(--admin-green); font-size: 7px; font-weight: 800; text-transform: uppercase; }.column-table { border: 1px solid var(--admin-line); border-radius: 10px; overflow: hidden; }.column-head,.column-table article { min-height: 40px; padding: 0 11px; display: grid; grid-template-columns: 1.2fr 1fr .6fr .65fr; gap: 9px; align-items: center; }.column-head { background: #f2f6f5; color: #7e9097; text-transform: uppercase; letter-spacing: .06em; font-size: 6px; font-weight: 800; }.column-table article { border-top: 1px solid #e7eceb; font-size: 8px; }.column-table article strong { font-size: 8px; }.column-table code { color: var(--admin-petrol); font-family: ui-monospace,monospace; font-size: 7px; }.type-pill { justify-self: start; padding: 4px 6px; border-radius: 5px; background: #eaf2f4; color: var(--admin-petrol); font-size: 6px; font-weight: 700; }.column-table .required,.column-table .optional { font-size: 7px; }.column-table .required { color: var(--admin-green); font-weight: 750; }.column-table .optional { color: #8a9ba1; }.status-contract { margin-top: 17px; }.status-contract h3 { margin: 0 0 9px; font-size: 10px; }.status-contract > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.status-contract article { padding: 10px; border: 1px solid var(--admin-line); border-radius: 8px; background: #fafcfa; }.status-contract strong { font-size: 8px; }.status-contract p { margin: 4px 0 0; color: var(--admin-muted); font-size: 7px; line-height: 1.35; }
.drive-tree { padding: 16px; border: 1px solid var(--admin-line); border-radius: 11px; background: #fafcfa; }.tree-root,.tree-branch > div:first-child,.tree-case { min-height: 42px; padding: 0 11px; border: 1px solid #cfdbda; border-radius: 8px; background: white; display: grid; grid-template-columns: 23px 1fr auto; gap: 7px; align-items: center; }.tree-root > svg,.tree-branch svg { color: var(--admin-green); }.tree-root strong,.tree-branch strong { font-size: 8px; }.tree-root span,.tree-branch span { color: #85969c; font-size: 6px; }.tree-branch { margin: 9px 0 0 26px; padding-left: 17px; border-left: 1px solid #bdcdcc; position: relative; }.tree-branch::before { content: ""; position: absolute; left: 0; top: 21px; width: 17px; height: 1px; background: #bdcdcc; }.tree-case { margin: 8px 0 0 25px; grid-template-columns: 23px 1fr; }.subfolder-list { margin: 7px 0 0 50px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }.subfolder-list span { min-height: 28px; padding: 0 8px; border: 1px solid #e0e7e6; border-radius: 6px; background: white; display: flex; align-items: center; gap: 6px; color: #556c75; font-size: 6px; }.subfolder-list svg { width: 12px; height: 12px; }.tree-branch.compact { margin-top: 11px; }.creation-sequence { margin-top: 17px; }.creation-sequence h3 { margin: 0 0 9px; font-size: 10px; }.creation-sequence > div { display: flex; align-items: stretch; gap: 7px; }.creation-sequence article { flex: 1; padding: 10px; border: 1px solid var(--admin-line); border-radius: 8px; background: white; position: relative; }.creation-sequence article span { position: absolute; right: 7px; top: 5px; color: #dce3e2; font-size: 16px; font-weight: 850; }.creation-sequence article strong { font-size: 8px; }.creation-sequence article p { margin: 4px 0 0; color: var(--admin-muted); font-size: 7px; }.creation-sequence b { align-self: center; color: var(--admin-lime); font-size: 15px; }
@media (max-width: 1050px) { .connection-overview { grid-template-columns: 1fr; }.settings-layout { grid-template-columns: 1fr; }.settings-tabs { grid-template-columns: repeat(3,1fr); }.settings-tabs button { grid-template-columns: 20px 1fr; }.creation-sequence > div { flex-wrap: wrap; }.creation-sequence article { min-width: 40%; }.creation-sequence b { display: none; } }
@media (max-width: 780px) { .settings-content { padding: 21px 14px 35px; }.settings-header { align-items: flex-start; flex-direction: column; }.settings-header > button { width: 100%; justify-content: center; }.settings-tabs { grid-template-columns: 1fr; }.connections-form,.columns-contract,.drive-contract { padding: 16px 12px; }.settings-section-heading { align-items: flex-start; flex-direction: column; }.config-grid { grid-template-columns: 1fr; }.config-grid label.wide { grid-column: auto; }.column-table { overflow-x: auto; }.column-head,.column-table article { min-width: 650px; }.subfolder-list { grid-template-columns: 1fr; margin-left: 24px; }.creation-sequence article { min-width: 100%; }.status-contract > div { grid-template-columns: 1fr; } }
