/* PolarOne Maintenance Contracts — module-scoped backend styling */
.po-contracts.po-crm-page{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    padding-bottom:88px;
}
.po-contracts *,
.po-contracts *::before,
.po-contracts *::after{box-sizing:border-box}

.po-contracts .po-page-header{
    margin:0 0 30px;
}
.po-contracts .po-page-header h1{
    margin:8px 0 12px;
    font-size:clamp(38px,4vw,54px);
    line-height:1.05;
    letter-spacing:-.035em;
    color:#0d1e43;
}
.po-contracts .po-page-header p{
    max-width:820px;
    margin:0;
    color:#60728e;
    font-size:18px;
    line-height:1.6;
}

.po-contracts .po-contract-kpis{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin:0 0 22px;
}
.po-contracts .po-contract-kpis>article{
    min-width:0;
    min-height:106px;
    padding:20px 22px !important;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:8px;
    background:#fff;
    border:1px solid #d7e2ef;
    border-radius:18px;
    box-shadow:0 10px 28px rgba(18,48,92,.06);
    overflow:hidden;
}
.po-contracts .po-contract-kpis span{
    display:block;
    margin:0;
    color:#63748e;
    font-size:13px;
    font-weight:600;
    line-height:1.35;
}
.po-contracts .po-contract-kpis strong{
    display:block;
    margin:0;
    color:#0d2854;
    font-size:28px;
    font-weight:800;
    line-height:1;
    letter-spacing:-.025em;
}

.po-contracts .po-contract-tabs{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin:0 0 30px;
}
.po-contracts .po-contract-tabs a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 26px;
    border:0;
    border-radius:15px;
    background:#eaf0f7;
    color:#17345f;
    font-size:17px;
    font-weight:750;
    line-height:1;
    text-decoration:none;
    box-shadow:none;
}
.po-contracts .po-contract-tabs a.is-active{
    background:#123565;
    color:#fff;
}

.po-contracts .po-contract-layout{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(360px,.82fr);
    gap:28px;
    align-items:start;
    width:100%;
}
.po-contracts .po-contract-card{
    min-width:0;
    padding:32px !important;
    background:#fff;
    border:1px solid #d7e2ef;
    border-radius:22px;
    box-shadow:0 14px 34px rgba(18,48,92,.07);
    overflow:hidden;
}
.po-contracts .po-contract-card-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin:0 0 26px;
    padding:0 0 22px;
    border-bottom:1px solid #e4ebf3;
}
.po-contracts .po-contract-card-head h2{
    margin:0 0 8px;
    color:#0d2854;
    font-size:27px;
    line-height:1.2;
    letter-spacing:-.02em;
}
.po-contracts .po-contract-card-head p{
    margin:0;
    max-width:680px;
    color:#65768f;
    font-size:16px;
    line-height:1.55;
}

.po-contracts .po-contract-empty{
    padding:56px 28px !important;
    text-align:center;
    background:#f6f9fc;
    border:1px solid #e2eaf3;
    border-radius:18px;
}
.po-contracts .po-contract-empty h3{margin:0 0 10px;color:#102852;font-size:23px}
.po-contracts .po-contract-empty p{margin:0;color:#687991;font-size:16px;line-height:1.55}

.po-contracts .po-contract-list{display:grid;gap:18px}
.po-contracts .po-contract-list>article{
    padding:24px !important;
    border:1px solid #dfe7f1;
    border-radius:18px;
    background:#f9fbfd;
}
.po-contracts .po-contract-list>article>div:first-child{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.po-contracts .po-contract-list h3{margin:0;font-size:20px;color:#102852}
.po-contracts .po-contract-list p{width:100%;margin:4px 0 0;color:#64748b;line-height:1.5}
.po-contracts .po-contract-list dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:22px 0 0}
.po-contracts .po-contract-list dl div{min-width:0;padding:15px 16px;background:#fff;border:1px solid #e6ecf4;border-radius:14px}
.po-contracts .po-contract-list dt{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#7a8aa0;font-weight:800}
.po-contracts .po-contract-list dd{margin:6px 0 0;color:#102852;font-weight:750;overflow-wrap:anywhere}

.po-contracts .po-contract-status{display:inline-flex;align-items:center;width:max-content;padding:6px 10px;border-radius:999px;background:#e8f0fb;color:#1857a7;font-size:12px;font-weight:800}
.po-contracts .po-contract-status.is-active,.po-contracts .po-contract-status.is-completed{background:#e8f8ef;color:#167447}
.po-contracts .po-contract-status.is-draft,.po-contracts .po-contract-status.is-planned{background:#fff4d8;color:#8a5a00}
.po-contracts .po-contract-status.is-paused,.po-contracts .po-contract-status.is-cancelled,.po-contracts .po-contract-status.is-expired{background:#fbe8e8;color:#a52a2a}

.po-contracts form.po-contract-form{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px 18px;
    width:100%;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
}
.po-contracts .po-contract-form label{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    margin:0 !important;
    color:#17345f;
    font-weight:700;
}
.po-contracts .po-contract-form label>span{display:block;font-size:14px;line-height:1.3}
.po-contracts .po-contract-form input:not([type="checkbox"]),
.po-contracts .po-contract-form select,
.po-contracts .po-contract-form textarea,
.po-contracts .po-visit-action select{
    width:100%;
    min-width:0;
    height:54px;
    margin:0 !important;
    padding:0 16px !important;
    border:1px solid #ccd9ea !important;
    border-radius:13px !important;
    background:#fff !important;
    box-shadow:none !important;
    color:#102852 !important;
    font:inherit;
    font-size:15px;
    line-height:1.35;
}
.po-contracts .po-contract-form textarea{
    height:auto;
    min-height:112px;
    padding:14px 16px !important;
    resize:vertical;
}
.po-contracts .po-contract-form input:focus,
.po-contracts .po-contract-form select:focus,
.po-contracts .po-contract-form textarea:focus{
    outline:3px solid rgba(15,110,230,.12);
    border-color:#4d8fe7 !important;
}
.po-contracts .po-contract-form .is-wide{grid-column:1/-1}
.po-contracts .po-contract-check{
    grid-column:1/-1;
    flex-direction:row !important;
    align-items:center !important;
    gap:10px !important;
    padding:2px 0;
}
.po-contracts .po-contract-check input[type="checkbox"]{
    flex:0 0 auto;
    width:20px !important;
    height:20px !important;
    margin:0 !important;
}
.po-contracts .po-contract-form button{
    grid-column:1/-1;
    justify-self:start;
    min-height:50px;
    padding:0 24px;
}

.po-contracts .po-plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.po-contracts .po-plan-grid article{min-width:0;padding:24px !important;border:1px solid #dfe7f1;border-radius:18px;background:#f9fbfd;display:flex;flex-direction:column;gap:11px}
.po-contracts .po-plan-grid h3,.po-contracts .po-plan-grid p{margin:0}
.po-contracts .po-plan-grid p{color:#64748b;line-height:1.5}
.po-contracts .po-plan-grid strong{font-size:22px;color:#102852}
.po-contracts .po-plan-grid small{color:#64748b;line-height:1.45}

.po-contracts .po-contract-table-wrap{width:100%;overflow-x:auto;border:1px solid #e2e9f2;border-radius:16px}
.po-contracts .po-contract-table{width:100%;border-collapse:collapse;background:#fff}
.po-contracts .po-contract-table th,.po-contracts .po-contract-table td{text-align:left;padding:16px 18px;border-bottom:1px solid #e2e8f0;vertical-align:middle;white-space:nowrap}
.po-contracts .po-contract-table tr:last-child td{border-bottom:0}
.po-contracts .po-contract-table th{background:#f7f9fc;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#64748b}
.po-contracts .po-contract-table td small{display:block;margin-top:4px;color:#64748b}
.po-contracts .po-visit-action{display:flex;gap:8px;align-items:center;margin:0 !important;padding:0 !important;border:0 !important;box-shadow:none !important;background:transparent !important}
.po-contracts .po-visit-action select{min-width:140px;height:44px;padding:0 12px !important}

.po-contracts .po-contract-flash{margin:0 0 24px;padding:15px 18px;border-radius:14px;background:#e9f7ef;color:#16653f;font-weight:700}

@media(max-width:1180px){
    .po-contracts .po-contract-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .po-contracts .po-contract-layout{grid-template-columns:1fr}
    .po-contracts .po-contract-list dl{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
    .po-contracts.po-crm-page{padding-bottom:60px}
    .po-contracts .po-page-header h1{font-size:38px}
    .po-contracts .po-page-header p{font-size:16px}
    .po-contracts .po-contract-kpis{grid-template-columns:1fr;gap:14px}
    .po-contracts .po-contract-kpis>article{min-height:132px;padding:24px !important}
    .po-contracts .po-contract-card{padding:24px !important}
    .po-contracts .po-contract-form,.po-contracts form.po-contract-form,.po-contracts .po-plan-grid{grid-template-columns:1fr}
    .po-contracts .po-contract-form .is-wide{grid-column:auto}
    .po-contracts .po-contract-list dl{grid-template-columns:1fr}
    .po-contracts .po-contract-tabs{display:grid;grid-template-columns:1fr;gap:10px}
    .po-contracts .po-contract-tabs a{width:100%}
    .po-contracts .po-visit-action{min-width:220px;flex-direction:column;align-items:stretch}
}
