:root {
    --nav: #111827;
    --nav-dark: #0f172a;
    --background: #f4f7fb;
    --border: #e6ebf2;
    --text: #172033;
    --muted: #718096;
    --primary: #2563eb;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Tahoma, Arial, sans-serif;
    color: var(--text);
    background: var(--background);
}

button,
input {
    font: inherit;
}

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 20px;
    background:
        radial-gradient(
            circle at top right,
            #1e40af 0,
            #111827 45%,
            #020617 100%
        );
}

.login-card {
    width: min(430px, 100%);
    padding: 34px;
    background: white;
    border-radius: 24px;
    box-shadow: 0 30px 90px #0007;
}

.login-logo,
.sidebar-brand > span {
    display: grid;
    place-items: center;
    background:
        linear-gradient(
            135deg,
            #2563eb,
            #06b6d4
        );
    color: white;
    font-weight: 900;
}

.login-logo {
    width: 58px;
    height: 58px;
    margin: auto;
    border-radius: 18px;
    font-size: 30px;
}

.login-card h1 {
    margin: 18px 0 5px;
    text-align: center;
    font-size: 26px;
}

.login-card > p {
    margin: 0 0 25px;
    text-align: center;
    color: var(--muted);
}

.login-card label {
    display: block;
    margin: 14px 0 7px;
    font-size: 13px;
    font-weight: 700;
}

.login-card input:not([type="checkbox"]) {
    width: 100%;
    height: 48px;
    padding: 0 13px;
    border: 1px solid #dbe2ea;
    border-radius: 12px;
    outline: none;
}

.login-card input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px #2563eb1a;
}

.remember-row {
    display: flex !important;
    align-items: center;
    gap: 8px;
    font-weight: 400 !important;
}

.login-card button {
    width: 100%;
    height: 49px;
    border: 0;
    border-radius: 12px;
    background: var(--primary);
    color: white;
    font-weight: 800;
    cursor: pointer;
}

.error-message {
    margin-top: 18px;
    padding: 12px;
    border-radius: 10px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 13px;
}

.sidebar {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    width: 255px;
    padding: 22px 16px;
    color: white;
    background:
        linear-gradient(
            180deg,
            var(--nav),
            var(--nav-dark)
        );
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 8px 22px;
    border-bottom: 1px solid #ffffff12;
}

.sidebar-brand > span {
    width: 43px;
    height: 43px;
    border-radius: 13px;
    font-size: 23px;
}

.sidebar-brand strong,
.sidebar-brand small {
    display: block;
}

.sidebar-brand small {
    margin-top: 3px;
    color: #94a3b8;
}

.sidebar nav {
    display: grid;
    gap: 6px;
    margin-top: 22px;
}

.sidebar nav a,
.sidebar nav .coming {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 45px;
    padding: 0 13px;
    border-radius: 11px;
    color: #cbd5e1;
    text-decoration: none;
    font-size: 14px;
}

.sidebar nav a.active {
    color: white;
    background: var(--primary);
}

.sidebar nav .coming {
    opacity: .58;
}

.sidebar nav .coming small {
    margin-right: auto;
    font-size: 9px;
}

.main-shell {
    min-height: 100vh;
    margin-right: 255px;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 28px;
    background: white;
    border-bottom: 1px solid var(--border);
}

.topbar strong,
.topbar small {
    display: block;
}

.topbar small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 11px;
}

.logout-button {
    padding: 9px 14px;
    border: 1px solid #fecaca;
    border-radius: 9px;
    background: white;
    color: #dc2626;
    cursor: pointer;
}

.page-content {
    padding: 28px;
}

.page-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.page-heading h1 {
    margin: 0 0 7px;
    font-size: 26px;
}

.page-heading p {
    margin: 0;
    color: var(--muted);
}

.system-ready {
    padding: 8px 12px;
    border-radius: 999px;
    background: #dcfce7;
    color: #15803d;
    font-size: 12px;
    font-weight: 800;
}

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

.stat-card {
    position: relative;
    overflow: hidden;
    padding: 20px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background: white;
    box-shadow: 0 8px 25px #0f172a08;
}

.stat-card::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 5px;
    background: currentColor;
    content: "";
}

.stat-card span {
    display: block;
    color: #64748b;
    font-size: 13px;
}

.stat-card strong {
    display: block;
    margin-top: 10px;
    color: var(--text);
    font-size: 29px;
}

.blue {
    color: #2563eb;
}

.violet {
    color: #7c3aed;
}

.green {
    color: #16a34a;
}

.cyan {
    color: #0891b2;
}

.emerald {
    color: #059669;
}

.orange {
    color: #ea580c;
}

.red {
    color: #dc2626;
}

.slate {
    color: #475569;
}

.welcome-box {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 22px;
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: white;
}

.welcome-icon {
    flex: 0 0 auto;
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: #dbeafe;
    color: #2563eb;
    font-size: 28px;
}

.welcome-box h2 {
    margin: 0 0 8px;
    font-size: 18px;
}

.welcome-box p {
    margin: 0;
    color: var(--muted);
    line-height: 1.8;
}

.mobile-menu,
.sidebar-overlay {
    display: none;
}

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

@media (max-width: 760px) {
    .sidebar {
        transform: translateX(105%);
        transition: .25s;
    }

    .sidebar.open {
        transform: none;
    }

    .sidebar-overlay.open {
        position: fixed;
        inset: 0;
        z-index: 35;
        display: block;
        background: #0007;
    }

    .main-shell {
        margin-right: 0;
    }

    .mobile-menu {
        position: fixed;
        top: 16px;
        right: 14px;
        z-index: 30;
        display: block;
        width: 40px;
        height: 40px;
        border: 0;
        border-radius: 10px;
        background: #111827;
        color: white;
    }

    .topbar {
        padding: 0 65px 0 14px;
    }

    .page-content {
        padding: 18px 13px;
    }

    .stats-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .stat-card {
        padding: 15px;
    }

    .stat-card strong {
        font-size: 24px;
    }

    .system-ready {
        display: none;
    }

    .welcome-box {
        align-items: flex-start;
    }
}

/* FTTH_NETWORK_MAP_INTERFACE */

.map-content {
    position: relative;
    padding: 14px;
}

.map-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.map-search {
    display: flex;
    width: min(440px, 100%);
    height: 43px;
}

.map-search input {
    flex: 1;
    min-width: 0;
    padding: 0 13px;
    border: 1px solid #dbe2ea;
    border-left: 0;
    border-radius: 0 11px 11px 0;
    background: white;
    outline: 0;
}

.map-search input:focus {
    border-color: #2563eb;
}

.map-search button {
    width: 72px;
    border: 0;
    border-radius: 11px 0 0 11px;
    background: #111827;
    color: white;
    cursor: pointer;
}

.map-actions {
    display: flex;
    gap: 8px;
}

.map-tool {
    height: 42px;
    padding: 0 14px;
    border: 0;
    border-radius: 10px;
    color: white;
    font-weight: 700;
    cursor: pointer;
}

.map-tool.light {
    border: 1px solid #dbe2ea;
    background: white;
    color: #334155;
}

.map-tool.cabinet {
    background: #e11d48;
}

.map-tool.pole {
    background: #2563eb;
}

.map-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.map-summary span {
    padding: 7px 11px;
    border: 1px solid #e6ebf2;
    border-radius: 999px;
    background: white;
    color: #64748b;
    font-size: 11px;
}

.map-summary strong {
    margin-right: 5px;
    color: #172033;
}

#networkMap {
    height: calc(100vh - 185px);
    min-height: 520px;
    overflow: hidden;
    border: 1px solid #dbe2ea;
    border-radius: 17px;
    background: #dbeafe;
    box-shadow: 0 8px 30px #0f172a0d;
}

#networkMap.selecting-location {
    cursor: crosshair;
}

.map-notice {
    position: absolute;
    top: 75px;
    right: 50%;
    z-index: 900;
    max-width: min(500px, 90%);
    padding: 11px 16px;
    transform: translateX(50%);
    border-radius: 11px;
    background: #052e16;
    color: white;
    box-shadow: 0 10px 30px #0004;
    font-size: 13px;
    font-weight: 700;
}

.map-notice.error {
    background: #991b1b;
}

.ftth-div-icon {
    border: 0 !important;
    background: transparent !important;
}

.network-marker {
    position: relative;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 3px solid white;
    border-radius: 12px;
    color: white;
    box-shadow: 0 6px 18px #0005;
    font-size: 16px;
    font-weight: 900;
}

.network-marker::after {
    position: absolute;
    bottom: -8px;
    z-index: -1;
    width: 12px;
    height: 12px;
    transform: rotate(45deg);
    border-radius: 2px;
    content: "";
}

.network-marker.cabinet,
.network-marker.cabinet::after {
    background: #e11d48;
}

.network-marker.pole,
.network-marker.pole::after {
    background: #2563eb;
}

.marker-popup {
    min-width: 170px;
    display: grid;
    gap: 5px;
    text-align: right;
    font-family: Tahoma, Arial, sans-serif;
}

.marker-popup strong {
    font-size: 14px;
}

.marker-popup span {
    color: #64748b;
    font-size: 11px;
}

.network-dialog {
    width: min(540px, calc(100% - 24px));
    padding: 0;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 25px 80px #0007;
}

.network-dialog::backdrop {
    background: #0f172aa8;
    backdrop-filter: blur(2px);
}

.network-dialog form {
    padding: 22px;
}

.network-dialog header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 17px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eef2f7;
}

.network-dialog h2 {
    margin: 0 0 5px;
    font-size: 19px;
}

.network-dialog header p {
    direction: ltr;
    margin: 0;
    color: #64748b;
    text-align: right;
    font-size: 11px;
}

.dialog-close {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 9px;
    background: #f1f5f9;
    font-size: 22px;
    cursor: pointer;
}

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

.field {
    display: grid;
    gap: 7px;
    margin-bottom: 13px;
}

.field label {
    color: #475569;
    font-size: 12px;
    font-weight: 700;
}

.field input,
.field select,
.field textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #dbe2ea;
    border-radius: 10px;
    background: white;
    outline: 0;
}

.field input,
.field select {
    height: 43px;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px #2563eb14;
}

.network-dialog footer {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    padding-top: 16px;
    border-top: 1px solid #eef2f7;
}

.primary-button,
.secondary-button {
    height: 41px;
    padding: 0 19px;
    border: 0;
    border-radius: 10px;
    font-weight: 700;
    cursor: pointer;
}

.primary-button {
    background: #2563eb;
    color: white;
}

.secondary-button {
    background: #e2e8f0;
    color: #334155;
}

.form-error {
    margin-bottom: 13px;
    padding: 10px;
    border-radius: 9px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 12px;
}

@media (max-width: 760px) {
    .map-content {
        padding: 8px;
    }

    .map-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .map-search {
        width: 100%;
    }

    .map-actions {
        overflow: auto;
    }

    .map-tool {
        white-space: nowrap;
    }

    #networkMap {
        height: calc(100vh - 245px);
        min-height: 430px;
        border-radius: 13px;
    }

    .map-summary {
        flex-wrap: nowrap;
        overflow: auto;
    }

    .map-summary span {
        white-space: nowrap;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .map-notice {
        top: 125px;
    }
}

/* FTTH_STAFF_INTERFACE */
.success-message{margin-bottom:16px;padding:12px 14px;border:1px solid #bbf7d0;border-radius:11px;background:#f0fdf4;color:#15803d;font-size:13px;font-weight:700}
.staff-error{margin:0 0 16px}.staff-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:18px}
.staff-summary article{padding:17px;border:1px solid #e6ebf2;border-radius:15px;background:#fff}.staff-summary span{display:block;color:#64748b;font-size:12px}.staff-summary strong{display:block;margin-top:7px;font-size:25px}
.table-card{overflow:hidden;border:1px solid #e6ebf2;border-radius:16px;background:#fff}.table-responsive{overflow:auto}.data-table{width:100%;border-collapse:collapse;white-space:nowrap}.data-table th,.data-table td{padding:13px 14px;border-bottom:1px solid #edf2f7;text-align:right;font-size:12px}.data-table th{background:#f8fafc;color:#475569;font-size:11px}.data-table td strong,.data-table td small{display:block}.data-table td small{margin-top:4px;color:#94a3b8;font-size:9px}
.role-badge,.account-status{display:inline-flex;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:700}.role-badge.technician{background:#dbeafe;color:#1d4ed8}.role-badge.supervisor{background:#ede9fe;color:#6d28d9}.account-status.active{background:#dcfce7;color:#15803d}.account-status.inactive{background:#fee2e2;color:#b91c1c}
.table-actions{display:flex;align-items:center;gap:6px}.table-actions form{margin:0}.small-button{height:31px;padding:0 9px;border:0;border-radius:8px;background:#e2e8f0;color:#334155;font-size:10px;font-weight:700;cursor:pointer}.small-button.danger{background:#fee2e2;color:#b91c1c}.small-button.success{background:#dcfce7;color:#15803d}.empty-table{text-align:center!important;color:#94a3b8;padding:35px!important}.staff-dialog{width:min(650px,calc(100% - 24px))}.password-dialog{width:min(460px,calc(100% - 24px))}
@media(max-width:760px){.staff-summary{grid-template-columns:1fr 1fr;gap:8px}.staff-summary article{padding:13px}.page-heading .primary-button{padding:0 10px}.table-card{border-radius:12px}}

/* FTTH_TICKETS_INTERFACE */
.page-action-link{display:inline-grid;place-items:center;text-decoration:none}.ticket-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px}.ticket-summary article{position:relative;overflow:hidden;padding:16px;border:1px solid #e6ebf2;border-radius:14px;background:#fff}.ticket-summary article:before{position:absolute;right:0;top:0;bottom:0;width:4px;background:currentColor;content:""}.ticket-summary span{display:block;color:#64748b;font-size:11px}.ticket-summary strong{display:block;margin-top:7px;color:#172033;font-size:24px}
.ticket-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;padding:12px;border:1px solid #e6ebf2;border-radius:14px;background:#fff}.ticket-filters input{flex:1;min-width:220px}.ticket-filters input,.ticket-filters select{height:40px;padding:0 10px;border:1px solid #dbe2ea;border-radius:9px;background:#fff;outline:0}.ticket-filters button,.ticket-filters a{display:grid;place-items:center;height:40px;padding:0 15px;border:0;border-radius:9px;text-decoration:none;cursor:pointer}.ticket-filters button{background:#111827;color:#fff}.ticket-filters a{background:#e2e8f0;color:#334155}
.priority-badge,.ticket-status{display:inline-flex;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:800}.priority-badge.normal{background:#e2e8f0;color:#475569}.priority-badge.important{background:#fef3c7;color:#b45309}.priority-badge.urgent{background:#fee2e2;color:#b91c1c}.ticket-status.new{background:#dbeafe;color:#1d4ed8}.ticket-status.assigned,.ticket-status.accepted{background:#ede9fe;color:#6d28d9}.ticket-status.en_route,.ticket-status.arrived{background:#cffafe;color:#0e7490}.ticket-status.in_progress{background:#ffedd5;color:#c2410c}.ticket-status.pending{background:#fef3c7;color:#a16207}.ticket-status.completed{background:#dcfce7;color:#15803d}.ticket-status.closed{background:#d1fae5;color:#065f46}.ticket-status.cancelled{background:#fee2e2;color:#991b1b}.urgent-row{background:#fff7f7}.table-link{display:inline-grid;place-items:center;text-decoration:none}.custom-pagination{display:flex;justify-content:center;gap:5px;margin-top:16px}.custom-pagination a,.custom-pagination span{display:grid;place-items:center;min-width:35px;height:35px;padding:0 9px;border:1px solid #dbe2ea;border-radius:8px;background:#fff;color:#334155;text-decoration:none;font-size:11px}.custom-pagination .current{border-color:#2563eb;background:#2563eb;color:#fff}.custom-pagination .disabled,.custom-pagination .dots{color:#94a3b8}
.ticket-create-card{padding:22px;border:1px solid #e6ebf2;border-radius:17px;background:#fff}.ticket-create-card h2{margin:6px 0 14px;padding-right:10px;border-right:4px solid #2563eb;font-size:15px}.ticket-create-card h2:not(:first-child){margin-top:23px}.ticket-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 13px}.ticket-form-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;padding-top:17px;border-top:1px solid #e6ebf2}.ticket-form-error{margin:0 0 15px}.ticket-form-error ul{margin:0;padding-right:18px}.form-help{margin:0 0 9px;color:#64748b;font-size:11px}#ticketLocationMap{height:350px;border:1px solid #dbe2ea;border-radius:13px}
.ticket-show-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:17px}.ticket-show-heading h1{margin:7px 0 3px;font-size:27px}.ticket-show-heading p{margin:0;color:#64748b}.back-link{color:#2563eb;text-decoration:none;font-size:11px}.ticket-heading-badges{display:flex;gap:7px}.ticket-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px}.ticket-main-column,.ticket-side-column{display:grid;align-content:start;gap:14px}.detail-card{padding:19px;border:1px solid #e6ebf2;border-radius:15px;background:#fff}.detail-card h2{margin:0 0 15px;font-size:15px}.detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.detail-grid div,.side-detail{display:grid;gap:5px}.detail-grid span,.side-detail span{color:#64748b;font-size:10px}.detail-grid strong,.side-detail strong{font-size:12px}.detail-text{margin:0;white-space:pre-wrap;line-height:1.9;font-size:13px}.gps-action{display:inline-grid;place-items:center;margin-top:15px;padding:9px 13px;border-radius:9px;background:#dbeafe;color:#1d4ed8;text-decoration:none;font-size:11px;font-weight:800}.note-box,.resolution-box{margin-top:14px;padding:13px;border-radius:10px}.note-box{background:#fff7ed;color:#9a3412}.resolution-box{background:#f0fdf4;color:#166534}.note-box p,.resolution-box p{margin:6px 0 0;white-space:pre-wrap;line-height:1.7;font-size:12px}
.work-actions-card form{margin:0}.workflow-row{display:flex;gap:8px}.workflow-button{width:100%;min-height:45px;margin-top:7px;border:0;border-radius:10px;color:#fff;font-weight:800;cursor:pointer}.workflow-button.accepted{background:#7c3aed}.workflow-button.en_route{background:#0891b2}.workflow-button.arrived{background:#0284c7}.workflow-button.in_progress{background:#ea580c}.workflow-button.pending{background:#ca8a04}.workflow-button.completed{background:#16a34a}.workflow-button.closed{background:#047857}.assign-form{margin-top:15px;padding-top:15px;border-top:1px solid #e6ebf2}.assign-form .primary-button{width:100%}.cancel-ticket-button{width:100%;height:42px;border:1px solid #fecaca;border-radius:10px;background:#fff;color:#b91c1c;font-weight:800;cursor:pointer}.cancel-confirm-button{height:41px;padding:0 17px;border:0;border-radius:9px;background:#dc2626;color:#fff;font-weight:800;cursor:pointer}
.ticket-timeline{display:grid}.ticket-timeline article{position:relative;display:grid;grid-template-columns:22px 1fr;gap:9px;padding-bottom:18px}.ticket-timeline article:not(:last-child):before{position:absolute;top:15px;right:7px;bottom:0;width:2px;background:#e2e8f0;content:""}.timeline-dot{position:relative;z-index:1;width:16px;height:16px;border:4px solid #dbeafe;border-radius:50%;background:#2563eb}.timeline-dot.completed,.timeline-dot.closed{border-color:#bbf7d0;background:#16a34a}.timeline-dot.cancelled{border-color:#fecaca;background:#dc2626}.ticket-timeline strong,.ticket-timeline small{display:block}.ticket-timeline small{margin-top:4px;color:#94a3b8;font-size:9px}.ticket-timeline p{margin:6px 0 0;color:#475569;font-size:11px}.work-dialog{width:min(620px,calc(100% - 24px))}
@media(max-width:1050px){.ticket-layout{grid-template-columns:1fr}.ticket-side-column{grid-template-columns:1fr 1fr}.detail-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.ticket-summary{grid-template-columns:1fr 1fr}.ticket-summary article:last-child{grid-column:span 2}.ticket-filters{display:grid;grid-template-columns:1fr 1fr}.ticket-filters input{grid-column:span 2;min-width:0;width:100%}.ticket-form-grid{grid-template-columns:1fr}.ticket-show-heading{align-items:flex-start}.ticket-heading-badges{flex-direction:column}.ticket-side-column{grid-template-columns:1fr}.detail-grid{grid-template-columns:1fr 1fr}.ticket-create-card{padding:15px}#ticketLocationMap{height:300px}.workflow-row{flex-direction:column}.ticket-table th,.ticket-table td{padding:11px}}

/* FTTH_REPORTS_INTERFACE */
.export-button{display:grid;place-items:center;height:41px;padding:0 15px;border-radius:10px;background:#047857;color:#fff;text-decoration:none;font-size:12px;font-weight:800}.report-filter{display:flex;align-items:end;gap:10px;margin-bottom:16px;padding:13px;border:1px solid #e6ebf2;border-radius:14px;background:#fff}.report-filter .field{margin:0}.report-filter input{min-width:170px}.report-filter button{height:43px;padding:0 16px;border:0;border-radius:9px;background:#111827;color:#fff;font-weight:700;cursor:pointer}
.report-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:13px}.report-kpis article{position:relative;overflow:hidden;padding:15px;border:1px solid #e6ebf2;border-radius:14px;background:#fff;color:#2563eb}.report-kpis article:before{position:absolute;top:0;right:0;bottom:0;width:4px;background:currentColor;content:""}.report-kpis span{display:block;color:#64748b;font-size:11px}.report-kpis strong{display:block;margin-top:7px;color:#172033;font-size:24px}
.time-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-bottom:13px}.time-kpis article{padding:16px;border:1px solid #bae6fd;border-radius:14px;background:#f0f9ff}.time-kpis span{display:block;color:#0369a1;font-size:11px}.time-kpis strong{display:block;margin-top:8px;color:#0c4a6e;font-size:17px}
.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-bottom:13px}.report-card{padding:18px;border:1px solid #e6ebf2;border-radius:15px;background:#fff}.report-card h2{margin:0 0 16px;font-size:14px}.bar-list{display:grid;gap:11px}.bar-list header{display:flex;justify-content:space-between;margin-bottom:5px;color:#475569;font-size:11px}.bar-list i{display:block;height:8px;overflow:hidden;border-radius:999px;background:#e2e8f0}.bar-list b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2563eb,#06b6d4)}.type-bars b{background:linear-gradient(90deg,#7c3aed,#ec4899)}
.daily-card{margin-bottom:13px;overflow:hidden}.daily-bars{display:flex;align-items:end;gap:7px;min-height:210px;overflow:auto;padding:5px 2px}.daily-item{display:grid;grid-template-rows:18px 150px 18px;gap:4px;min-width:34px;text-align:center}.daily-item span{color:#64748b;font-size:8px;writing-mode:vertical-rl}.daily-item i{position:relative;display:flex;align-items:end;justify-content:center;width:20px;height:150px;margin:auto;border-radius:5px;background:#eff6ff}.daily-item b{display:block;width:100%;border-radius:5px;background:linear-gradient(180deg,#06b6d4,#2563eb)}.daily-item strong{font-size:9px}
.completion-rate{display:inline-flex;padding:5px 8px;border-radius:999px;background:#dcfce7;color:#15803d;font-size:10px;font-weight:800}.rank-list{display:grid}.rank-list div{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #edf2f7;font-size:11px}.rank-list strong{display:grid;place-items:center;min-width:30px;height:27px;border-radius:8px;background:#dbeafe;color:#1d4ed8}.report-empty{margin:0;color:#94a3b8;text-align:center;font-size:11px}
@media(max-width:950px){.report-kpis{grid-template-columns:1fr 1fr}.report-grid{grid-template-columns:1fr}}
@media(max-width:760px){.report-filter{display:grid;grid-template-columns:1fr 1fr}.report-filter input{min-width:0}.report-filter button{grid-column:span 2}.time-kpis{grid-template-columns:1fr}.report-card{padding:14px}.daily-bars{min-height:190px}.hotspots-grid{grid-template-columns:1fr}}

/* FTTH_SUBSCRIPTION_MAP_INTERFACE */
.map-tool.subscription{background:#16a34a}
.network-marker.house,.network-marker.house::after{background:#16a34a}
.house-popup{min-width:235px}.popup-subscription{display:grid;gap:3px;padding:7px 0;border-top:1px solid #e2e8f0}.popup-subscription b{font-size:12px}.popup-subscription span{font-size:10px}
.popup-gps,.popup-add-subscription{display:block;width:100%;margin-top:7px;padding:7px;border:0;border-radius:8px;text-align:center;text-decoration:none;font-family:Tahoma,Arial,sans-serif;font-size:11px;font-weight:700;cursor:pointer}
.popup-gps{background:#dbeafe;color:#1d4ed8}.popup-add-subscription{background:#dcfce7;color:#15803d}
.subscription-dialog{width:min(880px,calc(100% - 24px));max-height:92vh}.subscription-dialog form{max-height:92vh;overflow:auto}
.form-section-title{margin:17px 0 11px;padding-right:10px;border-right:4px solid #2563eb;color:#1e293b;font-size:14px}
.subscription-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 12px}.subscription-grid .wide{grid-column:span 2}
.advanced-fields{margin:10px 0 16px;border:1px solid #e2e8f0;border-radius:11px;background:#f8fafc}.advanced-fields summary{padding:13px;cursor:pointer;color:#334155;font-size:12px;font-weight:700}.advanced-fields .subscription-grid{padding:0 13px 5px}
@media(max-width:760px){.subscription-dialog{width:calc(100% - 12px)}.subscription-dialog form{padding:15px}.subscription-grid{grid-template-columns:1fr}.subscription-grid .wide{grid-column:auto}.form-section-title{margin-top:14px}}

/* MAS_FTTH_HOUSES_SUBSCRIPTIONS_V1 */
.records-tabs{display:flex;gap:7px;margin-bottom:14px;padding:6px;border:1px solid #e6ebf2;border-radius:12px;background:#fff}.records-tabs a{display:grid;min-height:39px;place-items:center;padding:0 18px;border-radius:9px;color:#475569;text-decoration:none;font-size:11px;font-weight:800}.records-tabs a.active{background:#2563eb;color:#fff;box-shadow:0 5px 13px #2563eb2e}
.record-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:15px}.record-summary article{position:relative;overflow:hidden;padding:17px;border:1px solid #e6ebf2;border-radius:14px;background:#fff;color:#2563eb}.record-summary article:before{position:absolute;top:0;right:0;bottom:0;width:4px;background:currentColor;content:""}.record-summary article.green{color:#16a34a}.record-summary article.cyan{color:#0891b2}.record-summary article.orange{color:#ea580c}.record-summary article.red{color:#dc2626}.record-summary article.gray{color:#64748b}.record-summary span{display:block;color:#64748b;font-size:11px}.record-summary strong{display:block;margin-top:7px;color:#172033;font-size:25px}
.record-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;padding:12px;border:1px solid #e6ebf2;border-radius:14px;background:#fff}.record-filters input{flex:1;min-width:250px}.record-filters input,.record-filters select{height:41px;padding:0 10px;border:1px solid #dbe2ea;border-radius:9px;background:#fff;outline:0;font-family:inherit;font-size:11px}.record-filters button,.record-filters a{display:grid;place-items:center;height:41px;padding:0 15px;border:0;border-radius:9px;text-decoration:none;font-family:inherit;font-size:11px;font-weight:800;cursor:pointer}.record-filters button{background:#111827;color:#fff}.record-filters a{background:#e2e8f0;color:#334155}
.record-table-card{overflow:hidden;border:1px solid #e6ebf2;border-radius:15px;background:#fff}.records-table td strong,.records-table td small{display:block}.records-table td small{margin-top:4px;color:#64748b;font-size:9px}.record-status{display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;white-space:nowrap;font-size:9px;font-weight:800}.record-status.available,.record-status.pending{background:#fef3c7;color:#a16207}.record-status.connected,.record-status.active{background:#dcfce7;color:#15803d}.record-status.inactive,.record-status.disconnected{background:#e2e8f0;color:#475569}.record-status.suspended{background:#ffedd5;color:#c2410c}.record-status.fault{background:#fee2e2;color:#b91c1c}.record-actions{display:flex;gap:5px}.record-actions a{display:grid;place-items:center;min-height:30px;padding:0 9px;border-radius:8px;background:#eff6ff;color:#1d4ed8;text-decoration:none;font-size:9px;font-weight:800}.record-actions a.gps{background:#dcfce7;color:#15803d}.record-empty{padding:35px!important;color:#94a3b8;text-align:center}.record-inline-link{color:#2563eb;text-decoration:none;font-weight:800}
.signal-badge{display:inline-flex;padding:5px 7px;border-radius:7px;font-size:9px;font-weight:800}.signal-badge.good{background:#dcfce7;color:#15803d}.signal-badge.medium{background:#fef3c7;color:#a16207}.signal-badge.weak{background:#fee2e2;color:#b91c1c}.signal-badge.unknown{background:#e2e8f0;color:#64748b}
.record-show-heading{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:17px}.record-show-heading h1{margin:7px 0 4px;font-size:27px}.record-show-heading p{margin:0;color:#64748b}.record-heading-actions{display:flex;gap:7px}.record-link-button{display:grid;place-items:center;min-height:39px;padding:0 13px;border-radius:9px;text-decoration:none;font-size:10px;font-weight:800}.record-link-button.map{background:#dbeafe;color:#1d4ed8}.record-link-button.gps{background:#dcfce7;color:#15803d}
.record-two-columns{display:grid;grid-template-columns:minmax(0,1fr) 330px;align-items:start;gap:14px}.record-two-columns>div{display:grid;gap:14px}.record-detail-card{margin-bottom:14px;padding:19px;border:1px solid #e6ebf2;border-radius:15px;background:#fff}.record-detail-card header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}.record-detail-card header h2{margin:0;font-size:15px}.record-detail-card header>a{color:#2563eb;text-decoration:none;font-size:10px}.record-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.record-detail-grid div,.record-side-list div{display:grid;gap:5px}.record-detail-grid span,.record-side-list span{color:#64748b;font-size:10px}.record-detail-grid strong,.record-side-list strong{overflow-wrap:anywhere;font-size:11px}.record-detail-grid a{color:#2563eb;text-decoration:none}.record-side-list{display:grid;gap:12px}.record-side-list div{padding-bottom:10px;border-bottom:1px solid #edf2f7}.record-note{margin-top:15px;padding:13px;border-radius:10px;background:#f8fafc;white-space:pre-wrap;color:#475569;font-size:11px;line-height:1.8}
.record-ticket-list{display:grid}.record-ticket-list a{display:grid;grid-template-columns:1fr auto;gap:4px;padding:10px 0;border-bottom:1px solid #edf2f7;color:#172033;text-decoration:none}.record-ticket-list span{color:#2563eb;font-size:9px;font-weight:800}.record-ticket-list small{grid-column:1/-1;color:#64748b;font-size:9px}
.record-edit-form h3{margin:20px 0 11px;padding-right:9px;border-right:3px solid #2563eb;font-size:13px}.record-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.record-form-grid label{display:grid;align-content:start;gap:6px}.record-form-grid label>span{color:#475569;font-size:10px;font-weight:800}.record-form-grid input,.record-form-grid select,.record-form-grid textarea{width:100%;padding:0 10px;border:1px solid #dbe2ea;border-radius:9px;background:#fff;font-family:inherit;font-size:11px;outline:0}.record-form-grid input,.record-form-grid select{height:41px}.record-form-grid textarea{padding-top:10px;resize:vertical}.record-form-grid .wide{grid-column:span 2}.record-edit-form>.primary-button{margin-top:15px;border:0;cursor:pointer}
@media(max-width:1050px){.record-detail-grid{grid-template-columns:1fr 1fr}.record-form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.record-summary{grid-template-columns:1fr 1fr}.record-two-columns{grid-template-columns:1fr}.record-show-heading{align-items:flex-start;flex-direction:column}.record-heading-actions{width:100%}.record-heading-actions a{flex:1}.record-form-grid{grid-template-columns:1fr}.record-form-grid .wide{grid-column:auto}.records-table{min-width:920px}}

/* MAS_FTTH_TENANT_SERVICE_PACKAGES_V1 */
#planName:invalid{color:#64748b}
#planName option{color:#0f172a}

/* MAS_FTTH_FULL_RECORD_EDIT_V1 */
.popup-edit-network{display:block;width:100%;margin-top:8px;padding:7px;border:0;border-radius:8px;background:#ede9fe;color:#6d28d9;font-family:Tahoma,Arial,sans-serif;font-size:10px;font-weight:900;cursor:pointer}.record-actions a.edit{background:#ede9fe;color:#6d28d9}#subscription-edit{scroll-margin-top:90px}

/* MAS_FTTH_ORGANIZED_HOUSES_SATELLITE_V1 */
/* MAS_FTTH_CABINET_GIS_COVERAGE_V1 */
.map-layout-note{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:0 0 10px;
    padding:9px 13px;
    border:1px solid #bfdbfe;
    border-radius:12px;
    background:linear-gradient(135deg,#eff6ff,#f8fafc);
    color:#1e3a8a;
    font-size:12px;
    font-weight:800;
}
.ftth-organized-fiber-line{
    filter:drop-shadow(0 1px 1px rgba(15,23,42,.32));
}
.coverage-draw-bar{
    position:relative;
    z-index:700;
    display:grid;
    grid-template-columns:minmax(180px,.7fr) minmax(220px,1fr) auto;
    align-items:center;
    gap:12px;
    margin:0 0 10px;
    padding:12px 14px;
    border:1px solid #93c5fd;
    border-radius:14px;
    background:#eff6ff;
    box-shadow:0 8px 22px rgba(37,99,235,.12);
}
.coverage-draw-bar[hidden]{
    display:none!important;
}
.coverage-draw-bar>div:first-child{
    display:flex;
    flex-direction:column;
    gap:3px;
}
.coverage-draw-bar strong{
    color:#1e3a8a;
    font-size:14px;
}
.coverage-draw-bar span,
.coverage-draw-bar p{
    margin:0;
    color:#475569;
    font-size:12px;
}
.coverage-draw-actions{
    display:flex;
    align-items:center;
    gap:7px;
}
.coverage-draw-actions button,
.coverage-popup-controls button{
    min-height:35px;
    padding:7px 11px;
    border:0;
    border-radius:9px;
    background:#dbeafe;
    color:#1e3a8a;
    cursor:pointer;
    font:inherit;
    font-size:12px;
    font-weight:900;
}
.coverage-draw-actions button:last-child,
.popup-draw-coverage{
    background:#2563eb!important;
    color:#fff!important;
}
.coverage-draw-actions button:disabled{
    cursor:not-allowed;
    opacity:.45;
}
.coverage-popup-controls{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    margin-top:7px;
    padding-top:8px;
    border-top:1px solid #e2e8f0;
}
.coverage-popup-controls label{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:#334155;
    font-size:12px;
    font-weight:800;
}
.coverage-color-input{
    width:46px;
    height:30px;
    padding:2px;
    border:1px solid #cbd5e1;
    border-radius:8px;
    background:#fff;
}
.popup-delete-coverage{
    background:#fee2e2!important;
    color:#b91c1c!important;
}
.drawing-coverage{
    cursor:crosshair!important;
}
.coverage-point-label{
    width:18px!important;
    height:18px!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#0f172a!important;
    color:#fff!important;
    box-shadow:none!important;
    font-size:10px!important;
    font-weight:900!important;
    line-height:18px!important;
    text-align:center!important;
}
.leaflet-control-layers-expanded{
    min-width:132px;
    border:1px solid rgba(15,23,42,.14);
    border-radius:12px;
    box-shadow:0 8px 24px rgba(15,23,42,.14);
}
.leaflet-control-layers-base label{
    font-weight:900;
}
@media (max-width:700px){
    .map-layout-note{
        align-items:flex-start;
        flex-direction:column;
        gap:3px;
    }
    .coverage-draw-bar{
        grid-template-columns:1fr;
    }
    .coverage-draw-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
    .coverage-draw-actions button:last-child{
        grid-column:1/-1;
    }
    .leaflet-control-layers-expanded{
        min-width:118px;
        font-size:12px;
    }
}

/* MAS_FTTH_QUICK_DUPLICATE_RECORDS_V1 */
.popup-record-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin-top:8px;
}
.popup-record-actions button{
    min-height:34px;
    padding:7px 9px;
    border:0;
    border-radius:9px;
    cursor:pointer;
    font:inherit;
    font-size:12px;
    font-weight:900;
}
.popup-duplicate-network,
.popup-duplicate-house{
    background:#ede9fe;
    color:#6d28d9;
}
