:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#172033;background:#f5f7fb}*{box-sizing:border-box}body{margin:0}header{height:72px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #e7eaf0}.brand{font-size:20px;font-weight:800;color:#0b5d69;text-decoration:none}nav{display:flex;gap:22px}nav a{color:#334155;text-decoration:none}main{max-width:1180px;margin:auto;padding:36px 24px}.hero{min-height:420px;display:flex;align-items:center;background:linear-gradient(135deg,#e9f8f7,#fff);border-radius:24px;padding:56px}.hero h1{font-size:54px;margin:10px 0}.eyebrow{color:#0b7a75;font-weight:700}.btn{display:inline-block;background:#0b7a75;color:#fff!important;padding:11px 18px;border:0;border-radius:9px;text-decoration:none;cursor:pointer}.card,.stat{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:22px;margin:18px 0;box-shadow:0 4px 18px #00000008}.narrow{max-width:480px;margin:40px auto}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.stat b{display:block;font-size:32px}.stat span,.muted{color:#64748b}.menu a{font-size:20px;font-weight:700;text-decoration:none;color:#172033}.toolbar{display:flex;justify-content:space-between;align-items:center}input,select,textarea{width:100%;padding:11px;border:1px solid #cbd5e1;border-radius:8px;margin:6px 0 16px}table{width:100%;border-collapse:collapse;background:#fff;margin-top:18px}th,td{padding:13px;border-bottom:1px solid #e5e7eb;text-align:left}footer{text-align:center;padding:35px;color:#64748b}@media(max-width:800px){.grid{grid-template-columns:1fr}.hero h1{font-size:38px}nav{gap:8px;font-size:13px}}
.secondary{background:#64748b}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.formgrid .wide{grid-column:1/-1}.filterbar{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center}.filterbar input{margin:0}.check{display:flex;align-items:center;gap:8px;white-space:nowrap}.check input{width:auto;margin:0}.top{margin-top:28px}.link-danger{border:0;background:none;color:#b42318;cursor:pointer;padding:0}h2{margin-top:32px}@media(max-width:800px){.formgrid,.filterbar{grid-template-columns:1fr}.formgrid .wide{grid-column:auto}}
.versionbar{background:#0b5d69;color:#fff;text-align:right;padding:5px 6%;font-size:12px;font-weight:700}.small{padding:7px 12px;font-size:13px}.status{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:700}.status.active{background:#dcfce7;color:#166534}.status.inactive{background:#fee2e2;color:#991b1b}.rolechecks{display:flex;gap:20px;flex-wrap:wrap;margin:8px 0 18px}.notice{background:#ecfdf5;border:1px solid #a7f3d0;padding:12px;border-radius:8px;color:#065f46}.errorbox{background:#fef2f2;border:1px solid #fecaca;padding:12px;border-radius:8px;color:#991b1b}

/* v1.8.3 - Global searchable dropdowns */
.spm-native-select{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    opacity:0!important;
    pointer-events:none!important;
}
.spm-search-select{
    position:relative;
    width:100%;
    margin:6px 0 16px;
    min-width:0;
}
.spm-select-control{
    width:100%;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border:1px solid #cbd5e1;
    border-radius:8px;
    background:#fff;
    color:#172033;
    font:inherit;
    text-align:left;
    cursor:pointer;
}
.spm-select-control:hover{border-color:#94a3b8}
.spm-search-select.is-open .spm-select-control{
    border-color:#0b7a75;
    box-shadow:0 0 0 3px rgba(11,122,117,.12);
}
.spm-select-control:focus-visible{
    outline:none;
    border-color:#0b7a75;
    box-shadow:0 0 0 3px rgba(11,122,117,.14);
}
.spm-select-control.is-placeholder,
.spm-select-control .is-placeholder{color:#64748b}
.spm-search-select.is-disabled .spm-select-control{
    background:#f1f5f9;
    color:#94a3b8;
    cursor:not-allowed;
}
.spm-search-select.is-invalid .spm-select-control{border-color:#dc2626}
.spm-select-control-text{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.spm-select-chevron{
    flex:0 0 auto;
    font-size:18px;
    line-height:1;
    color:#64748b;
    transition:transform .15s ease;
}
.spm-search-select.is-open .spm-select-chevron{transform:rotate(180deg)}
.spm-select-panel{
    position:absolute;
    z-index:5000;
    top:calc(100% + 5px);
    left:0;
    right:0;
    padding:8px;
    background:#fff;
    border:1px solid #d7dee8;
    border-radius:10px;
    box-shadow:0 14px 35px rgba(15,23,42,.16);
}
.spm-select-search{
    width:100%!important;
    margin:0 0 7px!important;
    padding:9px 10px!important;
    border:1px solid #cbd5e1!important;
    border-radius:7px!important;
    background:#fff!important;
}
.spm-select-search:focus{
    outline:none;
    border-color:#0b7a75!important;
    box-shadow:0 0 0 2px rgba(11,122,117,.10);
}
.spm-select-options{
    max-height:260px;
    overflow:auto;
    overscroll-behavior:contain;
}
.spm-select-option{
    display:block;
    width:100%;
    border:0;
    border-radius:7px;
    background:transparent;
    padding:9px 10px;
    color:#172033;
    font:inherit;
    text-align:left;
    cursor:pointer;
}
.spm-select-option:hover,
.spm-select-option.is-active{background:#eef8f7}
.spm-select-option.is-selected{
    background:#dff4f1;
    color:#075e59;
    font-weight:700;
}
.spm-select-option.is-disabled{
    color:#94a3b8;
    cursor:not-allowed;
    background:transparent;
}
.spm-select-empty{
    padding:12px 10px;
    color:#64748b;
    text-align:center;
    font-size:13px;
}
.filterbar .spm-search-select{margin:0}
.formgrid .spm-search-select{margin-top:6px}
@media(max-width:800px){
    .spm-select-panel{position:absolute}
    .spm-select-options{max-height:220px}
}

/* v1.8.4 - Global automatic table paging */
.spm-table-pager{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin:12px 0 22px;
    padding:10px 12px;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
}
.spm-table-pager[hidden]{display:none!important}
.spm-pager-summary{
    color:#64748b;
    font-size:13px;
    font-weight:600;
}
.spm-pager-controls{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}
.spm-pager-size-label{
    display:flex;
    align-items:center;
    gap:8px;
    color:#475569;
    font-size:13px;
    font-weight:600;
    margin-right:6px;
}
.spm-pager-size{
    width:auto!important;
    min-width:72px;
    margin:0!important;
    padding:7px 28px 7px 9px!important;
    border:1px solid #cbd5e1;
    border-radius:7px;
    background:#fff;
}
.spm-pager-btn{
    min-width:36px;
    height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid #cbd5e1;
    border-radius:7px;
    background:#fff;
    color:#334155;
    font-size:19px;
    font-weight:700;
    line-height:1;
    cursor:pointer;
}
.spm-pager-btn:hover:not(:disabled){
    border-color:#0b7a75;
    color:#0b7a75;
    background:#eef8f7;
}
.spm-pager-btn:disabled{
    opacity:.38;
    cursor:not-allowed;
}
.spm-pager-page-info{
    min-width:92px;
    text-align:center;
    color:#334155;
    font-size:13px;
    font-weight:700;
}
.spm-table-paged tbody tr[hidden]{display:none!important}
@media(max-width:800px){
    .spm-table-pager{align-items:stretch}
    .spm-pager-summary{width:100%}
    .spm-pager-controls{width:100%;justify-content:space-between}
    .spm-pager-size-label{margin-right:auto}
}

/* v1.9.1 - Maintenance Requests list readability */
.maintenance-requests-page{
    width:min(1600px,calc(100vw - 48px));
    margin-left:50%;
    transform:translateX(-50%);
}
.request-filter-card{margin-bottom:12px}
.request-filter-grid{grid-template-columns:minmax(260px,1.35fr) repeat(3,minmax(190px,1fr))}
.request-filter-actions{
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
}
.request-table-wrap{
    overflow:auto;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
}
.maintenance-request-table{
    min-width:1450px;
    margin-top:0;
    table-layout:fixed;
}
.maintenance-request-table thead th{
    position:sticky;
    top:0;
    z-index:3;
    background:#f8fafc;
    color:#334155;
    font-size:13px;
    white-space:nowrap;
}
.maintenance-request-table th,
.maintenance-request-table td{
    vertical-align:top;
    line-height:1.35;
}
.maintenance-request-table tbody tr:hover{background:#f8fbfc}
.maintenance-request-table .col-request-no{width:118px}
.maintenance-request-table .col-request-name{width:240px}
.maintenance-request-table .col-customer{width:205px}
.maintenance-request-table .col-device{width:285px}
.maintenance-request-table .col-date{width:105px}
.maintenance-request-table .col-status{width:105px}
.maintenance-request-table .col-visit{width:95px}
.maintenance-request-table .col-responsible{width:155px}
.maintenance-request-table .col-legacy{width:80px}
.maintenance-request-table .col-visible{width:70px}
.maintenance-request-table .col-action{width:72px}
.request-no-cell{white-space:nowrap}
.request-name-cell{
    font-weight:600;
    overflow-wrap:anywhere;
}
.customer-cell{
    font-weight:600;
    overflow-wrap:anywhere;
}
.device-cell{overflow-wrap:anywhere}
.device-cell b{font-weight:700}
.serial-line{margin-top:5px;font-size:12px;white-space:nowrap}
.date-cell,.legacy-cell,.visible-cell{white-space:nowrap}
.responsible-cell{font-weight:600;overflow-wrap:anywhere}
.action-cell{white-space:nowrap}
@media(max-width:900px){
    .maintenance-requests-page{
        width:calc(100vw - 24px);
    }
    .request-filter-grid{grid-template-columns:1fr}
    .request-filter-grid .wide{grid-column:auto}
}

/* v1.9.2 - Sticky Edit column for Maintenance Requests */
.maintenance-request-table .sticky-action{
    position:sticky;
    right:0;
    z-index:4;
    background:#fff;
    box-shadow:-8px 0 12px -12px rgba(15,23,42,.55);
}
.maintenance-request-table thead .sticky-action{
    z-index:6;
    background:#f8fafc;
}
.maintenance-request-table tbody tr:hover .sticky-action{
    background:#f8fbfc;
}
.maintenance-request-table .action-cell{
    text-align:center;
    padding-left:8px;
    padding-right:8px;
}
.maintenance-request-table .action-cell .btn{
    white-space:nowrap;
}

/* v1.9.3 - Maintenance Request list/date cleanup */
.maintenance-request-table .english-date,
.english-date{
    direction:ltr!important;
    unicode-bidi:plaintext;
    text-align:left!important;
    font-variant-numeric:tabular-nums;
    letter-spacing:.2px;
}
.maintenance-request-table .col-request-no{width:125px}
.maintenance-request-table .col-customer{width:230px}
.maintenance-request-table .col-device{width:330px}
.maintenance-request-table .col-responsible{width:170px}

/* v1.9.4 - English/Latin numbers and dates everywhere */
html{
    font-variant-numeric:lining-nums tabular-nums;
    font-feature-settings:"lnum" 1,"tnum" 1;
}
.spm-english-number,
.spm-english-date,
.english-date,
input[type="tel"],
input[inputmode="numeric"],
input[inputmode="decimal"]{
    direction:ltr!important;
    text-align:left!important;
    unicode-bidi:plaintext;
    font-variant-numeric:lining-nums tabular-nums;
    font-feature-settings:"lnum" 1,"tnum" 1;
}
.spm-english-date::placeholder,
.spm-english-number::placeholder{
    direction:ltr;
    text-align:left;
}



/* v2.0.5 - Local reusable SVG icon library */
.spm-icon{display:inline-flex;align-items:center;justify-content:center;width:1.1em;height:1.1em;line-height:1;vertical-align:-.14em;flex:0 0 auto}
.spm-icon svg{display:block;width:100%;height:100%}
.spm-icon-lg{width:1.35em;height:1.35em}
.spm-icon-xl{width:2.15em;height:2.15em}
.grid.menu .card{display:flex;align-items:center;gap:10px}
.grid.menu .card>.spm-icon{width:22px;height:22px;color:#0b7a75}
.spm-icon-library{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:12px;margin:16px 0 24px}
.spm-icon-card{display:flex;min-height:112px;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:1px solid #dbe4ea;border-radius:12px;background:#fff;color:#203040;cursor:pointer;font:inherit}
.spm-icon-card:hover{border-color:#0b7a75;background:#f1fbfa;transform:translateY(-1px)}
.spm-icon-card .spm-icon{color:#0b7a75}
