/* Портал разработчиков: поверх style.css АИС «Школа» */

:root{
    /* имена токенов Hub — на них написан общий блок статистики входов */
    --mut:var(--text-muted);
    --dim:#a5acbf;
    --line:var(--border);
    --line2:#dfe3ef;
    --card:var(--surface);
    --txt:var(--text);
    --acc:var(--primary);
    --acc2:var(--primary-hover);
    --accSoft:var(--primary-soft);
    --bg2:#f1f3f9;
    --shUp:var(--shadow);
    /* ширина шапки из style.css — та же, что у содержимого */
    --container:1100px;
}

.dp-main{
    flex:1;
    width:min(var(--container),calc(100% - 48px));
    margin:32px auto 64px;
}

.dp-nav{
    display:flex;
    align-items:center;
    gap:4px;
    margin-left:24px;
}

.dp-nav form{margin:0}

.dp-user{
    font-size:13px;
    color:var(--text-muted);
    margin-right:6px;
    white-space:nowrap;
}

.dp-head{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:22px;
}

.dp-head h1{
    font-size:26px;
}

.dp-head p{
    margin:4px 0 0;
    color:var(--text-light);
    font-size:14px;
}

.dp-head-actions{
    margin-left:auto;
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.dp-crumb{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-bottom:10px;
    font-size:13px;
    color:var(--text-muted);
    font-weight:600;
}

.dp-crumb:hover{color:var(--primary)}

.dp-alert{
    margin-bottom:16px;
    align-items:center;
    padding:12px 14px;
}

.dp-alert span{color:var(--text);font-size:14px}
.dp-alert i{margin-top:0}

/* ---------- значок приложения ---------- */

.dp-mark{
    width:44px;
    height:44px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:var(--primary-soft);
    color:var(--primary);
    font-weight:700;
    font-size:18px;
}

img.dp-mark{
    object-fit:contain;
    background:#fff;
    border:1px solid var(--border);
}

.dp-mark.lg{width:56px;height:56px;border-radius:15px;font-size:22px}

/* ---------- список приложений ---------- */

.dp-list{display:grid;gap:10px}

.dp-app{
    display:flex;
    align-items:center;
    gap:14px;
    padding:16px 18px;
    color:inherit;
    transition:var(--transition-fast);
}

.dp-app:hover{border-color:#d3d8eb;box-shadow:var(--shadow);color:inherit}

.dp-app-main{flex:1;min-width:0}
.dp-app-main strong{display:block;font-size:15px}

.dp-app-main code{
    display:block;
    margin-top:2px;
    font-size:12px;
    color:var(--text-muted);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.dp-chip{
    display:inline-flex;
    align-items:center;
    padding:4px 10px;
    border-radius:var(--radius-round);
    background:var(--surface-3);
    border:1px solid var(--border);
    font-size:12px;
    font-weight:600;
    color:var(--text-light);
    white-space:nowrap;
}

.dp-chip.wait{background:#fff8e8;border-color:#f6e6b6;color:#9a6b07}
.dp-chip.bad{background:#fdecec;border-color:#f8d4d6;color:var(--danger)}
.dp-chip.ok{background:#eefaf2;border-color:#d9f3e5;color:#178a49}

.dp-section-title{
    margin:28px 0 12px;
    font-size:15px;
    color:var(--text-light);
}

.dp-empty{
    padding:40px 24px;
    text-align:center;
}

.dp-empty h2{font-size:18px;margin-bottom:6px}
.dp-empty p{margin:0 0 18px;color:var(--text-light)}

/* ---------- карточка приложения ---------- */

.dp-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:14px;
    margin-bottom:14px;
}

.dp-card .surface-body{padding:20px 22px}

.dp-card h2{
    font-size:16px;
    margin-bottom:12px;
}

.dp-field + .dp-field{margin-top:14px}

.dp-label{
    font-size:12.5px;
    font-weight:600;
    color:var(--text-muted);
    margin-bottom:6px;
}

.dp-copy{
    display:flex;
    gap:8px;
    align-items:stretch;
}

.dp-copy input{
    flex:1;
    min-width:0;
    min-height:42px;
    font:600 13.5px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
    background:var(--surface-2);
}

.dp-copy .btn{min-height:42px}

.dp-secret{
    margin-bottom:16px;
    padding:16px 18px;
    border:1px solid #f6e6b6;
    border-radius:var(--radius);
    background:#fffbef;
}

.dp-secret strong{display:block;margin-bottom:4px}
.dp-secret p{margin:0 0 10px;font-size:13.5px;color:var(--text-light)}

.dp-kv{margin:0;display:grid;gap:12px}
.dp-kv dt{font-size:12.5px;font-weight:600;color:var(--text-muted)}
.dp-kv dd{margin:3px 0 0;font-size:14px;word-break:break-word}
.dp-kv ul{margin:0;padding-left:18px}

.dp-pending{
    margin-bottom:14px;
    padding:14px 18px;
    border-radius:var(--radius);
    border:1px solid #f6e6b6;
    background:#fff8e8;
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
}

.dp-pending span{flex:1;min-width:200px;font-size:14px}
.dp-pending form{margin:0}

.dp-history{margin:0;padding:0;list-style:none}
.dp-history li{padding:10px 0;border-top:1px solid var(--border);font-size:13.5px}
.dp-history li:first-child{border-top:0;padding-top:0}
.dp-history .when{color:var(--text-muted);font-size:12.5px}
.dp-history .note{margin-top:4px;color:var(--text-light)}

.dp-seg{
    display:inline-flex;
    padding:3px;
    border-radius:12px;
    background:var(--surface-3);
    border:1px solid var(--border);
}

.dp-seg a{
    padding:6px 12px;
    border-radius:9px;
    font-size:13px;
    font-weight:600;
    color:var(--text-light);
}

.dp-seg a.on{background:#fff;color:var(--text);box-shadow:var(--shadow-xs)}

.dp-stats-head{
    display:flex;
    align-items:center;
    gap:12px;
    margin:26px 0 12px;
}

.dp-stats-head h2{font-size:18px}
.dp-stats-head .dp-seg{margin-left:auto}

/* блок статистики использует .card */
.card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-xs);
}

.hint{font-size:13px;color:var(--text-muted)}

/* ---------- форма приложения ---------- */

.dp-form .surface-body{padding:24px}
.dp-form .form{gap:22px}

.dp-logo-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.dp-logo-row input[type=file]{font-size:13px}
.dp-check{display:flex;gap:8px;align-items:center;font-size:13.5px;color:var(--text-light)}

.dp-scopes{display:grid;gap:8px}

.dp-option{
    display:flex;
    gap:11px;
    align-items:flex-start;
    padding:12px 14px;
    border:1px solid var(--border);
    border-radius:13px;
    cursor:pointer;
    transition:var(--transition-fast);
}

.dp-option:hover{border-color:#d3d8eb}
.dp-option:has(input:checked){border-color:#b9caf5;background:#f7f9ff}
.dp-option input{margin-top:3px;accent-color:var(--primary)}
.dp-option strong{display:block;font-size:14px}
.dp-option small{display:block;margin-top:2px;font-size:12.5px;color:var(--text-light)}

.dp-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}

.dp-form-actions{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- заявка ---------- */

.dp-diff{width:100%;border-collapse:collapse;font-size:14px}
.dp-diff td{padding:10px 0;border-top:1px solid var(--border);vertical-align:top;white-space:pre-line;word-break:break-word}
.dp-diff tr:first-child td{border-top:0}
.dp-diff td:first-child{width:34%;color:var(--text-muted);padding-right:12px}

@media (max-width:860px){
    .dp-grid,.dp-two{grid-template-columns:minmax(0,1fr)}
}

@media (max-width:640px){
    .dp-main{margin-top:20px;width:calc(100% - 24px)}
    .dp-head{flex-wrap:wrap}
    .dp-head h1{font-size:22px}
    .dp-head-actions{margin-left:0;width:100%}
    .dp-nav{margin-left:auto}
    .dp-user{display:none}
    .dp-stats-head{flex-wrap:wrap}
    .dp-stats-head .dp-seg{margin-left:0}
    .dp-app{flex-wrap:wrap}
}