/* ==========================================================================
   Hidrologi.net — Academic Data & Future Engineer Pipeline
   Modern v2.10.0
   ========================================================================== */

.dr-page{
    background:var(--mv28-page,#f4f7fb);
}

.dr-main{
    min-height:65vh;
    padding-top:18px;
}

.dr-container{
    width:min(var(--mv28-container,1160px),calc(100% - 36px));
    margin:0 auto;
}

.dr-cover{
    width:min(var(--mv28-container,1160px),calc(100% - 36px));
    margin:0 auto;
    overflow:hidden;
    border-radius:12px;
    color:#fff;
    background:
        radial-gradient(circle at 88% 9%,rgba(38,185,161,.25),transparent 29%),
        radial-gradient(circle at 10% 100%,rgba(52,159,231,.18),transparent 28%),
        linear-gradient(135deg,#07385f 0%,#07599d 61%,#0b7582 100%);
    box-shadow:0 5px 18px rgba(31,72,107,.055);
}

.dr-cover-inner{
    min-height:270px;
    padding:36px 34px;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:30px;
}

.dr-cover-copy{
    max-width:760px;
}

.dr-kicker,
.dr-section-label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#0871ca;
    font-size:10px;
    font-weight:900;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.dr-kicker{
    color:#c1e8f1;
}

.dr-kicker::before,
.dr-section-label::before{
    content:"";
    width:18px;
    height:2px;
    background:#f58a25;
}

.dr-cover h1{
    max-width:770px;
    margin:9px 0 0;
    color:#fff;
    font-size:40px;
    line-height:1.06;
    letter-spacing:-1px;
}

.dr-cover p{
    max-width:720px;
    margin:12px 0 0;
    color:#dcebf3;
    font-size:14px;
    line-height:1.65;
}

.dr-cover-actions,
.dr-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.dr-button{
    min-height:40px;
    padding:0 15px;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    gap:7px;
    border:1px solid #d6e1ea;
    border-radius:8px;
    color:#46667e;
    background:#fff;
    font-size:11px;
    font-weight:900;
    cursor:pointer;
    text-decoration:none;
}

.dr-button svg{
    width:14px;
    height:14px;
}

.dr-button.is-primary{
    border-color:#0871ca;
    color:#fff;
    background:#0871ca;
}

.dr-button.is-orange{
    border-color:#f58a25;
    color:#fff;
    background:#f58a25;
}

.dr-button.is-cover{
    border-color:#fff;
    color:#0871ca;
    background:#fff;
}

.dr-button.is-cover-secondary{
    border-color:rgba(255,255,255,.28);
    color:#fff;
    background:rgba(255,255,255,.08);
}

.dr-summary{
    position:relative;
    z-index:3;
    margin-top:-26px;
}

.dr-summary-grid{
    width:min(var(--mv28-container,1160px),calc(100% - 70px));
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    border:1px solid #dfe7ef;
    border-radius:12px;
    background:#fff;
    box-shadow:0 7px 22px rgba(31,72,107,.075);
}

.dr-summary-grid article{
    min-width:0;
    min-height:96px;
    padding:15px 16px;
    display:grid;
    grid-template-columns:36px minmax(0,1fr);
    gap:10px;
    align-items:center;
    border-right:1px solid #e8eef3;
}

.dr-summary-grid article:last-child{
    border-right:0;
}

.dr-summary-grid article>span{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    color:#0871ca;
    background:#edf7ff;
}

.dr-summary-grid svg{
    width:18px;
    height:18px;
}

.dr-summary-grid strong,
.dr-summary-grid small{
    display:block;
}

.dr-summary-grid strong{
    color:#173e5e;
    font-size:11px;
}

.dr-summary-grid small{
    margin-top:3px;
    color:#73889a;
    font-size:8.5px;
    line-height:1.35;
}

.dr-section{
    padding:30px 0 40px;
}

.dr-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 310px;
    gap:18px;
    align-items:start;
}

.dr-stack{
    display:grid;
    gap:16px;
}

.dr-card{
    border:1px solid #dfe7ef;
    border-radius:12px;
    background:#fff;
    box-shadow:0 5px 18px rgba(31,72,107,.05);
}

.dr-card-body{
    padding:22px;
}

.dr-card h2{
    margin:8px 0 0;
    color:#173e5e;
    font-size:22px;
    line-height:1.2;
}

.dr-card h3{
    margin:0;
    color:#173e5e;
    font-size:16px;
    line-height:1.3;
}

.dr-card p{
    color:#617a8f;
    font-size:12px;
    line-height:1.65;
}

.dr-sidebar{
    position:sticky;
    top:82px;
    display:grid;
    gap:14px;
}

.dr-sidebar .dr-card-body{
    padding:18px;
}

.dr-flow{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-top:18px;
}

.dr-flow article{
    min-height:116px;
    padding:14px 10px;
    border:1px solid #e1e9ef;
    border-radius:10px;
    background:#fbfdff;
    text-align:center;
}

.dr-flow span{
    width:34px;
    height:34px;
    margin:0 auto 8px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    color:#0871ca;
    background:#edf7ff;
    font-size:11px;
    font-weight:900;
}

.dr-flow strong{
    display:block;
    color:#31556f;
    font-size:10px;
}

.dr-flow small{
    display:block;
    margin-top:4px;
    color:#7c91a1;
    font-size:8.5px;
    line-height:1.35;
}

.dr-form-section + .dr-form-section{
    margin-top:24px;
    padding-top:22px;
    border-top:1px solid #e8eef3;
}

.dr-form-section h3{
    margin-bottom:12px;
}

.dr-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px;
}

.dr-field.is-full{
    grid-column:1 / -1;
}

.dr-field label,
.dr-choice-title{
    display:block;
    margin-bottom:6px;
    color:#526e84;
    font-size:10px;
    font-weight:900;
}

.dr-field input,
.dr-field select,
.dr-field textarea{
    width:100%;
    min-height:42px;
    padding:9px 11px;
    border:1px solid #d7e3ec;
    border-radius:8px;
    outline:0;
    background:#fbfdff;
    color:#355773;
    font:inherit;
    font-size:12px;
    box-sizing:border-box;
}

.dr-field textarea{
    min-height:110px;
    resize:vertical;
}

.dr-field input:focus,
.dr-field select:focus,
.dr-field textarea:focus{
    border-color:#9bc9ee;
    box-shadow:0 0 0 3px rgba(8,116,216,.07);
    background:#fff;
}

.dr-help{
    display:block;
    margin-top:5px;
    color:#8999a6;
    font-size:8.5px;
    line-height:1.4;
}

.dr-checkbox-grid{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.dr-checkbox{
    min-height:37px;
    padding:0 10px;
    display:inline-flex;
    align-items:center;
    gap:7px;
    border:1px solid #dce6ee;
    border-radius:8px;
    background:#fbfdff;
    color:#506d84;
    font-size:10px;
    font-weight:800;
}

.dr-checkbox input{
    width:auto;
    min-height:auto;
}

.dr-future-box{
    margin-top:15px;
    padding:17px;
    border:1px solid #cfe2f1;
    border-radius:10px;
    background:
        radial-gradient(circle at 100% 0%,rgba(8,113,202,.07),transparent 35%),
        #f5fbff;
}

.dr-future-box h3{
    font-size:17px;
}

.dr-future-box p{
    margin:7px 0 0;
}

.dr-future-details{
    display:none;
    margin-top:15px;
}

.dr-future-box.is-active .dr-future-details{
    display:block;
}

.dr-alert{
    margin-bottom:15px;
    padding:12px 14px;
    border:1px solid #dbe7ef;
    border-radius:9px;
    font-size:11px;
    line-height:1.55;
}

.dr-alert.is-success{
    border-color:#cde9dc;
    color:#246d50;
    background:#f2fbf6;
}

.dr-alert.is-warning{
    border-color:#f1dfbd;
    color:#825921;
    background:#fff9ef;
}

.dr-alert.is-error{
    border-color:#efd0d0;
    color:#8a3434;
    background:#fff5f5;
}

.dr-stat-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.dr-stat{
    padding:15px;
    border:1px solid #e0e8ef;
    border-radius:9px;
    background:#fbfdff;
}

.dr-stat small{
    display:block;
    color:#8092a0;
    font-size:9px;
}

.dr-stat strong{
    display:block;
    margin-top:5px;
    color:#173e5e;
    font-size:22px;
}

.dr-list{
    display:grid;
    gap:9px;
}

.dr-list-item{
    padding:15px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    border:1px solid #e1e9ef;
    border-radius:9px;
    background:#fff;
}

.dr-list-item strong{
    color:#173e5e;
    font-size:12px;
}

.dr-list-item p{
    margin:5px 0 0;
    font-size:10px;
}

.dr-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:8px;
    color:#7b90a1;
    font-size:9px;
}

.dr-status{
    min-height:27px;
    padding:0 9px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    font-size:9px;
    font-weight:900;
    white-space:nowrap;
}

.dr-status.is-blue{
    color:#0871ca;
    background:#edf7ff;
}

.dr-status.is-green{
    color:#287555;
    background:#eff9f4;
}

.dr-status.is-orange{
    color:#9b641d;
    background:#fff7e8;
}

.dr-status.is-red{
    color:#9a3e3e;
    background:#fff0f0;
}

.dr-status.is-neutral{
    color:#687d8d;
    background:#eef2f5;
}

.dr-timeline{
    position:relative;
    display:grid;
    gap:0;
}

.dr-timeline::before{
    content:"";
    position:absolute;
    left:13px;
    top:10px;
    bottom:10px;
    width:2px;
    background:#e2eaf0;
}

.dr-timeline-item{
    position:relative;
    padding:0 0 18px 38px;
}

.dr-timeline-item:last-child{
    padding-bottom:0;
}

.dr-timeline-dot{
    position:absolute;
    z-index:2;
    left:5px;
    top:2px;
    width:18px;
    height:18px;
    border:4px solid #edf7ff;
    border-radius:50%;
    background:#0871ca;
}

.dr-timeline-item strong{
    color:#31556f;
    font-size:11px;
}

.dr-timeline-item p{
    margin:4px 0 0;
    font-size:10px;
}

.dr-timeline-item time{
    display:block;
    margin-top:4px;
    color:#8b9aa7;
    font-size:8.5px;
}

.dr-file-list{
    display:grid;
    gap:8px;
}

.dr-file{
    min-height:46px;
    padding:8px 10px;
    display:grid;
    grid-template-columns:30px minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
    border:1px solid #e1e9ef;
    border-radius:8px;
}

.dr-file>span{
    width:30px;
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    color:#0871ca;
    background:#edf7ff;
}

.dr-file svg{
    width:15px;
    height:15px;
}

.dr-file strong{
    display:block;
    overflow:hidden;
    color:#355773;
    font-size:10px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.dr-file small{
    display:block;
    margin-top:2px;
    color:#8a99a5;
    font-size:8px;
}

.dr-table-wrap{
    overflow:auto;
}

.dr-table{
    width:100%;
    border-collapse:collapse;
    font-size:10px;
}

.dr-table th,
.dr-table td{
    padding:9px 8px;
    border-bottom:1px solid #e7edf2;
    text-align:left;
    vertical-align:top;
}

.dr-table th{
    color:#5d7488;
    background:#f7fafc;
    font-size:9px;
    text-transform:uppercase;
}

.dr-table td{
    color:#48677f;
}

.dr-quick-links{
    display:grid;
    gap:6px;
    margin-top:12px;
}

.dr-quick-links a{
    min-height:39px;
    padding:0 10px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 14px;
    align-items:center;
    border:1px solid #e1e9ef;
    border-radius:8px;
    color:#46677f;
    background:#fbfdff;
    font-size:10px;
    font-weight:900;
}

.dr-quick-links svg{
    width:13px;
    height:13px;
}

.dr-empty{
    padding:32px 20px;
    border:1px dashed #cbdbe7;
    border-radius:11px;
    background:#fff;
    text-align:center;
}

.dr-empty h2{
    margin:0;
    color:#173e5e;
    font-size:20px;
}

.dr-empty p{
    max-width:580px;
    margin:8px auto 15px;
}

.dr-admin-head{
    margin-bottom:16px;
    display:flex;
    justify-content:space-between;
    gap:15px;
    align-items:flex-end;
}

.dr-admin-head h1{
    margin:7px 0 0;
    color:#173e5e;
    font-size:28px;
}

.dr-admin-head p{
    margin:7px 0 0;
}

.dr-admin-filter{
    display:grid;
    grid-template-columns:1.4fr .8fr .8fr auto;
    gap:9px;
    align-items:end;
}

.dr-admin-filter .dr-field input,
.dr-admin-filter .dr-field select{
    min-height:39px;
}

.dr-pill{
    min-height:26px;
    padding:0 8px;
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    color:#0871ca;
    background:#edf7ff;
    font-size:8.5px;
    font-weight:900;
}

.dr-callout{
    padding:20px;
    display:flex;
    justify-content:space-between;
    gap:22px;
    align-items:flex-end;
    border-radius:12px;
    color:#fff;
    background:
        radial-gradient(circle at 100% 0%,rgba(255,255,255,.12),transparent 30%),
        linear-gradient(135deg,#07385f,#0871c8 65%,#0b796f);
}

.dr-callout h2{
    margin:8px 0 0;
    color:#fff;
    font-size:21px;
}

.dr-callout p{
    max-width:710px;
    margin:8px 0 0;
    color:#d8e9f3;
}

.dr-hidden{
    display:none!important;
}

@media(max-width:960px){
    .dr-summary-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .dr-summary-grid article{
        border-bottom:1px solid #e8eef3;
    }

    .dr-summary-grid article:nth-child(2n){
        border-right:0;
    }

    .dr-layout{
        grid-template-columns:1fr;
    }

    .dr-sidebar{
        position:static;
        grid-template-columns:1fr 1fr;
    }

    .dr-flow{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .dr-admin-filter{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:620px){
    .dr-main{
        padding-top:10px;
    }

    .dr-container{
        width:calc(100% - 16px);
    }

    .dr-cover{
        width:calc(100% - 16px);
        border-radius:10px;
    }

    .dr-cover-inner{
        min-height:0;
        padding:24px 18px 42px;
        align-items:flex-start;
        flex-direction:column;
    }

    .dr-cover h1{
        font-size:29px;
    }

    .dr-cover p{
        font-size:12px;
    }

    .dr-cover-actions{
        width:100%;
    }

    .dr-cover-actions .dr-button{
        flex:1 1 auto;
    }

    .dr-summary{
        margin-top:-22px;
    }

    .dr-summary-grid{
        width:calc(100% - 34px);
        grid-template-columns:1fr 1fr;
    }

    .dr-summary-grid article{
        min-height:94px;
        padding:11px;
        grid-template-columns:31px minmax(0,1fr);
        gap:7px;
    }

    .dr-summary-grid article>span{
        width:31px;
        height:31px;
    }

    .dr-summary-grid strong{
        font-size:9.5px;
    }

    .dr-summary-grid small{
        font-size:7.5px;
    }

    .dr-section{
        padding:21px 0 30px;
    }

    .dr-sidebar{
        grid-template-columns:1fr;
    }

    .dr-card-body{
        padding:16px;
    }

    .dr-card h2{
        font-size:19px;
    }

    .dr-form-grid,
    .dr-stat-grid,
    .dr-admin-filter{
        grid-template-columns:1fr;
    }

    .dr-field.is-full{
        grid-column:auto;
    }

    .dr-flow{
        grid-template-columns:1fr 1fr;
    }

    .dr-list-item{
        grid-template-columns:1fr;
    }

    .dr-admin-head,
    .dr-callout{
        align-items:flex-start;
        flex-direction:column;
    }

    .dr-button{
        min-height:38px;
        font-size:10px;
    }

    .dr-table{
        min-width:760px;
    }
}


/* ==========================================================================
   Modern v2.10.2 — Admin shared sidebar integration
   ========================================================================== */

.dr-admin-shell-page{
    width:100%;
    min-width:0;
}

.hnet-admin-content .dr-admin-head{
    margin-top:.1rem;
}

.hnet-admin-content .dr-card{
    box-shadow:0 .35rem 1rem rgba(15,23,42,.035);
}

.hnet-admin-content .dr-table-wrap{
    width:100%;
}

.hnet-admin-content .dr-admin-filter{
    width:100%;
}

.hnet-admin-content .dr-layout{
    width:100%;
    grid-template-columns:minmax(0,1fr) 290px;
}

.hnet-admin-content .dr-sidebar{
    top:5.25rem;
}

@media(max-width:1199.98px){
    .hnet-admin-content .dr-layout{
        grid-template-columns:1fr;
    }

    .hnet-admin-content .dr-sidebar{
        position:static;
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:767.98px){
    .hnet-admin-content .dr-sidebar{
        grid-template-columns:1fr;
    }

    .dr-admin-shell-page .dr-admin-head{
        gap:.75rem;
    }
}


/* ==========================================================================
   Modern v2.10.3 — User / Engineer Network shell integration
   ========================================================================== */

.dr-user-shell-page{
    width:100%;
    min-width:0;
}

.users-content .dr-user-shell-page,
.users-main .dr-user-shell-page,
.users-page-content .dr-user-shell-page{
    width:100%;
}

.dr-user-shell-page .dr-admin-head{
    margin-top:.05rem;
}

.dr-user-shell-page .dr-card{
    box-shadow:0 .35rem 1rem rgba(15,23,42,.035);
}

.dr-user-shell-page .dr-layout{
    width:100%;
    grid-template-columns:minmax(0,1fr) 280px;
}

.dr-user-shell-page .dr-sidebar{
    top:5.5rem;
}

.dr-user-shell-page .dr-table{
    min-width:0;
}

.dr-user-shell-page .dr-table-wrap{
    width:100%;
}

@media(max-width:1199.98px){
    .dr-user-shell-page .dr-layout{
        grid-template-columns:1fr;
    }

    .dr-user-shell-page .dr-sidebar{
        position:static;
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:767.98px){
    .dr-user-shell-page .dr-sidebar{
        grid-template-columns:1fr;
    }

    .dr-user-shell-page .dr-table{
        min-width:640px;
    }
}
