/*
Theme Name: Next G Alliance KPI Network
Description: Shared visual framework for the portal, Applications and Sustainability.
Template: hello-elementor
Version: 0.1.2
Text Domain: kpi-network
*/
/* Preserved compatibility rules */

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
}

#breadcrumbs{
	width:100%
}

.site-header .site-title {
    font-weight: 700;
    font-size: 5rem;
}

.use-case-content {
    margin-bottom: 2rem;
}
h1.entry-title{
    border-bottom: 1px solid #000;
    padding-bottom: 20px;
    }
    
ul.related-devices {

    font-size: 2rem;
}

.kpi-table-container {
    overflow-x: auto;
}

.kpi-table {
    width: 100%;
    border-collapse: collapse;
}

.kpi-table th,
.kpi-table td {
    border: 1px solid #ddd;
    padding: 10px;
    vertical-align: top;
    text-align: left;
}

.kpi-table th {
    background: #f5f5f5;
    font-weight: 700;
}

.kpi-table td.kpi-notes {
    min-width: 260px;
}

@media (max-width: 900px) {
    .kpi-table,
    .kpi-table thead,
    .kpi-table tbody,
    .kpi-table th,
    .kpi-table td,
    .kpi-table tr {
        display: block;
        width: 100%;
    }

    .kpi-table thead {
        display: none;
    }

    .kpi-table tr {
        margin-bottom: 12px;
        border: 1px solid #ddd;
        background: #fff;
    }

    .kpi-table td {
        border: none;
        border-bottom: 1px solid #eee;
    }

    .kpi-table td::before {
        content: attr(data-label);
        display: block;
        font-weight: 700;
        margin-bottom: 4px;
    }
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
}

#breadcrumbs{
	width:100%
}

.site-header .site-title {
    font-weight: 700;
    font-size: 5rem;
}

.use-case-content {
    margin-bottom: 2rem;
}
h1.entry-title{
    border-bottom: 1px solid #000;
    padding-bottom: 20px;
    }
    
ul.related-devices {

    font-size: 2rem;
}

/* Legacy compatibility rules are prepended on the isolated host. */
:root{--kpi-navy:#173652;--kpi-blue:#2e60a4;--kpi-blue-dark:#204b83;--kpi-text:#263b50;--kpi-muted:#607286;--kpi-line:#dce4ed;--kpi-surface:#fff;--kpi-background:#f4f7fb;--kpi-radius:12px;--kpi-font:Arial,Helvetica,sans-serif}
html{scroll-padding-top:120px}
body.kpi-network{margin:0;background:var(--kpi-background);color:var(--kpi-text);font-family:var(--kpi-font);font-size:16px;line-height:1.65}
.kpi-network *, .kpi-network *::before,.kpi-network *::after{box-sizing:border-box}
.kpi-network h1,.kpi-network h2,.kpi-network h3,.kpi-network h4,.kpi-network p,.kpi-network a,.kpi-network input,.kpi-network select,.kpi-network textarea,.kpi-network button,.kpi-network .elementor-heading-title{font-family:var(--kpi-font)!important}
.kpi-network h1{font-size:clamp(28px,3.2vw,42px);line-height:1.2;color:var(--kpi-navy);font-weight:600;letter-spacing:-.025em;margin:0 0 24px}
.kpi-network h2{font-size:clamp(23px,2.4vw,30px);line-height:1.3;color:var(--kpi-navy);font-weight:600;margin:30px 0 16px}
.kpi-network h3{font-size:21px;line-height:1.4;color:var(--kpi-navy);font-weight:600}
.kpi-network p{margin:0 0 20px}
.kpi-network a{color:var(--kpi-blue);text-underline-offset:3px}
.kpi-network a:hover{color:var(--kpi-blue-dark)}
.kpi-network a:focus-visible,.kpi-network button:focus-visible,.kpi-network input:focus-visible,.kpi-network select:focus-visible,.kpi-network textarea:focus-visible{outline:3px solid #709bd1;outline-offset:3px}
.kpi-masthead{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid var(--kpi-line)}
.admin-bar .kpi-masthead{top:32px}
.kpi-header-inner{max-width:1240px;margin:auto;min-height:102px;padding:20px 30px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.kpi-brand{display:block;flex:0 1 290px;line-height:0}
.kpi-brand img{width:290px;max-width:100%;height:auto;display:block}
.kpi-global-nav{display:flex;align-items:center;gap:8px}
.kpi-global-nav a{padding:11px 18px;font-size:15px;font-weight:600;border-radius:8px;text-decoration:none;color:var(--kpi-navy);white-space:nowrap}
.kpi-global-nav a:hover{background:#edf3fb}
.kpi-global-nav a.is-current{background:var(--kpi-blue);color:#fff}
.kpi-menu-toggle{display:none}
.kpi-section-strip{background:#eaf0f8;border-bottom:1px solid var(--kpi-line)}
.kpi-section-inner{max-width:1240px;margin:auto;padding:13px 30px;display:flex;align-items:center;gap:28px;min-height:56px}
.kpi-section-label{font-size:14px;font-weight:700;color:var(--kpi-navy)}
.kpi-section-description{font-size:14px;color:var(--kpi-muted)}
.kpi-local-nav{display:flex;gap:24px;align-items:center;min-width:0}
.kpi-local-nav a{font-size:14px;color:var(--kpi-muted);text-decoration:none;white-space:nowrap}
.kpi-local-nav a[aria-current],.kpi-local-nav a:hover{color:var(--kpi-blue);text-decoration:underline}
.kpi-network .site-main{max-width:1180px!important;margin:36px auto!important;padding:36px!important;background:#fff;border:1px solid var(--kpi-line);border-radius:var(--kpi-radius);min-width:0}
.kpi-network .page-content,.kpi-network .entry-content{min-width:0;overflow-wrap:anywhere}
.kpi-network .elementor-section.elementor-section-boxed>.elementor-container{max-width:1180px}
.kpi-network .elementor-button,.kpi-network button[type=submit],.kpi-network input[type=submit],.kpi-network #reset-filters{background:var(--kpi-blue)!important;color:#fff!important;border:1px solid var(--kpi-blue)!important;border-radius:8px!important;padding:11px 18px!important;font-size:15px!important;line-height:1.4!important;font-weight:600!important;text-decoration:none}
.kpi-network .elementor-button:hover,.kpi-network button[type=submit]:hover{background:var(--kpi-blue-dark)!important}
.kpi-network input:not([type=checkbox]):not([type=radio]):not([type=submit]),.kpi-network select,.kpi-network textarea{border:1px solid #bccbdb!important;border-radius:7px!important;background:#fff;color:var(--kpi-text);padding:10px 12px!important;font-size:15px;line-height:1.45;max-width:100%;min-width:0}
.kpi-network label{color:var(--kpi-navy);font-size:14px;font-weight:600}
.kpi-network #filter-container,.kpi-network .custom-filter-container{gap:28px}
.kpi-network .custom-filter-form{background:#f5f8fc;padding:20px;border:1px solid var(--kpi-line);border-radius:10px}
.kpi-network .custom-filter-form select{margin-bottom:16px}
.kpi-network .results-count{margin:0 0 18px;padding:12px 16px;background:#edf3fb;border:1px solid #d4e1f1;border-radius:8px;color:var(--kpi-navy);font-weight:600;font-size:15px}
.kpi-network .group-heading{background:#edf3fb!important;color:var(--kpi-navy)!important;border:1px solid var(--kpi-line);border-radius:8px;padding:14px 18px!important;font-size:18px!important;margin:16px 0 0;cursor:pointer}
.kpi-network .group-posts{border:1px solid var(--kpi-line);border-top:0;border-radius:0 0 8px 8px;padding:12px 18px;background:#fff}
.kpi-network .kpi-table-scroll{overflow:auto;max-width:100%;border:1px solid var(--kpi-line);border-radius:8px;margin:20px 0}
.kpi-network table{width:100%;border-collapse:collapse;font-size:15px;margin:0}
.kpi-network th{background:#edf3fb;color:var(--kpi-navy);text-align:left;font-weight:600}
.kpi-network th,.kpi-network td{padding:12px 16px;border:1px solid var(--kpi-line);vertical-align:top}
.kpi-network tbody tr:nth-child(even){background:#f8fafc}
.kpi-footer{background:var(--kpi-navy);color:#fff;margin-top:48px}
.kpi-footer-inner{max-width:1240px;margin:auto;padding:32px 30px;display:flex;justify-content:space-between;align-items:center;gap:28px}
.kpi-footer strong{display:block;font-size:17px;letter-spacing:.02em}
.kpi-footer span{display:block;font-size:13px;color:#d1deeb;margin-top:4px}
.kpi-footer nav{display:flex;gap:24px;flex-wrap:wrap}
.kpi-footer nav a{color:#fff;font-size:14px;text-decoration:none}
.kpi-footer nav a:hover{color:#fff;text-decoration:underline}
.kpi-skip-link{position:fixed;left:20px;top:-100px;background:#fff;padding:10px 16px;z-index:100001}
.kpi-skip-link:focus{top:10px}
@media(max-width:800px){.kpi-header-inner{padding:16px 20px;min-height:88px;gap:16px}.kpi-brand{flex-basis:230px}.kpi-global-nav a{padding:10px 12px;font-size:14px}.kpi-section-inner{padding:12px 20px;gap:16px;flex-wrap:wrap}.kpi-local-nav{overflow-x:auto;max-width:100%;gap:20px;padding-bottom:3px}.kpi-network .site-main{margin:24px 16px!important;padding:24px!important}.kpi-footer-inner{padding:28px 24px;align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.admin-bar .kpi-masthead{top:46px}.kpi-header-inner{min-height:82px;flex-wrap:wrap}.kpi-brand{flex:0 1 230px;max-width:72%}.kpi-menu-toggle{display:inline-flex;align-items:center;gap:12px;border:1px solid var(--kpi-line);border-radius:7px;color:var(--kpi-navy);background:#fff;padding:9px 12px;font-size:14px}.kpi-global-nav{display:none;width:100%;flex-direction:column;align-items:stretch;padding-top:10px;border-top:1px solid var(--kpi-line)}.kpi-global-nav.is-open{display:flex}.kpi-global-nav a{padding:12px 14px}.kpi-section-label{width:100%}.kpi-section-description{font-size:13px}.kpi-network .site-main{padding:22px 18px!important;margin:18px 12px!important}.kpi-network .custom-filter-form{padding:16px}.kpi-network #filter-container,.kpi-network .custom-filter-container{display:block!important}.kpi-network #filter-form-container,.kpi-network #filter-results,.kpi-network .custom-filter-form-container{float:none!important;width:100%!important;margin:0 0 20px!important}.kpi-footer nav{gap:18px}.kpi-network th,.kpi-network td{padding:10px 12px}.kpi-network .elementor-heading-title{line-height:1.25!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Shared rules take precedence over inherited site-specific presentation. */
body.kpi-network h1,body.kpi-network .elementor-heading-title{color:var(--kpi-navy)!important}
body.kpi-network .site-main{width:calc(100% - 60px)!important}
body.kpi-network .site-main p,body.kpi-network .elementor-widget-text-editor{color:var(--kpi-text)!important;font-size:16px;line-height:1.65}
body.kpi-network .kpi-footer,body.kpi-network .kpi-footer strong,body.kpi-network .kpi-footer span,body.kpi-network .kpi-footer nav{font-family:var(--kpi-font)!important}
@media(max-width:800px){body.kpi-network .site-main{width:calc(100% - 32px)!important;margin:24px auto!important}}
@media(max-width:620px){body.kpi-network .site-main{width:calc(100% - 24px)!important;margin:18px auto!important}}
.kpi-page-frame{width:calc(100% - 60px);max-width:1180px;margin:36px auto;padding:36px;background:#fff;border:1px solid var(--kpi-line);border-radius:var(--kpi-radius);min-width:0;overflow-wrap:anywhere}
body.kpi-network .kpi-page-frame .site-main{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;background:transparent;border:0;border-radius:0}
.kpi-page-frame p{font-size:16px;line-height:1.65;color:var(--kpi-text)}
@media(max-width:800px){.kpi-page-frame{width:calc(100% - 32px);margin:24px auto;padding:24px}}
@media(max-width:620px){.kpi-page-frame{width:calc(100% - 24px);margin:18px auto;padding:22px 18px}}
.kpi-page-frame table,.kpi-page-frame th,.kpi-page-frame td,.kpi-page-frame li,.kpi-page-frame strong{font-family:Arial,Helvetica,sans-serif!important}
.kpi-network .feedback-button{background:var(--kpi-blue)!important;color:#fff!important;border:0!important;font-family:Arial,Helvetica,sans-serif!important;border-radius:8px!important}

/* Keep block-editor calls to action consistent with the shared portal buttons. */
.kpi-network .wp-block-button__link,.kpi-network .wp-element-button{display:inline-block;background:var(--kpi-blue)!important;color:#fff!important;border:1px solid var(--kpi-blue)!important;border-radius:8px!important;padding:11px 18px!important;font:600 15px/1.4 Arial,Helvetica,sans-serif!important;text-decoration:none!important;text-align:center;max-width:100%;white-space:normal}
.kpi-network .wp-block-button__link:hover,.kpi-network .wp-element-button:hover{background:var(--kpi-blue-dark)!important;color:#fff!important}
/* Tables retain their full contents and headings without horizontal scrolling. */
.kpi-network .kpi-table-wrap{width:100%;max-width:100%;margin:20px 0;overflow:visible;border:1px solid var(--kpi-line);border-radius:8px}
.kpi-network .kpi-table-wrap table{width:100%!important;max-width:100%!important;min-width:0!important;table-layout:fixed!important;margin:0}
.kpi-network .kpi-table-wrap th,.kpi-network .kpi-table-wrap td{min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
.kpi-network [data-kpi-span-copy]{display:none!important}
@media(max-width:900px){
 .kpi-network .kpi-table-wrap{border:0;border-radius:0}
 .kpi-network table[data-kpi-responsive],.kpi-network table[data-kpi-responsive]>tbody{display:block!important;width:100%!important;max-width:100%!important}
 .kpi-network table[data-kpi-responsive]>thead{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
 .kpi-network table[data-kpi-responsive]>tbody>tr,.kpi-network table[data-kpi-responsive]>tr{display:grid!important;grid-template-columns:minmax(0,1fr)!important;margin:0 0 18px!important;padding:0!important;border:1px solid var(--kpi-line)!important;border-radius:8px;background:#fff!important;overflow:visible}
 .kpi-network table[data-kpi-responsive]>tbody>tr>td,.kpi-network table[data-kpi-responsive]>tbody>tr>th,.kpi-network table[data-kpi-responsive]>tr>td,.kpi-network table[data-kpi-responsive]>tr>th{display:block!important;width:auto!important;max-width:100%!important;padding:12px 16px!important;border:0!important;border-bottom:1px solid var(--kpi-line)!important;text-align:left!important}
 .kpi-network table[data-kpi-responsive] tr>td:last-child,.kpi-network table[data-kpi-responsive] tr>th:last-child{border-bottom:0!important}
 .kpi-network table[data-kpi-responsive] td[data-kpi-label]:not([data-kpi-label=""])::before,.kpi-network table[data-kpi-responsive] th[data-kpi-label]:not([data-kpi-label=""])::before{content:attr(data-kpi-label);display:block!important;margin:0 0 5px;color:var(--kpi-navy);font-weight:700;font-size:13px;line-height:1.4}
 .kpi-network table[data-kpi-responsive] [data-kpi-row-title]{background:#edf3fb!important;font-weight:600}
 .kpi-network table[data-kpi-responsive] [data-kpi-span-copy]{display:block!important}
}
@media(max-width:800px){.kpi-network .kpi-local-nav{flex-wrap:wrap;overflow:visible;gap:8px 20px}}
@media(max-width:620px){.kpi-header-inner{gap:12px}.kpi-brand{flex:1 1 0;max-width:min(230px,calc(100% - 96px))}.kpi-menu-toggle{flex:0 0 auto}.kpi-page-frame h1,.kpi-page-frame h1.elementor-heading-title{font-size:clamp(1.65rem,6vw,2rem)!important;line-height:1.25!important}}

.kpi-network table[data-kpi-responsive] td::before,.kpi-network table[data-kpi-responsive] th::before{display:none}
.kpi-network table[data-kpi-responsive] tr[hidden],.kpi-network table[data-kpi-responsive] tr[style*="display: none"],.kpi-network table[data-kpi-responsive] tr[style*="display:none"],.kpi-network table[data-kpi-responsive] tbody[hidden]{display:none!important}

.kpi-filter-toggle{display:none}
@media(max-width:900px){
 .kpi-network .kpi-filter-toggle{display:block;width:100%;margin:0 0 16px;padding:12px 16px;border:1px solid var(--kpi-line);border-radius:8px;background:#edf3fb;color:var(--kpi-navy);text-align:left;font:600 15px/1.5 Arial,Helvetica,sans-serif}
 .kpi-network #filter-container{display:block!important}
 .kpi-network #filter-form-container,.kpi-network #filter-results-container,.kpi-network #filter-results{float:none!important;width:100%!important;max-width:100%!important;min-width:0!important}
 .kpi-network #filter-form-container.kpi-filters-collapsed{display:none!important}
}

.kpi-page-frame .grid-container{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))!important;max-width:100%;min-width:0}
.kpi-page-frame .grid-container .grid-item{width:auto!important;min-width:0!important;max-width:100%;box-sizing:border-box}


/* Legacy detail templates position their generated labels absolutely. Reset the
   complete label layout so responsive labels occupy their own line. */
@media(max-width:900px){
 .kpi-network table[data-kpi-responsive] td[data-kpi-label]::before,.kpi-network table[data-kpi-responsive] th[data-kpi-label]::before{position:static!important;inset:auto!important;width:auto!important;max-width:100%!important;float:none!important;transform:none!important;white-space:normal!important;text-align:left!important}
}