@charset "UTF-8";/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ html{line-height:1.15;-webkit-text-size-adjust:100%}
body{margin:0}
main{display:block}
h1{font-size:2em;margin:0.67em 0}
hr{box-sizing:content-box;height:0;overflow:visible}
pre{font-family:monospace,monospace;font-size:1em}
a{background-color:transparent}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bolder}
code,kbd,samp{font-family:monospace,monospace;font-size:1em}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}
sup{top:-0.5em}
img{border-style:none}
button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}
button,input{overflow:visible}
button,select{text-transform:none}
button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{padding:0.35em 0.75em 0.625em}
legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}
progress{vertical-align:baseline}
textarea{overflow:auto}
[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
details{display:block}
summary{display:list-item}
template{display:none}
[hidden]{display:none}
*{box-sizing:border-box}
body{background-color:#FFFFFF;color:#2F3941;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2{font-weight:800 !important}h3{font-weight:700 !important}
@media (min-width:1024px){body > main{min-height:65vh}
}
h1,h2,h3,h4,h5,h6{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;margin-top:0}
h1{font-size:32px}
h2{font-size:22px}
h3{font-size:18px;font-weight:600}
h4{font-size:16px}
a{color:#1F73B7;text-decoration:none}
a:visited{color:#9358B0}
a:hover,a:active,a:focus{text-decoration:underline}
.hbs-form input,.hbs-form textarea,.search input,.search textarea{color:#000;font-size:14px}
.hbs-form input,.search input{max-width:100%;box-sizing:border-box;transition:border 0.12s ease-in-out}
.hbs-form input:where(:not([type=checkbox])),.search input:where(:not([type=checkbox])){outline:none}
.hbs-form input:where(:not([type=checkbox])):focus,.search input:where(:not([type=checkbox])):focus{border:1px solid #17494D}
.hbs-form input[disabled],.search input[disabled]{background-color:#ddd}
.hbs-form select,.search select{-webkit-appearance:none;-moz-appearance:none;background:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23CCC' d='M0 0h10L5 6 0 0z'/%3E%3C/svg%3E%0A") no-repeat #fff;background-position:right 10px center;border:1px solid #848F99;border-radius:4px;padding:8px 30px 8px 10px;outline:none;color:#555;width:100%}
.hbs-form select:focus,.search select:focus{border:1px solid #17494D}
.hbs-form select::-ms-expand,.search select::-ms-expand{display:none}
.hbs-form textarea,.search textarea{border:1px solid #848F99;border-radius:2px;resize:vertical;width:100%;outline:none;padding:10px}
.hbs-form textarea:focus,.search textarea:focus{border:1px solid #17494D}
.container{max-width:1160px;margin:0 auto;padding:0 5%}
@media (min-width:1160px){.container{padding:0;width:90%}
}
.container-divider{border-top:1px solid #ddd;margin-bottom:20px}
ul{list-style:none;margin:0;padding:0}
.error-page{max-width:1160px;margin:0 auto;padding:0 5%}
@media (min-width:1160px){.error-page{padding:0;width:90%}
}
.visibility-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}
.button,.pagination-next-link,.pagination-prev-link,.pagination-first-link,.pagination-last-link,.subscriptions-subscribe button,.requests-table-toolbar .organization-subscribe button,.community-follow button,.article-subscribe button,.section-subscribe button,.split-button button{background-color:transparent;border:1px solid #17494D;border-radius:4px;color:#17494D;cursor:pointer;display:inline-block;font-size:12px;line-height:2.34;margin:0;padding:0 20px;text-align:center;transition:background-color 0.12s ease-in-out,border-color 0.12s ease-in-out,color 0.15s ease-in-out;user-select:none;white-space:nowrap;width:100%;-webkit-touch-callout:none}
@media (min-width:768px){.button,.pagination-next-link,.pagination-prev-link,.pagination-first-link,.pagination-last-link,.subscriptions-subscribe button,.requests-table-toolbar .organization-subscribe button,.community-follow button,.article-subscribe button,.section-subscribe button,.split-button button{width:auto}
}
.button:visited,.pagination-next-link:visited,.pagination-prev-link:visited,.pagination-first-link:visited,.pagination-last-link:visited,.subscriptions-subscribe button:visited,.requests-table-toolbar .organization-subscribe button:visited,.community-follow button:visited,.article-subscribe button:visited,.section-subscribe button:visited,.split-button button:visited{color:#17494D}
.button:hover,.pagination-next-link:hover,.pagination-prev-link:hover,.pagination-first-link:hover,.pagination-last-link:hover,.subscriptions-subscribe button:hover,.requests-table-toolbar .organization-subscribe button:hover,.community-follow button:hover,.article-subscribe button:hover,.section-subscribe button:hover,.split-button button:hover,.button:active,.pagination-next-link:active,.pagination-prev-link:active,.pagination-first-link:active,.pagination-last-link:active,.subscriptions-subscribe button:active,.requests-table-toolbar .organization-subscribe button:active,.community-follow button:active,.article-subscribe button:active,.section-subscribe button:active,.split-button button:active,.button:focus,.pagination-next-link:focus,.pagination-prev-link:focus,.pagination-first-link:focus,.pagination-last-link:focus,.subscriptions-subscribe button:focus,.requests-table-toolbar .organization-subscribe button:focus,.community-follow button:focus,.article-subscribe button:focus,.section-subscribe button:focus,.split-button button:focus,.button.button-primary,.button-primary.pagination-next-link,.button-primary.pagination-prev-link,.button-primary.pagination-first-link,.button-primary.pagination-last-link,.subscriptions-subscribe button.button-primary,.subscriptions-subscribe button[data-selected=true],.requests-table-toolbar .organization-subscribe button.button-primary,.requests-table-toolbar .organization-subscribe button[data-selected=true],.community-follow button.button-primary,.article-subscribe button.button-primary,.article-subscribe button[data-selected=true],.section-subscribe button.button-primary,.section-subscribe button[data-selected=true],.split-button button.button-primary{background-color:#17494D;color:#FFFFFF;text-decoration:none}
.button.button-primary:hover,.button-primary.pagination-next-link:hover,.button-primary.pagination-prev-link:hover,.button-primary.pagination-first-link:hover,.button-primary.pagination-last-link:hover,.subscriptions-subscribe button.button-primary:hover,.subscriptions-subscribe button[data-selected=true]:hover,.requests-table-toolbar .organization-subscribe button.button-primary:hover,.requests-table-toolbar .organization-subscribe button[data-selected=true]:hover,.community-follow button.button-primary:hover,.article-subscribe button.button-primary:hover,.article-subscribe button[data-selected=true]:hover,.section-subscribe button.button-primary:hover,.section-subscribe button[data-selected=true]:hover,.split-button button:hover,.button.button-primary:focus,.button-primary.pagination-next-link:focus,.button-primary.pagination-prev-link:focus,.button-primary.pagination-first-link:focus,.button-primary.pagination-last-link:focus,.subscriptions-subscribe button.button-primary:focus,.subscriptions-subscribe button[data-selected=true]:focus,.requests-table-toolbar .organization-subscribe button.button-primary:focus,.requests-table-toolbar .organization-subscribe button[data-selected=true]:focus,.community-follow button.button-primary:focus,.article-subscribe button.button-primary:focus,.article-subscribe button[data-selected=true]:focus,.section-subscribe button.button-primary:focus,.section-subscribe button[data-selected=true]:focus,.split-button button.button-primary:focus,.button.button-primary:active,.button-primary.pagination-next-link:active,.button-primary.pagination-prev-link:active,.button-primary.pagination-first-link:active,.button-primary.pagination-last-link:active,.subscriptions-subscribe button.button-primary:active,.subscriptions-subscribe button[data-selected=true]:active,.requests-table-toolbar .organization-subscribe button.button-primary:active,.requests-table-toolbar .organization-subscribe button[data-selected=true]:active,.community-follow button.button-primary:active,.article-subscribe button.button-primary:active,.article-subscribe button[data-selected=true]:active,.section-subscribe button.button-primary:active,.section-subscribe button[data-selected=true]:active,.split-button button.button-primary:active{background-color:darken(#17494D,20%);border-color:darken(#17494D,20%)}
.button[data-disabled],[data-disabled].pagination-next-link,[data-disabled].pagination-prev-link,[data-disabled].pagination-first-link,[data-disabled].pagination-last-link,.subscriptions-subscribe button[data-disabled],.requests-table-toolbar .organization-subscribe button[data-disabled],.community-follow button[data-disabled],.article-subscribe button[data-disabled],.section-subscribe button[data-disabled],.split-button button[data-disabled]{cursor:default}
.button-large,.hbs-form input[type=submit]{cursor:pointer;background-color:#17494D;border:0;border-radius:4px;color:#FFFFFF;font-size:14px;line-height:2.72;min-width:190px;padding:0 1.9286em;width:100%}
@media (min-width:768px){.button-large,.hbs-form input[type=submit]{width:auto}
}
.button-large:visited,.hbs-form input[type=submit]:visited{color:#FFFFFF}
.button-large:hover,.button-large:active,.button-large:focus,.hbs-form input[type=submit]:hover,.hbs-form input[type=submit]:active,.hbs-form input[type=submit]:focus{background-color:#000}
.button-large[disabled],.hbs-form input[type=submit][disabled]{background-color:#ddd}
.button-secondary{color:#5a6d7c;border:1px solid #848F99;background-color:transparent}
.button-secondary:visited{color:#5a6d7c}
.button-secondary:hover,.button-secondary:focus,.button-secondary:active{color:#2F3941;border:1px solid #848F99;background-color:#f7f7f7}
.split-button{display:flex}
.split-button button{background-color:#17494D;border:0;color:#FFFFFF;height:32px;line-height:16px;outline-color:#17494D}
[dir=rtl] .split-button button:not(:only-child):first-child{border-left:1px solid #FFFFFF;border-top-left-radius:unset;border-bottom-left-radius:unset}
[dir=ltr] .split-button button:not(:only-child):first-child{border-right:1px solid #FFFFFF;border-top-right-radius:unset;border-bottom-right-radius:unset}
.split-button button:not(:only-child):last-child{display:flex;justify-content:center;align-items:center;width:26px;min-width:26px;max-width:26px;padding:0}
[dir=rtl] .split-button button:not(:only-child):last-child{border-top-right-radius:unset;border-bottom-right-radius:unset}
[dir=ltr] .split-button button:not(:only-child):last-child{border-top-left-radius:unset;border-bottom-left-radius:unset}
.table{width:100%;table-layout:fixed;border-collapse:collapse;border-spacing:0}
@media (min-width:768px){.table{table-layout:auto}
}
.table th,.table th a{color:#5a6d7c;font-size:13px;text-align:left}
[dir=rtl] .table th,[dir=rtl] .table th a{text-align:right}
.table tr{border-bottom:1px solid #ddd;display:block;padding:20px 0}
@media (min-width:768px){.table tr{display:table-row}
}
.table td{display:block}
@media (min-width:768px){.table td{display:table-cell}
}
@media (min-width:1024px){.table td,.table th{padding:20px 30px}
}
@media (min-width:768px){.table td,.table th{padding:10px 20px;height:60px}
}
.form{max-width:650px}
.form-field ~ .form-field{margin-top:25px}
.form-field label{display:block;font-size:13px;margin-bottom:5px}
.form-field input{border:1px solid #848F99;border-radius:4px;padding:10px;width:100%}
.form-field input:focus{border:1px solid #17494D}
.form-field input[type=text]{border:1px solid #848F99;border-radius:4px}
.form-field input[type=text]:focus{border:1px solid #17494D}
.form-field input[type=checkbox]{width:auto}
.form-field .nesty-input{border-radius:4px;border:1px solid #848F99;height:40px;line-height:40px;outline:none;vertical-align:middle}
.form-field .nesty-input:focus{border:1px solid #17494D;text-decoration:none}
.form-field .hc-multiselect-toggle{border:1px solid #848F99}
.form-field .hc-multiselect-toggle:focus{outline:none;border:1px solid #17494D;text-decoration:none}
.form-field textarea{vertical-align:middle}
.form-field input[type=checkbox] + label{margin:0 0 0 10px}
.form-field .optional{color:#5a6d7c;margin-left:4px}
.form-field p{color:#5a6d7c;font-size:12px;margin:5px 0}
.form footer{margin-top:40px;padding-top:30px}
.form footer a{color:#5a6d7c;cursor:pointer;margin-right:15px}
.form .suggestion-list{font-size:13px;margin-top:30px}
.form .suggestion-list label{border-bottom:1px solid #ddd;display:block;padding-bottom:5px}
.form .suggestion-list li{padding:10px 0}
.form .suggestion-list li a:visited{color:#9358B0}
.header{max-width:1160px;margin:0 auto;padding:0 5%;position:relative;align-items:center;display:flex;height:71px;justify-content:space-between}
@media (min-width:1160px){.header{padding:0;width:90%}
}
.logo img{max-height:37px;vertical-align:middle}
.logo span{margin:0 10px;color:#17494D}
.logo a{display:inline-block}
.logo a:hover,.logo a:focus,.logo a:active{text-decoration:none}
.user-nav{display:inline-block;position:absolute;white-space:nowrap}
@media (min-width:768px){.user-nav{position:relative}
}
.user-nav[aria-expanded=true]{background-color:#fff;box-shadow:0 0 4px 0 rgba(0,0,0,0.15),0 4px 10px 0 rgba(0,0,0,0.1);border:solid 1px #ddd;right:0;left:0;top:71px;z-index:9990}
.user-nav[aria-expanded=true] > a{display:block;margin:20px}
.user-nav[aria-expanded=true] > .user-nav-list li{display:block}
.user-nav[aria-expanded=true] > .user-nav-list a{display:block;margin:20px}
.user-nav-list{display:block;list-style:none}
.user-nav-list > li{display:inline-block}
@media (max-width:768px){.nav-wrapper-desktop{display:none}
}
@media (min-width:768px){.nav-wrapper-desktop{display:none}
}
@media (min-width:1024px){.nav-wrapper-desktop{display:inline-block}
}
.nav-wrapper-desktop a{border:0;color:#1F73B7;display:none;font-size:14px;padding:0 20px 0 0;width:auto}
@media (min-width:768px){.nav-wrapper-desktop a{display:inline-block}
}
[dir=rtl] .nav-wrapper-desktop a{padding:0 0 0 20px}
.nav-wrapper-desktop a:hover,.nav-wrapper-desktop a:focus,.nav-wrapper-desktop a:active{background-color:transparent;color:#1F73B7;text-decoration:underline}
@media (min-width:1024px){.nav-wrapper-mobile{display:none}
}
.nav-wrapper-mobile .menu-button-mobile{background:none;border:0;width:auto;min-width:71px;cursor:pointer}
.nav-wrapper-mobile .menu-button-mobile .icon-menu{padding:7px;vertical-align:middle;width:30px;height:30px;border-radius:50%}
.nav-wrapper-mobile .menu-button-mobile[aria-expanded=true] .icon-menu{background:#f3f3f3}
.nav-wrapper-mobile .menu-list-mobile{position:absolute;background-color:#fff;box-shadow:0 10px 10px 0 rgba(0,0,0,0.15);border-top:solid 1px #ddd;border-bottom:solid 1px #ddd;right:0;left:0;top:71px;z-index:2}
.nav-wrapper-mobile .menu-list-mobile[aria-expanded=false]{display:none}
.nav-wrapper-mobile .menu-list-mobile[aria-expanded=true]{display:block}
.nav-wrapper-mobile .menu-list-mobile-items .item{margin:4px 0}
.nav-wrapper-mobile .menu-list-mobile-items li:empty:not(.nav-divider){display:none}
.nav-wrapper-mobile .menu-list-mobile-items .nav-divider{border-bottom:0.1px solid #ddd;padding:0}
.nav-wrapper-mobile .menu-list-mobile-items .nav-divider:last-child{display:none}
.nav-wrapper-mobile .menu-list-mobile-items button{background:none;border:none;padding:8px 24px;width:100%;height:100%;color:#2F3941;cursor:pointer;text-align:start}
.nav-wrapper-mobile .menu-list-mobile-items button:active,.nav-wrapper-mobile .menu-list-mobile-items button:focus,.nav-wrapper-mobile .menu-list-mobile-items button:hover{background-color:#f3f3f3;text-decoration:underline}
.nav-wrapper-mobile .menu-list-mobile-items a{display:block;padding:8px 24px;width:100%;height:100%;color:#2F3941}
.nav-wrapper-mobile .menu-list-mobile-items a:active,.nav-wrapper-mobile .menu-list-mobile-items a:focus,.nav-wrapper-mobile .menu-list-mobile-items a:hover{background-color:#f3f3f3}
.nav-wrapper-mobile .menu-list-mobile-items .my-profile{display:flex;line-height:1.5}
.nav-wrapper-mobile .menu-list-mobile-items .my-profile .my-profile-tooltip{font-size:12px;color:#68737D}
.nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar{height:20px;width:20px;border-radius:50%;display:inline-block;margin-right:8px;margin-top:1px}
[dir=rtl] .nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar{margin-right:0;margin-left:8px}
.skip-navigation{align-items:center;background-color:black;color:white;display:flex;font-size:14px;justify-content:center;left:-999px;margin:20px;padding:20px;overflow:hidden;position:absolute;top:auto;z-index:-999}
[dir=rtl] .skip-navigation{left:initial;right:-999px}
.skip-navigation:focus,.skip-navigation:active{left:auto;overflow:auto;text-align:center;text-decoration:none;top:auto;z-index:999}
[dir=rtl] .skip-navigation:focus,[dir=rtl] .skip-navigation:active{left:initial;right:auto}
#zd-modal-container ~ .skip-navigation{display:none}
.user-info{display:inline-block}
.user-info .dropdown-toggle::after{display:none}
@media (min-width:768px){.user-info .dropdown-toggle::after{display:inline-block}
}
.user-info > button{border:0;color:#1F73B7;min-width:0;padding:0;white-space:nowrap}
.user-info > button:hover,.user-info > button:focus{color:#1F73B7;background-color:transparent}
.user-info > button::after{color:#1F73B7;padding-right:15px}
[dir=rtl] .user-info > button::after{padding-left:15px;padding-right:0}
#user #user-name{display:none;font-size:14px}
@media (min-width:768px){#user #user-name{display:inline-block}
}
#user #user-name:hover{text-decoration:underline}
.user-avatar{height:25px;width:25px;border-radius:50%;display:inline-block;vertical-align:middle}
.avatar{display:inline-block;position:relative}
.avatar img{height:40px;width:40px}
.avatar .icon-agent{color:#17494D;border:2px solid #fff;border-radius:50%;bottom:-4px;background-color:#FFFFFF;font-size:17px;height:17px;line-height:17px;position:absolute;right:-2px;text-align:center;width:17px}
.footer{border-top:none;margin-top:60px;padding:30px 0;position:relative}
.footer::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#154996,#6b2080,#c01a85);pointer-events:none}
.footer a{color:#5a6d7c}
.footer-inner{max-width:1160px;margin:0 auto;padding:0 5%;display:flex;justify-content:space-between}
@media (min-width:1160px){.footer-inner{padding:0;width:90%}
}
.footer-language-selector button{color:#5a6d7c;display:inline-block}
.powered-by-zendesk a,.powered-by-zendesk a:visited{color:#5a6d7c}
.breadcrumbs{margin:0 0 15px 0;padding:0;display:flex}
@media (min-width:768px){.breadcrumbs{margin:0}
}
.breadcrumbs li{color:#5a6d7c;font-size:13px;max-width:450px;overflow:hidden;text-overflow:ellipsis}
.breadcrumbs li + li::before{content:">";margin:0 4px}
.breadcrumbs li a:visited{color:#1F73B7}
.search-container{position:relative}
.search{border-color:#848F99;border-radius:30px;border-style:solid;border-width:1px;display:flex;position:relative;transition:border 0.12s ease-in-out}
.search:focus-within{border-color:#17494D}
.search input[type=search],.search .clear-button{background-color:#fff;border-radius:30px;border:none}
.search-full input[type=search],.search-full .clear-button{border-color:#fff}
.search input[type=search]{appearance:none;-webkit-appearance:none;box-sizing:border-box;color:#666;flex:1 1 auto;height:40px;width:100%}
.search input[type=search]:focus{color:#555}
.search input[type=search]::-webkit-search-decoration,.search input[type=search]::-webkit-search-cancel-button,.search input[type=search]::-webkit-search-results-button,.search input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}
.search input[type=search]:-webkit-autofill,.search input[type=search]:-webkit-autofill:hover,.search input[type=search]:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px #fff inset}
.search .clear-button{align-items:center;box-sizing:border-box;color:#777;cursor:pointer;display:none;flex:none;justify-content:center;padding:0 15px}
.search .clear-button:hover{background-color:#17494D;color:#fff}
.search .clear-button:focus{outline:0;box-shadow:0 0 0 3px #17494D}
.search-has-value .clear-button{display:flex}
[dir=ltr] .search input[type=search]{padding-left:40px;padding-right:20px}
[dir=ltr] .search-has-value input[type=search]{border-bottom-right-radius:0;border-top-right-radius:0;border-right-color:transparent}
[dir=ltr] .search-has-value input[type=search]:focus{border-right-color:#17494D}
[dir=ltr] .search .clear-button{border-bottom-left-radius:0;border-top-left-radius:0;border-left-color:transparent}
[dir=ltr] .search .clear-button:focus{border-left-color:#17494D}
[dir=rtl] .search input[type=search]{padding-left:20px;padding-right:40px}
[dir=rtl] .search-has-value input[type=search]{border-bottom-left-radius:0;border-top-left-radius:0;border-left-color:transparent}
[dir=rtl] .search-has-value input[type=search]:focus{border-left-color:#17494D}
[dir=rtl] .search .clear-button{border-bottom-right-radius:0;border-top-right-radius:0;border-right-color:transparent}
[dir=rtl] .search .clear-button:focus{border-right-color:#17494D}
.search-icon{position:relative;top:50%;transform:translateY(-50%);position:absolute;left:15px;z-index:1;width:18px;height:18px;color:#777;pointer-events:none}
[dir=rtl] .search-icon{left:auto;right:15px}
.hero{background-image:url($homepage_background_image);background-position:center;background-size:cover;height:300px;padding:0 20px;text-align:center;width:100%}
.hero-inner{position:relative;top:50%;transform:translateY(-50%);max-width:610px;margin:0 auto}
.page-header{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-between;margin:10px 0}
@media (min-width:768px){.page-header{align-items:baseline;flex-direction:row;flex-wrap:wrap;gap:16px;margin:0}
}
.page-header .section-subscribe{flex-shrink:0;margin-bottom:10px}
@media (min-width:768px){.page-header .section-subscribe{margin-bottom:0}
}
.page-header h1{flex-grow:1;margin-bottom:10px}
.page-header-description{font-style:italic;margin:0 0 30px 0;word-break:break-word}
@media (min-width:1024px){.page-header-description{flex-basis:100%}
}
.page-header .icon-lock{height:20px;width:20px;position:relative;left:-5px;vertical-align:baseline}
.sub-nav{align-items:baseline;display:flex;flex-direction:column;flex-wrap:wrap;gap:15px 30px;justify-content:space-between;margin-bottom:55px}
@media (min-width:768px){.sub-nav{flex-direction:row}
}
.sub-nav .breadcrumbs{margin:0}
.sub-nav .search-container{max-width:300px;width:100%}
@media (min-width:768px){.sub-nav .search-container{flex:0 1 300px}
}
.sub-nav input[type=search]::after{font-size:15px}
.blocks-list{display:flex;flex-wrap:wrap;justify-content:flex-start;list-style:none;padding:0}
@media (min-width:768px){.blocks-list{margin:0 -15px}
}
.blocks-item{border:1px solid #17494D;border-radius:4px;box-sizing:border-box;color:#17494D;display:flex;flex:1 0 340px;margin:0 0 30px;max-width:100%;text-align:center}
@media (min-width:768px){.blocks-item{margin:0 15px 30px}
}
.blocks-item:hover,.blocks-item:focus,.blocks-item:active{background-color:#17494D}
.blocks-item:hover *,.blocks-item:focus *,.blocks-item:active *{color:#FFFFFF;text-decoration:none}
.blocks-item-internal{background-color:transparent;border:1px solid #ddd}
.blocks-item-internal .icon-lock{height:15px;width:15px;bottom:5px;position:relative}
.blocks-item-internal a{color:#2F3941}
.blocks-item-link{color:#17494D;padding:20px 30px;display:flex;flex-direction:column;flex:1;justify-content:center;border-radius:inherit}
.blocks-item-link:visited,.blocks-item-link:hover,.blocks-item-link:active{color:inherit;text-decoration:none}
.blocks-item-link:focus{outline:0;box-shadow:0 0 0 3px #17494D;text-decoration:none}
.blocks-item-title{margin-bottom:0;font-size:16px}
.blocks-item-description{margin:0}
.blocks-item-description:not(:empty){margin-top:10px}
.section{margin-bottom:40px}
@media (min-width:768px){.section{margin-bottom:60px}
}
.home-section h2{margin-bottom:10px;text-align:center}
.promoted-articles{display:flex;flex-direction:column;flex-wrap:wrap}
@media (min-width:1024px){.promoted-articles{flex-direction:row}
}
.promoted-articles-item{flex:1 0 auto}
@media (min-width:1024px){.promoted-articles-item{align-self:flex-end;flex:0 0 auto;padding-right:30px;width:33%}
[dir=rtl] .promoted-articles-item{padding:0 0 0 30px}
}
.promoted-articles-item:nth-child(3n){padding-right:0}
.promoted-articles-item a{display:block;border-bottom:1px solid #ddd;padding:15px 0}
.promoted-articles-item .icon-lock{vertical-align:baseline}
.promoted-articles-item:last-child a{border:0}
@media (min-width:1024px){.promoted-articles-item:last-child a{border-bottom:1px solid #ddd}
}
.community{text-align:center}
.community-image{min-height:300px;margin-top:32px;background-image:url($community_image);background-position:center;background-repeat:no-repeat;max-width:100%}
.community a{color:#1F73B7;text-decoration:underline}
.community a:visited{color:#9358B0}
.community a:hover,.community a:active,.community a:focus{color:#0F3554}
.community,.activity{border-top:1px solid #ddd;padding:30px 0}
.recent-activity-header{margin-bottom:10px;text-align:center}
.recent-activity-list{padding:0}
.recent-activity-item{border-bottom:1px solid #ddd;overflow:auto;padding:20px 0}
.recent-activity-item h3{margin:0}
.recent-activity-item-parent{font-size:16px;font-weight:600}
.recent-activity-item-parent,.recent-activity-item-link{margin:6px 0;display:inline-block;width:100%}
@media (min-width:768px){.recent-activity-item-parent,.recent-activity-item-link{width:70%;margin:0}
}
.recent-activity-item-link{font-size:14px;overflow:hidden;text-overflow:ellipsis}
.recent-activity-item-meta{color:#2F3941;margin:15px 0 0 0;float:none}
@media (min-width:768px){.recent-activity-item-meta{margin:0;float:right}
[dir=rtl] .recent-activity-item-meta{float:left}
}
.recent-activity-item-time,.recent-activity-item-comment{display:inline-block;font-size:13px}
.recent-activity-item-comment{padding-left:5px}
[dir=rtl] .recent-activity-item-comment{padding:0 5px 0 0}
.recent-activity-item-comment::before{display:inline-block}
.recent-activity-controls{padding-top:15px}
.recent-activity-controls a{color:#1F73B7;text-decoration:underline}
.recent-activity-controls a:visited{color:#9358B0}
.recent-activity-controls a:hover,.recent-activity-controls a:active,.recent-activity-controls a:focus{color:#0F3554}
.recent-activity-accessibility-label{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}
.recent-activity-comment-icon svg{vertical-align:middle;color:#17494D;width:16px;height:16px}
.recent-activity-comment-icon:after{content:attr(data-comment-count);margin-left:3px}
[dir=rtl] .recent-activity-comment-icon:after{margin-left:0;margin-right:3px}
.category-container{display:flex;justify-content:flex-end}
.category-content{flex:1;max-width:100%}
@media (min-width:1024px){.category-content{flex:0 0 80%}
}
.section-tree{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-between}
@media (min-width:768px){.section-tree{flex-direction:row}
}
.section-tree .section{flex:initial;max-width:100%}
@media (min-width:768px){.section-tree .section{flex:0 0 45%}
}
.section-tree-title{margin-bottom:0;font-size:18px;font-weight:600}
.section-tree-title a{color:#2F3941}
.section-tree .see-all-articles{display:block;padding:15px 0}
.article-list-item{font-size:16px;padding:15px 0;text-overflow:ellipsis;overflow:hidden}
.article-list-item a{color:#2F3941}
.icon-star{color:#17494D;font-size:18px}
.section-container{display:flex;justify-content:flex-end}
.section-content{flex:1;max-width:100%}
@media (min-width:1024px){.section-content{flex:0 0 80%}
}
.section-list{margin:40px 0}
.section-list-item{border-bottom:1px solid #ddd;font-size:16px;padding:15px 0}
.section-list-item:first-child{border-top:1px solid #ddd}
.section-list-item a{align-items:center;color:#2F3941;display:flex;justify-content:space-between}
.see-all-sections-trigger{cursor:pointer;display:block;padding:15px;text-align:center}
.see-all-sections-trigger[aria-hidden=true]{display:none}
.article{flex:1 0 auto}
@media (min-width:1024px){.article{flex:1 0 66%;max-width:66%;min-width:640px;padding:0 30px}
}
.article-container{display:flex;flex-direction:column}
@media (min-width:1024px){.article-container{flex-direction:row}
}
.article-header{align-items:flex-start;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-between;margin-bottom:40px;margin-top:20px}
/* Respect the hidden attribute (the .eu-doc-article hides this default Zendesk header in favour of the custom hero) */
.article-header[hidden]{display:none !important}
@media (min-width:768px){.article-header{flex-direction:row;margin-top:0}
}
.article-avatar{margin-right:10px}
.article-author{margin-bottom:10px}
.article-title{overflow:hidden;text-overflow:ellipsis;max-width:100%}
@media (min-width:768px){.article-title{flex-basis:100%}
}
.article-title .icon-lock{position:relative;left:-5px;vertical-align:baseline}
.article [role=button]{flex-shrink:0;width:100%}
@media (min-width:768px){.article [role=button]{width:auto}
}
.article-info{max-width:100%}
.article-meta{display:inline-block;vertical-align:middle}
.article-body{display:flow-root}
.article-body a{color:#1F73B7;text-decoration:underline}
.article-body a:visited{color:#9358B0}
.article-body a:hover,.article-body a:active,.article-body a:focus{color:#0F3554}
.article-body img{height:auto;max-width:100%}
.article-body p > img.image-style-align-left{float:left;margin:8px 20px 6px 0}
.article-body p > img.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.article-body p > img.image-style-block-align-right{margin-left:auto;margin-right:0}
.article-body p > img.image-style-block-align-left{margin-left:0;margin-right:auto}
.article-body figure.image{display:table;margin:0 auto}
.article-body figure.image > img{display:block;width:100%}
.article-body figure.image.image-style-align-left{float:left;margin:8px 20px 6px 0}
.article-body figure.image.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.article-body figure.image.image-style-block-align-right{margin-left:auto;margin-right:0}
.article-body figure.image.image-style-block-align-left{margin-left:0;margin-right:auto}
.article-body figcaption{padding:10px 0;font-size:12px;text-align:center;background-color:#f2f2f2}
.article-body ul,.article-body ol{padding-left:20px;list-style-position:outside;margin:20px 0 20px 20px}
[dir=rtl] .article-body ul,[dir=rtl] .article-body ol{padding-right:20px;padding-left:0;margin-left:0;margin-right:20px}
.article-body ul > ul,.article-body ol > ol,.article-body ol > ul,.article-body ul > ol,.article-body li > ul,.article-body li > ol{margin:0}
.article-body ul{list-style-type:disc}
.article-body:not(pre) > code{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:0 5px;margin:0 2px}
.article-body pre{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:10px 15px;overflow:auto;white-space:pre;direction:ltr}
.article-body blockquote{border-left:1px solid #ddd;color:#5a6d7c;font-style:italic;padding:0 15px}
.article-body > p:last-child{margin-bottom:0}
.article-content{line-height:1.6;margin:40px 0;word-wrap:break-word}
.article-footer{align-items:center;display:flex;justify-content:space-between;padding-bottom:20px}
.article-comment-count{color:#5a6d7c}
.article-comment-count:hover{text-decoration:none}
.article-comment-count-icon{vertical-align:middle;color:#17494D;width:18px;height:18px}
.article-sidebar{border-bottom:1px solid #ddd;border-top:1px solid #ddd;flex:1 0 auto;margin-bottom:20px;padding:0}
@media (min-width:1024px){.article-sidebar{border:0;flex:0 0 17%;height:auto;max-width:17%}
}
.article-relatives{border-top:1px solid #ddd;display:flex;flex-direction:column;padding:20px 0}
@media (min-width:768px){.article-relatives{flex-direction:row}
}
.article-relatives > *{flex:1 0 50%;min-width:50%;overflow-wrap:break-word;margin-right:0}
.article-relatives > *:last-child{padding:0}
@media (min-width:768px){.article-relatives > *{padding-right:20px}
}
.article-votes{border-top:1px solid #ddd;padding:30px 0;text-align:center}
.article-votes-question{font-size:15px;font-weight:normal;margin-bottom:0}
.article-vote{margin:10px 5px;min-width:90px;width:auto}
.article-more-questions{margin:10px 0 20px;text-align:center}
.article-more-questions a{color:#1F73B7;text-decoration:underline}
.article-more-questions a:visited{color:#9358B0}
.article-more-questions a:hover,.article-more-questions a:active,.article-more-questions a:focus{color:#0F3554}
.article-return-to-top{border-top:1px solid #848F99}
@media (min-width:1024px){.article-return-to-top{display:none}
}
.article-return-to-top a{color:#2F3941;display:block;padding:20px 0}
.article-return-to-top a:hover,.article-return-to-top a:focus{text-decoration:none}
.article-return-to-top-icon{transform:rotate(0.5turn)}
.article td > p:first-child,.article th > p:first-child{margin-top:0}
.article td > p:last-child,.article th > p:last-child{margin-bottom:0}
.sidenav-title{font-size:15px;position:relative;font-weight:600}
.sidenav-item{display:block;margin-top:10px;margin-bottom:16px;overflow:hidden;text-overflow:ellipsis}
.recent-articles li,.related-articles li{margin-bottom:15px}
.attachments .attachment-item{padding-left:20px;position:relative;margin-bottom:10px}
.attachments .attachment-item:last-child{margin-bottom:0}
.attachments .attachment-item .attachment-icon{color:#2F3941;left:0;position:absolute;top:5px}
[dir=rtl] .attachments .attachment-item{padding-left:0;padding-right:20px}
[dir=rtl] .attachments .attachment-item .attachment-icon{left:auto;right:0}
.upload-dropzone span{color:#5a6d7c}
.share{padding:0;white-space:nowrap}
.share li,.share a{display:inline-block}
.share li{height:25px;width:25px}
.share a{color:#5a6d7c}
.share a:hover{text-decoration:none;color:#17494D}
.share a svg{height:18px;width:18px;display:block}
.comment{border-bottom:1px solid #ddd;padding:20px 0}
.comment-heading,.recent-articles-title,.related-articles-title{margin-bottom:5px;margin-top:0;font-size:18px;font-weight:600}
.comment-overview{border-bottom:1px solid #ddd;border-top:1px solid #ddd;padding:20px 0}
.comment-overview p{margin-top:0}
.comment-callout{color:#5a6d7c;display:inline-block;font-size:13px;margin-bottom:0}
.comment-callout a{color:#1F73B7;text-decoration:underline}
.comment-callout a:visited{color:#9358B0}
.comment-callout a:hover,.comment-callout a:active,.comment-callout a:focus{color:#0F3554}
.comment-sorter{display:inline-block;float:right}
.comment-sorter .dropdown-toggle{color:#5a6d7c;font-size:13px}
[dir=rtl] .comment-sorter{float:left}
.comment-wrapper{display:flex;position:relative}
.comment-wrapper.comment-official{border:1px solid #17494D;padding:40px 20px 20px}
@media (min-width:768px){.comment-wrapper.comment-official{padding-top:20px}
}
.comment-info{min-width:0;padding-right:20px;width:100%}
[dir=rtl] .comment-info{padding-right:0;padding-left:20px}
.comment-author{align-items:flex-end;display:flex;flex-wrap:wrap;margin-bottom:20px}
@media (min-width:768px){.comment-author{justify-content:space-between}
}
.comment-avatar{margin-right:10px}
[dir=rtl] .comment-avatar{margin-left:10px;margin-right:0}
.comment-meta{flex:1 1 auto}
.comment-labels{flex-basis:100%}
@media (min-width:768px){.comment-labels{flex-basis:auto}
}
.comment .status-label:not(.status-label-official){margin-top:10px}
@media (min-width:768px){.comment .status-label:not(.status-label-official){margin-top:0}
}
.comment-form{display:flex;padding-top:30px;word-wrap:break-word}
.comment-container{width:100%}
.comment-form-controls{display:none;margin-top:10px;text-align:left}
@media (min-width:768px){[dir=ltr] .comment-form-controls{text-align:right}
}
.comment-form-controls input[type=submit]{margin-top:15px}
@media (min-width:1024px){.comment-form-controls input[type=submit]{margin-left:15px}
[dir=rtl] .comment-form-controls input[type=submit]{margin-left:0;margin-right:15px}
}
.comment-form-controls input[type=checkbox]{margin-right:5px}
.comment-form-controls input[type=checkbox] [dir=rtl]{margin-left:5px}
.comment-ccs{display:none}
.comment-ccs + textarea{margin-top:10px}
.comment-attachments{margin-top:10px}
.comment-attachments a{color:#17494D}
.comment-body{-moz-hyphens:auto;-ms-hyphens:auto;-webkit-hyphens:auto;word-break:break-word;word-wrap:break-word;display:flow-root;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;line-height:1.6;overflow-x:auto}
.comment-body a{color:#1F73B7;text-decoration:underline}
.comment-body a:visited{color:#9358B0}
.comment-body a:hover,.comment-body a:active,.comment-body a:focus{color:#0F3554}
.comment-body img{height:auto;max-width:100%}
.comment-body p > img.image-style-align-left{float:left;margin:8px 20px 6px 0}
.comment-body p > img.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.comment-body p > img.image-style-block-align-right{margin-left:auto;margin-right:0}
.comment-body p > img.image-style-block-align-left{margin-left:0;margin-right:auto}
.comment-body figure.image{display:table;margin:0 auto}
.comment-body figure.image > img{display:block;width:100%}
.comment-body figure.image.image-style-align-left{float:left;margin:8px 20px 6px 0}
.comment-body figure.image.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.comment-body figure.image.image-style-block-align-right{margin-left:auto;margin-right:0}
.comment-body figure.image.image-style-block-align-left{margin-left:0;margin-right:auto}
.comment-body figcaption{padding:10px 0;font-size:12px;text-align:center;background-color:#f2f2f2}
.comment-body ul,.comment-body ol{padding-left:20px;list-style-position:outside;margin:20px 0 20px 20px}
[dir=rtl] .comment-body ul,[dir=rtl] .comment-body ol{padding-right:20px;padding-left:0;margin-left:0;margin-right:20px}
.comment-body ul > ul,.comment-body ol > ol,.comment-body ol > ul,.comment-body ul > ol,.comment-body li > ul,.comment-body li > ol{margin:0}
.comment-body ul{list-style-type:disc}
.comment-body:not(pre) > code{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:0 5px;margin:0 2px}
.comment-body pre{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:10px 15px;overflow:auto;white-space:pre;direction:ltr}
.comment-body blockquote{border-left:1px solid #ddd;color:#5a6d7c;font-style:italic;padding:0 15px}
.comment-mark-as-solved{display:inline-block}
.vote{display:flex;flex-direction:column;text-align:center}
.vote a:active,.vote a:hover,.vote a:focus{text-decoration:none}
.vote-sum{color:#5a6d7c;display:block;margin:3px 0}
[dir=rtl] .vote-sum{direction:ltr;unicode-bidi:bidi-override}
.vote-up svg{transform:scale(1,-1)}
.vote-up:hover,.vote-down:hover{color:#17494D}
.vote-up,.vote-down{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:#5a6d7c;cursor:pointer;min-height:35px;min-width:35px;display:flex;align-items:center;justify-content:center}
.vote-voted{color:#17494D}
.vote-voted:hover{color:#000}
.actions{text-align:center;flex-shrink:0}
.actions button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;cursor:pointer;min-height:35px;min-width:35px;display:flex;align-items:center;justify-content:center}
.community-hero{background-image:url($community_background_image);margin-bottom:10px}
.community-footer{padding-top:50px;text-align:center}
.community-footer-title{font-size:16px;margin-bottom:20px}
.community-featured-posts .title{font-size:18px;font-weight:600}
.community-featured-posts,.community-activity{padding-top:40px;width:100%}
.community-header{margin-bottom:30px}
.community-header .title{margin-bottom:0;font-size:16px}
.post-to-community{margin-top:10px}
@media (min-width:768px){.post-to-community{margin:0}
}
.topics{max-width:none;width:100%}
.topics-item .meta-group{justify-content:center;margin-top:20px}
.topic-header{border-bottom:1px solid #ddd;font-size:13px}
@media (min-width:768px){.topic-header{padding-bottom:10px}
}
.topic-header .dropdown{display:block;border-top:1px solid #ddd;padding:10px 0}
@media (min-width:768px){.topic-header .dropdown{border-top:0;display:inline-block;margin-right:20px;padding:0}
}
.no-posts-with-filter{margin-top:20px;margin-bottom:20px}
.community-follow{margin-bottom:10px;width:100%}
@media (min-width:768px){.community-follow{margin-bottom:0;width:auto}
}
.community-follow button{line-height:30px;padding:0 10px 0 15px;position:relative;width:100%}
@media (min-width:768px){.community-follow button{width:auto}
}
.community-follow button:hover{background-color:#17494D}
.community-follow button:hover::after,.community-follow button:focus::after{border-color:#FFFFFF;color:#FFFFFF}
.community-follow button[data-selected=true]{background-color:#17494D;color:#FFFFFF}
.community-follow button[data-selected=true]::after{border-left:1px solid #FFFFFF;color:#FFFFFF}
.community-follow button[data-selected=true]:hover{background-color:darken(#17494D,20%);border-color:darken(#17494D,20%)}
.community-follow button::after{border-left:1px solid #17494D;content:attr(data-follower-count);color:#17494D;display:inline-block;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;margin-left:15px;padding-left:10px;position:absolute;right:10px}
@media (min-width:768px){.community-follow button::after{position:static}
}
[dir=rtl] .community-follow button::after{border-left:0;border-right:1px solid #17494D;margin:0 10px 0 0;padding:0 10px 0 0}
.striped-list{padding:0}
.striped-list-item{align-items:flex-start;border-bottom:1px solid #ddd;display:flex;flex-direction:column;justify-content:flex-end;padding:20px 0}
@media (min-width:768px){.striped-list-item{align-items:center;flex-direction:row}
}
.striped-list-info{flex:2}
.striped-list-title{color:#1F73B7;margin-bottom:10px;margin-right:5px}
.striped-list-title:hover,.striped-list-title:focus,.striped-list-title:active{text-decoration:underline}
.striped-list-title:visited{color:#9358B0}
.striped-list .meta-group{margin:5px 0}
.striped-list-count{color:#5a6d7c;font-size:13px;justify-content:flex-start;text-transform:capitalize}
@media (min-width:768px){.striped-list-count{display:flex;flex:1;justify-content:space-around}
}
.striped-list-count-item::after{content:"·";display:inline-block;padding:0 5px}
@media (min-width:768px){.striped-list-count-item::after{display:none}
}
.striped-list-count-item:last-child::after{display:none}
.striped-list-number{text-align:center}
@media (min-width:768px){.striped-list-number{color:#2F3941;display:block}
}
.status-label{background-color:#038153;border-radius:4px;color:#fff;font-size:12px;font-weight:600;margin-right:2px;padding:3px 10px;vertical-align:middle;white-space:nowrap;display:inline-block}
.status-label:hover,.status-label:active,.status-label:focus{text-decoration:none}
.status-label-pinned,.status-label-featured,.status-label-official{background-color:#17494D}
.status-label-official{border-radius:0;margin-right:0;position:absolute;right:0;text-align:center;top:0;width:100%}
@media (min-width:768px){.status-label-official{border-radius:0 0 4px 4px;right:30px;width:auto}
}
[dir=rtl] .status-label-official{left:30px;right:auto}
.status-label-not-planned,.status-label-closed{background-color:#e9ebed;color:#5a6d7c}
.status-label-pending,.status-label-pending-moderation{background-color:#154996;text-align:center}
.status-label-open{background-color:#c72a1c}
.status-label-solved{background-color:#68737d}
.status-label-new{background-color:#ffb648;color:#703b15}
.status-label-hold{background-color:#000}
.status-label-request{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:768px){.status-label-request{max-width:150px}
}
.post{flex:1;margin-bottom:10px}
@media (min-width:1024px){.post{flex:1 0 70%;max-width:70%}
}
.post-container{display:flex;flex-direction:column}
@media (min-width:1024px){.post-container{flex-direction:row}
}
.post-header{align-items:center;display:flex;flex-direction:column;justify-content:space-between;margin-bottom:10px}
@media (min-width:768px){.post-header{align-items:baseline;flex-direction:row}
}
.post-header .status-label{vertical-align:super}
.post-title{margin-bottom:20px;width:100%}
@media (min-width:768px){.post-title{margin-bottom:0;padding-right:10px}
}
.post-title h1{display:inline;vertical-align:middle}
@media (min-width:768px){.post-title h1{margin-right:5px}
}
.post-author{align-items:flex-start;display:flex;justify-content:space-between}
.post-avatar{margin-bottom:30px}
.post-content{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;line-height:1.6;word-break:break-word}
.post-info-container{display:flex;margin-bottom:40px}
.post-info{min-width:0;padding-right:20px;width:100%}
[dir=rtl] .post-info{padding-right:0;padding-left:20px}
.post-meta{display:inline-block;flex:1;margin-left:10px;vertical-align:middle}
[dir=rtl] .post-meta{margin-left:0;margin-right:10px}
.post-body{display:flow-root}
.post-body a{color:#1F73B7;text-decoration:underline}
.post-body a:visited{color:#9358B0}
.post-body a:hover,.post-body a:active,.post-body a:focus{color:#0F3554}
.post-body img{height:auto;max-width:100%}
.post-body p > img.image-style-align-left{float:left;margin:8px 20px 6px 0}
.post-body p > img.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.post-body p > img.image-style-block-align-right{margin-left:auto;margin-right:0}
.post-body p > img.image-style-block-align-left{margin-left:0;margin-right:auto}
.post-body figure.image{display:table;margin:0 auto}
.post-body figure.image > img{display:block;width:100%}
.post-body figure.image.image-style-align-left{float:left;margin:8px 20px 6px 0}
.post-body figure.image.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.post-body figure.image.image-style-block-align-right{margin-left:auto;margin-right:0}
.post-body figure.image.image-style-block-align-left{margin-left:0;margin-right:auto}
.post-body figcaption{padding:10px 0;font-size:12px;text-align:center;background-color:#f2f2f2}
.post-body ul,.post-body ol{padding-left:20px;list-style-position:outside;margin:20px 0 20px 20px}
[dir=rtl] .post-body ul,[dir=rtl] .post-body ol{padding-right:20px;padding-left:0;margin-left:0;margin-right:20px}
.post-body ul > ul,.post-body ol > ol,.post-body ol > ul,.post-body ul > ol,.post-body li > ul,.post-body li > ol{margin:0}
.post-body ul{list-style-type:disc}
.post-body:not(pre) > code{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:0 5px;margin:0 2px}
.post-body pre{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:10px 15px;overflow:auto;white-space:pre;direction:ltr}
.post-body blockquote{border-left:1px solid #ddd;color:#5a6d7c;font-style:italic;padding:0 15px}
.post-footer{align-items:center;display:flex;justify-content:space-between;padding-bottom:20px}
.post-comment-count{color:#5a6d7c}
.post-comment-count:hover{text-decoration:none}
.post-comment-count .icon-comments{color:#17494D;display:inline-block;width:18px;height:18px;margin:5px;vertical-align:middle}
.post-sidebar{border-top:1px solid #ddd;flex:1;padding:30px 0;text-align:center}
@media (min-width:1024px){.post-sidebar{border:0;flex:1 0 30%;padding:0 0 0 50px;text-align:initial}
[dir=rtl] .post-sidebar{padding:0 50px 0 0}
}
.post-sidebar-title{font-size:18px;font-weight:600}
.post-comments{margin-bottom:20px}
@media (min-width:1024px){.post-comments{margin-bottom:0}
}
.community-badge-title{background-color:#04444d;border-radius:4px;color:#fff;font-size:12px;font-weight:600;padding:0px 8px;vertical-align:top;white-space:nowrap;display:inline-block;line-height:18px;vertical-align:middle}
.community-badge-titles{display:inline}
.community-badge-achievement{display:block;height:16px;white-space:nowrap;width:16px}
.community-badge-achievement img{width:100%;height:100%}
.community-badge-achievements{display:flex}
.community-badge-achievements-rest{font-size:12px;font-weight:600;line-height:20px;text-align:center;vertical-align:top}
.community-badge{margin:2px}
.profile-info .community-badge-title{padding:2px 8px;line-height:20px}
.profile-info .community-badge-achievement{height:40px;width:40px}
.profile-info .community-badge-achievements-rest{line-height:40px;font-size:20px}
.collapsible-nav{flex-direction:column;font-size:14px;position:relative}
@media (min-width:768px){.collapsible-nav{flex-direction:row}
}
.collapsible-nav-border{border-bottom:1px solid #ddd;border-top:1px solid #ddd}
@media (min-width:768px){.collapsible-nav-border{border-top:0}
}
.collapsible-nav-toggle{top:22.5px;transform:translateY(-50%);position:absolute;right:0;padding:0;border:0;background:none;width:25px;height:25px;border-radius:50%}
@media (min-width:768px){.collapsible-nav-toggle{display:none}
}
[dir=rtl] .collapsible-nav-toggle{left:0;right:auto}
.collapsible-nav-toggle-icon{display:none}
.collapsible-nav-toggle[aria-expanded=false] .chevron-icon{display:inline-block}
.collapsible-nav-toggle[aria-expanded=true] .x-icon{display:inline-block}
.collapsible-nav-toggle:focus{outline:none;border:1px solid #17494D}
.collapsible-nav-list{display:flex;flex-direction:column}
@media (min-width:768px){.collapsible-nav-list{flex-direction:row}
}
.collapsible-nav-list li{color:#2F3941;line-height:45px;order:1}
@media (min-width:768px){.collapsible-nav-list li{line-height:normal;margin-right:30px}
[dir=rtl] .collapsible-nav-list li{margin-left:30px;margin-right:0}
.collapsible-nav-list li a{text-decoration:none;padding:15px 0}
}
.collapsible-nav-list li a{color:#2F3941;display:block}
@media (min-width:768px){.collapsible-nav-list li:hover{border-bottom:4px solid #ddd}
.collapsible-nav-list li:hover a:not([aria-current=page]){padding:15px 0 11px 0;text-decoration:none}
}
.collapsible-nav-list li:not([aria-selected=true]),.collapsible-nav-list li:not(.current){display:none}
@media (min-width:768px){.collapsible-nav-list li:not([aria-selected=true]),.collapsible-nav-list li:not(.current){display:block}
}
@media (min-width:768px){.collapsible-nav-list li[aria-selected=true]{padding:15px 0 11px 0}
}
.collapsible-nav-list li[aria-selected=true],.collapsible-nav-list li.current{order:0;position:relative}
@media (min-width:768px){.collapsible-nav-list li[aria-selected=true],.collapsible-nav-list li.current{border-bottom:4px solid #17494D;order:1}
}
.collapsible-nav-list li[aria-selected=true] a,.collapsible-nav-list li.current a{color:#2F3941}
.collapsible-nav[aria-expanded=true] li:not([aria-selected=true]),.collapsible-nav[aria-expanded=true] li:not(.current){display:block}
.collapsible-sidebar{flex:1;max-height:45px;overflow:hidden;padding:10px 0;position:relative}
@media (min-width:1024px){.collapsible-sidebar{max-height:none;padding:0}
}
.collapsible-sidebar-title{margin-top:0}
.collapsible-sidebar-toggle{position:absolute;top:22.5px;transform:translateY(-50%);right:0;padding:0;border:0;background:none;width:25px;height:25px;border-radius:50%}
@media (min-width:1024px){.collapsible-sidebar-toggle{display:none}
}
[dir=rtl] .collapsible-sidebar-toggle{left:0;right:auto}
.collapsible-sidebar-toggle-icon{display:none}
.collapsible-sidebar-toggle[aria-expanded=false] .chevron-icon{display:inline-block}
.collapsible-sidebar-toggle[aria-expanded=true] .x-icon{display:inline-block}
.collapsible-sidebar-toggle:focus{outline:none;border:1px solid #17494D}
.collapsible-sidebar-body{display:none}
@media (min-width:1024px){.collapsible-sidebar-body{display:block}
}
.collapsible-sidebar[aria-expanded=true]{max-height:none}
.collapsible-sidebar[aria-expanded=true] .collapsible-sidebar-body{display:block}
.my-activities-nav{background-color:#f2f2f2;margin-bottom:20px}
.my-activities-sub-nav{margin-bottom:30px}
.my-activities-table .striped-list-title{display:block;margin-bottom:10px;max-width:350px;white-space:normal}
@media (min-width:1024px){.my-activities-table .striped-list-title{margin-bottom:0;max-width:500px;min-width:350px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
.my-activities-table thead{display:none}
@media (min-width:768px){.my-activities-table thead{display:table-header-group}
}
.my-activities-table th:first-child,.my-activities-table td:first-child{padding-left:0}
@media (min-width:1024px){.my-activities-table th:first-child,.my-activities-table td:first-child{width:500px}
}
.my-activities-table th:last-child,.my-activities-table td:last-child{padding-right:0}
.my-activities-table td:not(:first-child){display:none}
@media (min-width:768px){.my-activities-table td:not(:first-child){display:table-cell}
}
.requests-search{width:100%}
.requests-table-toolbar{align-items:flex-end;display:flex;flex-direction:column}
@media (min-width:768px){.requests-table-toolbar{flex-direction:row}
}
.requests-table-toolbar .search{flex:1;width:100%}
.requests-table-toolbar .request-table-filter{width:100%}
@media (min-width:768px){.requests-table-toolbar .request-table-filter{width:auto}
}
.requests-table-toolbar .request-filter{display:block}
@media (min-width:768px){.requests-table-toolbar .request-filter{margin:0 0 0 30px}
[dir=rtl] .requests-table-toolbar .request-filter{margin:0 30px 0 0}
}
.requests-table-toolbar .request-filter-label{font-size:13px;margin-top:30px}
@media (min-width:768px){.requests-table-toolbar .request-filter-label{margin-top:0}
}
.requests-table-toolbar select{max-height:40px;margin-bottom:30px;width:100%}
@media (min-width:768px){.requests-table-toolbar select{margin-bottom:0;max-width:300px;width:auto}
}
@media (min-width:768px){.requests-table-toolbar .organization-subscribe{margin-left:10px}
[dir=rtl] .requests-table-toolbar .organization-subscribe{margin:0 10px 0 0}
}
.requests-table-toolbar .organization-subscribe button{line-height:40px;max-height:40px;padding:0 20px}
.requests-table-toolbar + .requests-search-info{margin-top:15px}
.requests-table-toolbar + .requests-search-info.meta-data::after{content:"";margin:0}
.requests-table-toolbar + .requests-search-info + .requests{margin-top:20px}
.requests-table-toolbar + .requests{margin-top:40px}
.requests .requests-table-meta{display:block}
@media (min-width:768px){.requests .requests-table-meta{display:none}
}
.requests .requests-table thead{display:none}
@media (min-width:768px){.requests .requests-table thead{display:table-header-group}
}
.requests .requests-table-info{display:block}
@media (min-width:768px){.requests .requests-table-info{display:table-cell;vertical-align:middle;width:auto}
}
.requests .requests-table .requests-link{position:relative}
.requests .requests-table .requests-sort-symbol{position:absolute;left:calc(100% + 3px);bottom:0;font-size:10px}
@media (min-width:768px){.subscriptions-subscribe button{width:auto}
}
.subscriptions-table td:last-child{display:block}
@media (min-width:768px){.subscriptions-table td:last-child{display:table-cell}
}
.subscriptions-table td:first-child{display:flex;align-items:center}
.subscriptions-table .user-avatar{margin-right:10px}
.subscriptions .striped-list-title{display:inline-block;vertical-align:middle}
.contributions-table td:last-child{color:#5a6d7c;font-size:13px}
@media (min-width:768px){.contributions-table td:last-child{color:inherit;font-size:inherit;font-weight:inherit}
}
.no-activities{color:#5a6d7c}
.request-container{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-between}
@media (min-width:1024px){.request-container{align-items:flex-start;flex-direction:row}
}
.request-container .comment-container{min-width:0}
.request-breadcrumbs{margin-bottom:40px}
@media (min-width:1024px){.request-breadcrumbs{margin-bottom:60px}
}
.request-main{flex:1 0 auto;order:1}
.request-main .comment-fields,.request-main .request-submit-comment{display:none}
.request-main .comment-fields.shown{display:block}
.request-main .request-submit-comment.shown{display:inline}
@media (min-width:1024px){.request-main{flex:0 0 66%;order:0;min-width:0}
}
.request-main .comment-form-controls{display:block}
.request-main .comment-ccs{display:block}
.request-main .comment-show-container{border-radius:2px;border:1px solid #ddd;color:#5a6d7c;text-align:inherit;padding:8px 25px;width:100%}
.request-main .comment-show-container.hidden{display:none}
.request-main .form-field.comment-ccs > ul{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}
.request-main .form-field.comment-ccs > ul[data-hc-focus=true]{border:1px solid #17494D}
.request-main .form-field.comment-ccs > input[type=text]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}
.request-main .comment-ccs + textarea{border-top-left-radius:0;border-top-right-radius:0;margin-top:0}
.request-main .comment-ccs + textarea:focus{border-top:1px solid #17494D}
.request-main input#mark_as_solved{display:none}
.request-title{width:100%}
@media (min-width:1024px){.request-title{border-bottom:1px solid #ddd;margin-bottom:0;max-width:66%;padding-bottom:20px}
}
.request-sidebar{border-bottom:1px solid #ddd;border-top:1px solid #ddd;flex:1 0 auto;order:0}
@media (min-width:1024px){.request-sidebar{background-color:#f7f7f7;border:0;font-size:13px;flex:0 0 auto;padding:0 20px;width:30%}
}
.request-sidebar h2{font-size:15px;font-weight:600;position:relative}
@media (min-width:1024px){.request-sidebar h2{display:none}
}
.request-details{border-bottom:1px solid #ddd;font-size:0;margin:0;padding-bottom:20px}
.request-details:last-child{border:0}
.request-details dt,.request-details dd{display:inline-block;vertical-align:top;font-size:13px;margin:20px 0 0 0}
.request-details dd{padding:0 10px;width:60%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.request-details dd::after{content:"\a";white-space:pre}
.request-details dt{line-break:strict;color:#5a6d7c;width:40%}
.request-details .request-collaborators{display:inline-block}
.request-attachments dt,.request-attachments dd{width:100%}
.request-attachments dd{margin:10px 0 0 0}
.request-form textarea{min-height:120px}
.request-follow-up{padding-top:20px}
.pagination{margin:20px 0;text-align:center}
.pagination-next,.pagination-prev,.pagination-first,.pagination-last{display:inline-block}
.pagination-first-link,.pagination-last-link{padding:0 10px}
.pagination-first-text,.pagination-last-text{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}
.pagination-next-link{padding-right:10px}
.pagination-next-text{margin-right:10px}
[dir=rtl] .pagination-next-link{padding-left:10px}
[dir=rtl] .pagination-next-text{margin-left:10px}
.pagination-prev-link{padding-left:10px}
.pagination-prev-text{margin-left:10px}
[dir=rtl] .pagination-prev-link{padding-right:10px}
[dir=rtl] .pagination-prev-text{margin-right:10px}
.meta-group{display:block}
.meta-group-opposite{float:right}
[dir=rtl] .meta-group-opposite{float:left}
.meta-group *{display:inline}
.meta-data{color:#5a6d7c;font-size:13px}
.meta-data:not(:last-child)::after{content:"·";margin:0 5px}
.profile-header{padding:30px 0;background-color:#f7f7f7}
.profile-header .container{display:flex;flex-wrap:wrap}
@media (min-width:768px){.profile-header .container{flex-wrap:nowrap}
}
.profile-header .profile-info{flex-basis:100%;display:flex;flex-wrap:wrap;min-width:0}
.profile-avatar{position:relative;line-height:0;align-self:center;margin-right:10px}
[dir=rtl] .profile-avatar{margin-left:10px;margin-right:0}
.profile-avatar .user-avatar{width:80px;height:80px}
.profile-avatar .icon-agent{bottom:0;right:0}
.profile-header .basic-info{-moz-hyphens:auto;-ms-hyphens:auto;-webkit-hyphens:auto;word-break:break-word;word-wrap:break-word;display:flex;flex-direction:column;justify-content:center;flex-grow:1;flex-basis:0;min-width:0}
.profile-header .basic-info .name{margin:0;line-height:25px;vertical-align:middle;display:inline}
.profile-header .options{display:flex;flex-basis:100%;margin-top:12px;align-items:flex-start;flex-wrap:wrap}
@media (min-width:768px){.profile-header .options{flex-wrap:nowrap;flex-basis:auto;margin-top:0;margin-left:10px}
[dir=rtl] .profile-header .options{margin-left:0;margin-right:10px}
.profile-header .options >:not(:last-child){margin-bottom:0;margin-right:10px}
[dir=rtl] .profile-header .options >:not(:last-child){margin-left:10px;margin-right:0}
}
.user-profile-actions{width:100%;margin-bottom:15px}
.profile-header .description{-moz-hyphens:auto;-ms-hyphens:auto;-webkit-hyphens:auto;word-break:break-word;word-wrap:break-word;margin:15px 0;flex-basis:100%}
.profile-stats{font-size:13px;display:flex;flex-direction:column;flex-basis:100%}
.profile-stats .stat{display:flex;margin-bottom:10px}
.profile-stats .stat-label{color:#5a6d7c;flex:0 0 100px;margin-right:10px}
[dir=rtl] .profile-stats .stat-label{margin-left:10px;margin-right:0}
.profile-stats-activity{border-top:solid 1px #ddd;margin-top:15px}
@media (min-width:768px){.profile-stats-activity{border-top:0;flex-direction:row}
}
@media (min-width:768px){.profile-stats-activity .stat{flex-direction:column}
}
.profile-stats-activity .stat:first-child{margin-top:10px}
@media (min-width:768px){.profile-stats-activity .stat:first-child{margin-top:0}
}
@media (min-width:768px){.profile-stats-activity .stat:not(:last-child){margin-right:40px}
[dir=rtl] .profile-stats-activity .stat:not(:last-child){margin-left:40px;margin-right:0}
}
@media (min-width:768px){.profile-stats-activity .stat-label{flex:0 1 auto}
}
.profile-stats-counters{border-bottom:solid 1px #ddd}
@media (min-width:768px){.profile-stats-counters{flex:0 0 200px;border-bottom:0;margin-left:40px}
[dir=rtl] .profile-stats-counters{margin-left:0;margin-right:40px}
}
@media (min-width:1024px){.profile-stats-counters{flex:0 0 270px;margin-left:60px}
[dir=rtl] .profile-stats-counters{margin-right:60px;margin-left:0}
}
@media (min-width:768px){.profile-stats-counters .stat{flex-direction:column}
}
@media (min-width:1024px){.profile-stats-counters .stat{flex-direction:row}
}
@media (min-width:768px){.profile-stats-counters .stat:not(:last-child){margin-bottom:15px}
}
@media (min-width:768px){.profile-stats-counters .stat-label{flex:0 1 auto}
}
@media (min-width:1024px){.profile-stats-counters .stat-label{flex:0 0 100px}
}
.profile-private-badge{flex-basis:100%;border:solid 1px #17494D;border-radius:4px;color:#17494D;padding:5px 20px;font-size:12px;text-align:center}
.profile-private-badge .profile-private-icon{margin-left:5px;line-height:15px}
@media (min-width:768px){.profile-private-badge{flex-basis:auto}
}
.profile-nav{background-color:#f2f2f2;margin-bottom:37px}
.profile-section{width:100%}
@media (min-width:1024px){.profile-section{width:calc(100% - 330px)}
}
.profile-section-header{display:flex;flex-wrap:wrap}
.profile-section-title{flex-basis:100%;margin-bottom:0}
.profile-section-description{flex-basis:100%;padding:10px 0;color:#5a6d7c;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:768px){.profile-section-description{flex:1 0 50%;padding-bottom:0}
}
.profile-section-sorter{flex-basis:100%;border-top:solid 1px #eee;font-size:13px}
.profile-section-sorter .dropdown-toggle{padding:10px 0;width:100%}
.profile-section-sorter .dropdown-toggle::after{position:absolute;right:0}
[dir=rtl] .profile-section-sorter .dropdown-toggle::after{left:0;right:initial}
@media (min-width:768px){.profile-section-sorter .dropdown-toggle::after{position:relative}
}
@media (min-width:768px){.profile-section-sorter{flex:0 1 auto;padding-top:0;border-top:0;margin-left:20px}
[dir=rtl] .profile-section-sorter{margin-left:0;margin-right:20px}
}
.profile-badges-items{margin-top:25px}
.profile-badges-item{border-top:1px solid #ddd;display:flex;flex:1;flex-direction:row;justify-content:flex-start;padding:27px 12px}
.profile-badges-item > div{padding-right:12px;padding-left:12px}
.profile-badges-item-image{height:40px;width:40px;margin-right:12px}
.profile-badges-item-image img{max-height:40px}
[dir=rtl] .profile-badges-item-image{margin-left:12px;margin-right:0}
.profile-badges-item-title,.profile-badges-item-metadata-title{font-size:15px;margin-bottom:10px}
.profile-badges-item-title{font-weight:600}
.profile-badges-item-description,.profile-badges-item-metadata-description{color:#5a6d7c;font-size:13px;margin:0}
.profile-badges-item-metadata{margin-left:auto;text-align:right}
[dir=rtl] .profile-badges-item-metadata{margin-left:0;margin-right:auto;text-align:left}
.profile-contribution{-moz-hyphens:auto;-ms-hyphens:auto;-webkit-hyphens:auto;word-break:break-word;word-wrap:break-word;padding:20px 0;position:relative}
.profile-contribution-header{margin-bottom:5px}
.profile-contribution-title{margin:0 0 5px 0;display:inline;line-height:21px;font-size:15px;vertical-align:middle}
.profile-contribution-body{margin:10px 0}
.profile-contribution-list > .profile-contribution{border-top:1px solid #eee}
@media (min-width:768px){.profile-contribution-list > .profile-contribution{padding-left:30px}
[dir=rtl] .profile-contribution-list > .profile-contribution{padding-right:30px;padding-left:0}
}
.profile-contribution-list > .profile-contribution:last-child{border-bottom:1px solid #eee}
.profile-contribution-icon{left:0;position:absolute;color:#ccc;line-height:25px}
[dir=rtl] .profile-contribution-icon{right:0}
.profile-contribution-icon svg{vertical-align:middle}
.profile-contribution-list .profile-contribution-header{margin-left:30px}
[dir=rtl] .profile-contribution-list .profile-contribution-header{padding-right:30px;padding-left:0}
@media (min-width:768px){.profile-contribution-list .profile-contribution-header{margin-left:0}
[dir=rtl] .profile-contribution-list .profile-contribution-header{padding-right:0}
}
.profile-comments .profile-contribution-breadcrumbs{margin-left:30px}
[dir=rtl] .profile-comments .profile-contribution-breadcrumbs{padding-right:30px;padding-left:0}
@media (min-width:768px){.profile-comments .profile-contribution-breadcrumbs{margin-left:0}
[dir=rtl] .profile-comments .profile-contribution-breadcrumbs{padding-right:0}
}
.profile-section .no-activity,.profile-section .private-activity{display:block;margin-top:40px;color:#999}
.private-activity-icon{margin-right:10px}
[dir=rtl] .private-activity-icon{margin-right:0;margin-left:10px}
.profile-activity-list{margin-top:25px}
.profile-activity{position:relative;padding-bottom:30px}
@media (min-width:768px){.profile-activity{padding-left:20px}
[dir=rtl] .profile-activity{padding-right:20px;padding-left:0}
}
@media (min-width:768px){.profile-activity:not(:last-child){border-left:1px solid #ddd}
[dir=rtl] .profile-activity:not(:last-child){border-left:0;border-right:1px solid #ddd}
}
.profile-activity-header{display:flex;align-items:center;margin-left:35px}
[dir=rtl] .profile-activity-header{margin-left:0;margin-right:35px}
@media (min-width:768px){.profile-activity-header{margin-left:0}
[dir=rtl] .profile-activity-header{margin-right:0}
}
.profile-activity-header .user-avatar{width:40px;height:40px;margin-right:10px;min-width:40px;align-self:flex-start}
[dir=rtl] .profile-activity-header .user-avatar{margin-left:10px;margin-right:0}
.profile-activity-description{-moz-hyphens:auto;-ms-hyphens:auto;-webkit-hyphens:auto;word-break:break-word;word-wrap:break-word;margin:0;min-width:0;width:100%}
.profile-activity-description span:first-child{font-weight:600;display:inline}
.profile-activity-contribution{padding:20px;margin-top:10px;border-radius:8px;background-color:#f7f7f7}
@media (min-width:768px){.profile-activity-contribution{margin-top:0;margin-left:50px}
[dir=rtl] .profile-activity-contribution{margin-left:0;margin-right:50px}
}
.profile-activity-icon{position:absolute;left:0;width:28px;height:28px;border-radius:50%;background-size:14px 14px;background-repeat:no-repeat;background-color:#FFFFFF;background-position:50% 50%;text-align:center;color:#ccc}
[dir=rtl] .profile-activity-icon{right:0}
@media (min-width:768px){.profile-activity-icon{left:-14px}
[dir=rtl] .profile-activity-icon{right:-14px}
}
.profile-activity-icon svg{position:relative;top:50%;transform:translateY(-50%);width:1em;height:1em;margin:auto}
.search-results{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-between}
@media (min-width:1024px){.search-results{flex-direction:row}
}
.search-results-column{flex:1}
@media (min-width:1024px){.search-results-column{flex:0 0 75%}
}
.search-results-sidebar{border-top:1px solid #ddd;flex:1 0 auto;margin-bottom:20px;padding:0}
@media (min-width:1024px){.search-results-sidebar{border:0;flex:0 0 20%;height:auto}
}
.search-results-sidebar .sidenav-item{border-radius:4px;padding:10px 36px;margin-bottom:4px;color:#2F3941}
.search-results-sidebar .sidenav-item:hover,.search-results-sidebar .sidenav-item.current{background-color:#e9ebed;text-decoration:none}
.search-results-sidebar .sidenav-subitem{unicode-bidi:embed}
.search-results-sidebar .sidenav-tag{display:flex;flex-direction:row;align-items:flex-start;flex-grow:0}
.search-results-sidebar .sidenav-tag .content-tag{background:#E9EBED;border-radius:4px;padding:4px 12px;text-decoration:none}
.search-results-sidebar .sidenav-tag .content-tag .label{font-style:normal;font-weight:600;font-size:12px;line-height:24px;text-align:center;letter-spacing:-0.000427656px;color:#49545C;flex-grow:0;vertical-align:middle;display:inline-block}
.search-results-sidebar .sidenav-tag .content-tag .close-icon{color:#555555;vertical-align:middle;display:inline-block}
.search-results-sidebar .collapsible-sidebar{margin-bottom:30px}
.search-results-sidebar .collapsible-sidebar[aria-expanded=false] .multibrand-filter-list{display:none}
@media (min-width:1024px){.search-results-sidebar .collapsible-sidebar[aria-expanded=false] .multibrand-filter-list{display:block}
}
.search-results-sidebar .multibrand-filter-list--collapsed li:nth-child(1n+6){display:none}
.search-results-sidebar .multibrand-filter-list .doc-count{color:#666}
.search-results-sidebar .see-all-filters{background:none;border:none;cursor:pointer;display:block;padding:10px;color:#1F73B7}
.search-results-sidebar .see-all-filters[aria-hidden=true]{display:none}
.search-results-sidebar .see-all-filters:hover{text-decoration:underline}
.search-results-sidebar .see-all-filters::after{content:" ⌄";font-weight:bold}
.search-results-subheading{font-size:18px;font-weight:600}
.search-results-list{margin-bottom:25px}
.search-results-list > li{padding:20px 0}
.search-results-list > li:first-child{border-top:1px solid #ddd}
.search-results .no-results{display:flex;flex-direction:column;align-items:center;padding-top:4rem}
.search-results .no-results .headline{color:#2F3941;font-weight:400;font-size:18px;line-height:24px;letter-spacing:-0.45px}
.search-results .no-results .action-prompt{color:#68737D;font-weight:400;font-size:14px;line-height:20px;letter-spacing:-0.154px}
.search-results .no-results .action-prompt a{color:#1F73B7}
.search-results .no-results .action-prompt a:visited{color:#1F73B7}
.search-result-title-container{display:flex;justify-content:space-between;align-items:center}
.search-result-title{font-size:16px;margin-bottom:0}
.search-result-votes,.search-result-meta-count{color:#5a6d7c;font-size:13px}
.search-result-votes-icon,.search-result-meta-count-icon{color:#17494D;vertical-align:middle;width:13px;height:13px}
[dir=ltr] .search-result-votes,[dir=ltr] .search-result-meta-count{margin-left:20px}
[dir=rtl] .search-result-votes,[dir=rtl] .search-result-meta-count{margin-right:20px}
.search-result-meta-container{color:#666;display:flex;flex-direction:column}
@media (min-width:1024px){.search-result-meta-container{flex-direction:row;align-items:center}
}
@media (min-width:1024px){.search-result-meta-container nav{flex:1}
}
@media (min-width:1024px){[dir=ltr] .search-result-meta-container .meta-data{margin-left:20px}
}
@media (min-width:1024px){[dir=rtl] .search-result-meta-container .meta-data{margin-right:20px}
}
.search-result-meta-container .meta-data::after{content:none}
.search-result-breadcrumbs{margin:0}
.search-result-description{margin-top:10px;margin-bottom:0;word-break:break-word}
.search-results-description em{font-style:normal;font-weight:bold}
html[lang|=zh] .search-results-description em{font-style:normal;background:yellow}
.notification{border:1px solid;display:table;font-family:sans-serif;font-size:12px;padding:13px 15px;transition:height 0.2s;width:100%;color:#555}
.notification a{color:#158ec2}
.notification-inner{margin:0 auto;padding:0 20px;max-width:980px}
.notification-icon,.notification-inline.notification-error::before,.notification-text,.notification-dismiss{display:table-cell;vertical-align:middle}
.notification-text{padding:0 15px;width:100%}
.notification + .notification{margin-bottom:-1px;position:relative;top:-1px}
.notification-error{background:#ffeded;border-color:#f7cbcb}
.notification-error .notification-icon::before,.notification-error .notification-inline.notification-error::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23555555'/%3E%3C/svg%3E")}
.notification-notice{background:#dbf3ff;border-color:#b5e0f5}
.notification-notice .notification-icon::before,.notification-notice .notification-inline.notification-error::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3.5 6l2 2L9 4.5'/%3E%3Ccircle cx='6' cy='6' r='5.5'/%3E%3C/g%3E%3C/svg%3E")}
.notification-alert{color:#ad5e18;background:#fff8ed;border-color:#fcdba9}
.notification-alert .notification-icon::before,.notification-alert .notification-inline.notification-error::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23ad5e18' stroke-linecap='round' d='M5.06 1.27l-4.5 8.5c-.18.33.06.73.44.73h9c.38 0 .62-.4.44-.73l-4.5-8.5a.494.494 0 00-.88 0zM5.5 4v2'/%3E%3Ccircle cx='5.5' cy='8' r='.8' fill='%23ad5e18'/%3E%3C/svg%3E")}
.notification-icon::before,.notification-inline.notification-error::before{background-size:cover;content:"";display:inline-block;height:14px;width:14px;vertical-align:middle}
.notification-dismiss,a.notification-dismiss{color:#555;cursor:pointer;opacity:0.6;transition:opacity 100ms ease;text-decoration:none !important}
.notification-dismiss:hover{opacity:1}
.notification-inline{border-radius:4px;line-height:14px;margin-top:5px;padding:5px;position:relative;text-align:left;vertical-align:middle}
[dir=rtl] .notification-inline{text-align:right}
.notification-inline[aria-hidden=true]{display:none}
.notification-inline.notification-error::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23e35b66'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23e35b66'/%3E%3C/svg%3E");margin:-2px 5px 0 0}
[dir=rtl] .notification-inline.notification-error::before{margin:0 0 0 5px}
.notification-inline.notification-error{background-color:#fff0f1;border:1px solid #e35b66;color:#cc3340}
.notification-inline.notification-large{padding:13px 15px;margin-bottom:25px}
.notification-left-aligned{text-align:left;padding-left:0}
html[dir=rtl] .notification-left-aligned{text-align:right;padding-left:auto;padding-right:0}
.dropdown{position:relative;display:inline-block}
.dropdown-toggle{cursor:pointer;background:none;border:0;display:inline-block;padding:0;text-align:initial;vertical-align:middle}
.dropdown-toggle:hover{text-decoration:none}
.dropdown-toggle > *{display:inline-block}
.dropdown-toggle[aria-expanded=true] + .dropdown-menu{display:block}
.dropdown-menu{background:#fff;border:1px solid #d8dcde;border-radius:3px;box-shadow:0px 20px 30px 0px rgba(23,73,77,0.15);display:none;font-size:14px;font-style:normal;font-weight:normal;left:0;margin-top:1px;min-width:170px;padding:10px 0;position:absolute;text-align:left;z-index:1000}
[dir=rtl] .dropdown-menu{text-align:right}
.dropdown-menu [role=separator]{border-bottom:1px solid #e9ebed;margin:4px 0}
.dropdown-menu [role=menuitem],.dropdown-menu [role=menuitemradio]{color:#2f3941;cursor:pointer;display:block;padding:7px 40px 7px 20px;white-space:nowrap;background-color:transparent;border:0;-webkit-appearance:none;text-align:start;line-height:inherit;width:100%}
[dir=rtl] .dropdown-menu [role=menuitem],[dir=rtl] .dropdown-menu [role=menuitemradio]{padding:7px 20px 7px 40px}
.dropdown-menu [role=menuitem]:hover,.dropdown-menu [role=menuitem]:focus,.dropdown-menu [role=menuitemradio]:hover,.dropdown-menu [role=menuitemradio]:focus{background:rgba(31,115,183,0.08);text-decoration:none;color:#2f3941}
.dropdown-menu [role=menuitem][aria-selected=true],.dropdown-menu [role=menuitem][aria-checked=true],.dropdown-menu [role=menuitemradio][aria-selected=true],.dropdown-menu [role=menuitemradio][aria-checked=true]{cursor:default}
.dropdown-menu [role=menuitem][aria-selected=true]::after,.dropdown-menu [role=menuitem][aria-checked=true]::after,.dropdown-menu [role=menuitemradio][aria-selected=true]::after,.dropdown-menu [role=menuitemradio][aria-checked=true]::after{content:"";background-image:url("data:image/svg+xml,%3Csvg aria-hidden='true' xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 7l3 3 7-7'%3E%3C/path%3E%3C/svg%3E");display:inline-block;height:12px;margin-left:10px;width:12px}
[dir=rtl] .dropdown-menu [role=menuitem][aria-selected=true]::after,[dir=rtl] .dropdown-menu [role=menuitem][aria-checked=true]::after,[dir=rtl] .dropdown-menu [role=menuitemradio][aria-selected=true]::after,[dir=rtl] .dropdown-menu [role=menuitemradio][aria-checked=true]::after{margin-left:0;margin-right:10px;float:left}
.dropdown-menu [role=menuitem][hidden],.dropdown-menu [role=menuitem][aria-hidden=true],.dropdown-menu [role=menuitemradio][hidden],.dropdown-menu [role=menuitemradio][aria-hidden=true]{display:none !important}
.dropdown-menu-end{left:auto;right:0}
.dropdown-menu-top{bottom:100%;margin-bottom:1px}
[dir=rtl] .dropdown-menu{left:auto;right:0;text-align:right}
[dir=rtl] .dropdown-menu-end{left:0;right:auto}
.dropdown-chevron-icon{vertical-align:middle}
.content-tags > p{color:#68737D;margin-top:32px;margin-bottom:4px}
.content-tags-add-hint{color:#68737D;font-size:14px}
.content-tag-list{display:flex;flex-wrap:wrap;word-break:break-word}
.content-tag-list li{border-right:1px solid #C2C8CC;margin-bottom:4px}
[dir=ltr] .content-tag-list li{padding-right:8px;margin-right:8px}
[dir=rtl] .content-tag-list li{padding-left:8px;margin-left:8px}
.content-tag-list li:last-child{border:none}
#hc-wysiwyg{border:1px solid #848F99}
.upload-dropzone{border:1px solid #848F99}
zd-summary-block{background:#f3f6f6}
[dir=ltr] zd-summary-block{border-left-color:#859fa1}
[dir=rtl] zd-summary-block{border-right-color:#859fa1}
.service-catalog-hero{background-image:url($service_catalog_hero_image);margin-bottom:10px;height:320px}
.service-catalog-description{display:flow-root}
.service-catalog-description a{color:#1F73B7;text-decoration:underline}
.service-catalog-description a:visited{color:#9358B0}
.service-catalog-description a:hover,.service-catalog-description a:active,.service-catalog-description a:focus{color:#0F3554}
.service-catalog-description img{height:auto;max-width:100%}
.service-catalog-description p > img.image-style-align-left{float:left;margin:8px 20px 6px 0}
.service-catalog-description p > img.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.service-catalog-description p > img.image-style-block-align-right{margin-left:auto;margin-right:0}
.service-catalog-description p > img.image-style-block-align-left{margin-left:0;margin-right:auto}
.service-catalog-description figure.image{display:table;margin:0 auto}
.service-catalog-description figure.image > img{display:block;width:100%}
.service-catalog-description figure.image.image-style-align-left{float:left;margin:8px 20px 6px 0}
.service-catalog-description figure.image.image-style-align-right{float:right;margin:8px 0px 6px 20px}
.service-catalog-description figure.image.image-style-block-align-right{margin-left:auto;margin-right:0}
.service-catalog-description figure.image.image-style-block-align-left{margin-left:0;margin-right:auto}
.service-catalog-description figcaption{padding:10px 0;font-size:12px;text-align:center;background-color:#f2f2f2}
.service-catalog-description ul,.service-catalog-description ol{padding-left:20px;list-style-position:outside;margin:20px 0 20px 20px}
[dir=rtl] .service-catalog-description ul,[dir=rtl] .service-catalog-description ol{padding-right:20px;padding-left:0;margin-left:0;margin-right:20px}
.service-catalog-description ul > ul,.service-catalog-description ol > ol,.service-catalog-description ol > ul,.service-catalog-description ul > ol,.service-catalog-description li > ul,.service-catalog-description li > ol{margin:0}
.service-catalog-description ul{list-style-type:disc}
.service-catalog-description:not(pre) > code{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:0 5px;margin:0 2px}
.service-catalog-description pre{background:#f7f7f7;border:1px solid #ddd;border-radius:3px;padding:10px 15px;overflow:auto;white-space:pre;direction:ltr}
.service-catalog-description blockquote{border-left:1px solid #ddd;color:#5a6d7c;font-style:italic;padding:0 15px}
.service-catalog-main-content{display:flex;gap:32px}
.service-catalog-list{width:100%}
.service-catalog-breadcrumbs{display:flex;align-items:center;gap:20px}
:root{--eu-bg-primary:#f5f7fa;--eu-bg-secondary:#ffffff;--eu-bg-tertiary:#edf0f7;--eu-bg-card:#ffffff;--eu-bg-hover:#e8ecf4;--eu-text-primary:#200c36;--eu-text-secondary:#3d4f6a;--eu-text-muted:#4d6178;--eu-accent:#154996;--eu-accent-hover:#0f3570;--eu-accent-light:#1a5cba;--eu-magenta:#c01a85;--eu-violet:#200c36;--eu-yellow:#f2cd30;--eu-mint:#9dc6b8;--eu-teal:#183A66;--eu-border:#c5cdd8;--eu-border-accent:#7ea3d4;--eu-gradient-accent:linear-gradient(135deg,#154996,#c01a85);--eu-gradient-bar:linear-gradient(90deg,#154996,#6b2080,#c01a85);--eu-shadow:0 1px 3px rgba(32,12,54,0.06),0 2px 10px rgba(21,73,150,0.06);--eu-shadow-hover:0 4px 16px rgba(21,73,150,0.1);--eu-radius:10px;--eu-radius-sm:6px;--eu-radius-lg:16px;--eu-input-bg:#ffffff;--eu-header-bg:#ffffff;--eu-header-border:#cdd5e0;--eu-icon-color:#154996}
.eu-dark{--eu-bg-primary:#0d0618;--eu-bg-secondary:#150b24;--eu-bg-tertiary:#1c1230;--eu-bg-card:rgba(32,12,54,0.6);--eu-bg-hover:#1f1535;--eu-text-primary:#eae4f4;--eu-text-secondary:#9b8fb8;--eu-text-muted:#6a5c80;--eu-accent:#5b9be6;--eu-accent-light:#7db8f5;--eu-magenta:#e84aad;--eu-border:rgba(255,255,255,0.06);--eu-border-accent:rgba(91,155,230,0.3);--eu-shadow:0 4px 24px rgba(0,0,0,0.4);--eu-shadow-hover:0 8px 32px rgba(0,0,0,0.5);--eu-input-bg:#1c1230;--eu-header-bg:#150b24;--eu-header-border:rgba(255,255,255,0.06);--eu-icon-color:#5b9be6}
body{background-color:var(--eu-bg-primary) !important;color:var(--eu-text-primary) !important;font-family:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif !important;-webkit-font-smoothing:antialiased;transition:background-color 0.3s,color 0.3s}
h1,h2{font-weight:800 !important}h3{font-weight:700 !important}
*{transition:background-color 0.3s ease,border-color 0.3s ease,color 0.25s ease,box-shadow 0.3s ease,opacity 0.3s ease}
svg *{transition:stroke 0.3s ease,fill 0.3s ease,opacity 0.3s ease}
/* Per Zendesk Copenhagen pattern: the header bar itself spans the viewport
 * edge-to-edge; only its inner content is centered at a max width.  The
 * default rule at L127 set max-width:1160px on .header which clipped the
 * background and the brand-gradient hairline to a centered island. */
.header{background:var(--eu-header-bg) !important;border-bottom:1px solid var(--eu-header-border) !important;padding:0 24px !important;overflow:visible !important;position:relative !important;z-index:100 !important;max-width:none !important;width:100% !important;margin:0 !important;box-sizing:border-box}
.header::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#154996,#6b2080,#c01a85);z-index:101;pointer-events:none}
.eu-header-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:60px;overflow:visible !important;position:relative}
.header .logo a{display:flex;align-items:center;gap:10px;text-decoration:none !important}
.eu-header-symbol{display:inline-block;flex-shrink:0;width:32px;height:32px;object-fit:contain;vertical-align:middle}
/* Full official Europeum logo (mark + wordmark, gradient + raster glyphs).
 * Sized by height so the embedded PNG glyphs stay sharp; width auto. */
.eu-header-logo{display:inline-block;flex-shrink:0;height:36px;width:auto;max-width:240px;object-fit:contain;vertical-align:middle}
.eu-brand-name{font-weight:800;font-size:16px;color:#200c36 !important;letter-spacing:0.5px;text-transform:uppercase}
.eu-dark .eu-brand-name{color:#eae4f4 !important}
/* Visually hidden — keeps the wordmark accessible to screen readers
 * without rendering a duplicate of what's already in the SVG. */
.eu-visually-hidden{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Symbol/logo are the official gradient mark; visible in both themes.
 * In dark mode the mark stays brand-coloured (no recolour) with a small
 * contrast lift. The .logo img display:none rule is removed so the new
 * full logo stays visible in dark mode too. */
.eu-dark .eu-header-symbol,
.eu-dark .eu-header-logo{filter:saturate(1.05) brightness(1.05)}
.header a{color:var(--eu-text-primary) !important}
.header a:hover{color:var(--eu-accent-light) !important}
.nav-wrapper-desktop{display:flex !important;align-items:center !important;gap:8px;overflow:visible !important}
.user-nav{overflow:visible !important}
.user-nav-list{display:flex;align-items:center;gap:2px;overflow:visible !important}
.user-nav-list li a{padding:6px 12px;border-radius:var(--eu-radius-sm);font-size:13px;font-weight:500;white-space:nowrap}
.user-nav-list li a:hover{background:var(--eu-bg-hover)}
@media (max-width:1024px){.user-nav-list li a{padding:6px 8px;font-size:12px}}
.eu-btn-submit{background:var(--eu-gradient-accent) !important;color:#fff !important;padding:8px 20px !important;border-radius:var(--eu-radius) !important;font-weight:600 !important;font-size:14px !important;box-shadow:0 2px 8px rgba(21,73,150,0.25)}
.eu-btn-submit:hover{box-shadow:0 4px 16px rgba(21,73,150,0.4) !important;transform:translateY(-1px);color:#fff !important}
.dropdown-toggle{display:flex;align-items:center;gap:8px;background:none;border:1px solid var(--eu-border);border-radius:var(--eu-radius);padding:6px 12px;cursor:pointer;color:var(--eu-text-primary);font-size:14px}
.dropdown-toggle:hover{border-color:var(--eu-border-accent)}
.user-info.dropdown{position:relative !important;z-index:9999 !important}
.dropdown-menu{background:var(--eu-bg-secondary) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius) !important;box-shadow:0 8px 30px rgba(0,0,0,0.15),0 2px 8px rgba(0,0,0,0.08) !important;overflow:visible !important;position:absolute !important;right:0 !important;top:100% !important;margin-top:6px !important;min-width:210px !important;z-index:99999 !important;padding:6px 0 !important}
.dropdown-menu a,[role="menuitem"]{display:block !important;color:var(--eu-text-primary) !important;padding:10px 16px !important;font-size:14px;font-weight:500;text-decoration:none !important;white-space:nowrap}
.dropdown-menu a:hover,[role="menuitem"]:hover{background:var(--eu-bg-hover) !important;color:var(--eu-accent) !important}
.dropdown-menu .separator{height:1px;background:var(--eu-border);margin:6px 0}
.eu-dark .dropdown-menu{background:#1a1f2e !important;border-color:rgba(255,255,255,0.08) !important;box-shadow:0 8px 30px rgba(0,0,0,0.4) !important}
.eu-dark .dropdown-menu a:hover,.eu-dark [role="menuitem"]:hover{background:rgba(255,255,255,0.06) !important}
.eu-mobile-menu-btn{display:none;background:none;border:none;color:var(--eu-text-primary);cursor:pointer;padding:8px}
@media (max-width:768px){.nav-wrapper-desktop{display:none !important}
.eu-mobile-menu-btn{display:block}
}
/* Mobile nav wrapper — hidden on desktop, revealed on tablets/phones.
 * Earlier rule was just `display:none` with no mobile override, which
 * left the hamburger button (its only child) invisible at every width.
 * Now: hidden ≥769px, flex on phones/tablets so the hamburger is reachable. */
.user-nav-mobile{display:none}
@media (max-width:768px){
  .user-nav-mobile{display:flex !important; align-items:center; position:relative;}
  .nav-wrapper-desktop{display:none !important;}
}
/* The mobile menu drawer itself stays hidden until JS toggles `is-open`. */
.eu-mobile-menu{
  display:none;
  position:absolute; right:0; top:calc(100% + 8px);
  background:var(--eu-bg-card); border:1px solid var(--eu-border);
  border-radius:12px; padding:12px; min-width:220px;
  box-shadow:var(--eu-shadow-hover); z-index:1000;
}
.eu-mobile-menu.is-open{ display:block; }
.eu-mobile-menu ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.eu-mobile-menu li{ display:block; }
.eu-mobile-menu a{
  display:block; padding:10px 14px; border-radius:8px;
  color:var(--eu-text-primary) !important; text-decoration:none !important;
  font-size:14px; font-weight:500;
}
.eu-mobile-menu a:hover{ background:var(--eu-bg-hover, rgba(0,0,0,0.04)); }
.eu-mobile-user{
  display:flex; align-items:center; gap:8px;
  padding:8px 14px 12px; border-bottom:1px solid var(--eu-border);
  margin-bottom:8px; font-size:13px; color:var(--eu-text-secondary);
}
.hero{background:linear-gradient(180deg,var(--eu-bg-secondary) 0%,var(--eu-bg-primary) 100%) !important;background-image:none !important;padding:48px 24px 56px !important;text-align:center;position:relative}
.hero-image,.hero__image{display:none !important}
.eu-hero-logo{display:flex;justify-content:center;margin-bottom:16px;color:var(--eu-accent)}
.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 50% 0%,rgba(21,73,150,0.08) 0%,transparent 70%);pointer-events:none}
.eu-hero-title{font-size:32px !important;font-weight:800 !important;color:var(--eu-text-primary) !important;margin:0 0 8px !important}
.eu-hero-subtitle{font-size:16px;color:var(--eu-text-secondary) !important;margin:0 0 28px !important}
.search-container{max-width:600px;margin:0 auto;position:relative}
.eu-search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--eu-text-muted);z-index:1;pointer-events:none}
.hero .search input,.search-full input{background:var(--eu-input-bg) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius) !important;color:var(--eu-text-primary) !important;height:48px !important;font-size:15px !important;padding-left:44px !important;box-shadow:var(--eu-shadow)}
.hero .search input:focus,.search-full input:focus{border-color:var(--eu-accent) !important;box-shadow:0 0 0 3px rgba(21,73,150,0.15),var(--eu-shadow) !important}
.eu-quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:-28px auto 32px;max-width:700px;position:relative;z-index:2;padding:0 16px}
.eu-action-card{display:flex;align-items:center;gap:16px;padding:18px 20px;background:var(--eu-bg-card) !important;border:1px solid var(--eu-border);border-radius:var(--eu-radius-lg);text-decoration:none !important;box-shadow:var(--eu-shadow);transition:all 0.25s ease}
.eu-action-card:hover{border-color:var(--eu-border-accent);box-shadow:var(--eu-shadow-hover);transform:translateY(-2px)}
.eu-action-card--primary{border-color:rgba(21,73,150,0.2);background:linear-gradient(135deg,rgba(21,73,150,0.05),rgba(0,128,184,0.03)) !important}
.eu-dark .eu-action-card--primary{background:linear-gradient(135deg,rgba(21,73,150,0.12),rgba(0,128,184,0.06)) !important}
.eu-action-icon{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--eu-radius);background:rgba(21,73,150,0.08);color:var(--eu-icon-color)}
.eu-dark .eu-action-icon{background:rgba(21,73,150,0.15)}
.eu-action-text{flex:1}
.eu-action-title{display:block;font-weight:600;font-size:15px;color:var(--eu-text-primary) !important}
.eu-action-desc{display:block;font-size:13px;color:var(--eu-text-secondary) !important;margin-top:2px}
.eu-action-arrow{color:var(--eu-text-muted);flex-shrink:0}
.eu-section-header{margin-bottom:20px}
.eu-section-title{display:flex;align-items:center;gap:10px;font-size:20px !important;font-weight:800 !important;color:var(--eu-text-primary) !important;margin:0 !important}
.eu-section-title svg{color:var(--eu-icon-color);flex-shrink:0}
.eu-section-desc{color:var(--eu-text-secondary) !important;font-size:14px;margin:4px 0 0 30px !important}
.blocks-list{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(280px,1fr)) !important;gap:16px !important;list-style:none !important;padding:0 !important}
.blocks-item{background:var(--eu-bg-card) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius-lg) !important;box-shadow:var(--eu-shadow);transition:all 0.25s ease;overflow:hidden}
.blocks-item:hover{border-color:var(--eu-border-accent) !important;box-shadow:var(--eu-shadow-hover);transform:translateY(-3px)}
.blocks-item-link{display:flex;flex-direction:column;padding:24px !important;text-decoration:none !important;height:100%}
.eu-card-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--eu-radius);background:rgba(21,73,150,0.08);color:var(--eu-icon-color);margin-bottom:14px}
.eu-dark .eu-card-icon{background:rgba(21,73,150,0.15)}
.blocks-item-title{font-size:16px !important;font-weight:600 !important;color:var(--eu-text-primary) !important;margin-bottom:8px}
.blocks-item-description{font-size:14px !important;color:var(--eu-text-secondary) !important;line-height:1.5;flex:1}
.eu-card-cta{font-size:13px;font-weight:500;color:var(--eu-accent-light) !important;margin-top:14px}
.eu-promoted{margin:32px 0}
.eu-article-list{list-style:none;padding:0;margin:0}
.eu-article-item{border-bottom:1px solid var(--eu-border)}
.eu-article-item a{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;text-decoration:none !important;border-radius:var(--eu-radius-sm);transition:background 0.15s}
.eu-article-item a:hover{background:var(--eu-bg-hover)}
.eu-article-title{font-size:15px;font-weight:500;color:var(--eu-text-primary) !important}
.eu-badge{font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:0.5px}
.eu-badge--internal{background:rgba(200,138,30,0.1);color:#c88a1e;border:1px solid rgba(200,138,30,0.2)}
.eu-request-page{max-width:820px;margin:0 auto;padding:0 0 32px}
.eu-req-hero{text-align:center;padding:20px 20px 18px;margin-bottom:24px;border-radius:0 0 16px 16px;background:linear-gradient(135deg,rgba(21,73,150,0.04) 0%,rgba(33,150,243,0.06) 100%);border-bottom:1px solid rgba(21,73,150,0.08)}
.eu-dark .eu-req-hero{background:linear-gradient(135deg,rgba(21,73,150,0.08) 0%,rgba(33,150,243,0.10) 100%);border-bottom-color:rgba(21,73,150,0.15)}
.eu-req-hero-inner{max-width:480px;margin:0 auto}
.eu-req-hero-logo{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:linear-gradient(135deg,#154996 0%,#c01a85 100%);color:#fff;margin-bottom:16px;box-shadow:0 4px 16px rgba(21,73,150,0.25)}
.eu-req-hero h1{margin:0 0 8px !important;font-size:24px !important;font-weight:700 !important;color:var(--eu-text-primary) !important}
.eu-req-hero-sub{color:var(--eu-text-muted) !important;font-size:14px;margin:0 !important;line-height:1.5}
.eu-req-hero--compact{padding:16px 20px 14px !important;margin-bottom:16px !important}
.eu-req-hero--compact .eu-req-hero-logo{width:40px;height:40px;border-radius:10px;margin-bottom:8px}
.eu-req-hero--compact .eu-req-hero-logo svg{width:22px;height:22px}
.eu-req-hero--compact h1{font-size:18px !important;margin-bottom:2px !important}
.eu-req-hero--compact .eu-req-hero-sub{font-size:12px}
.eu-form-back-bar{margin-bottom:12px}
.eu-form-back-link{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:500;color:var(--eu-accent) !important;text-decoration:none !important;transition:opacity 0.15s}
.eu-form-back-link:hover{opacity:0.8}
.eu-form-back-link svg{flex-shrink:0}
.eu-form-loading{text-align:center;padding:40px 20px;color:var(--eu-text-muted);font-size:14px}
.eu-form-loading .eu-nop-spinner{margin:0 auto 12px}
.eu-form-loading p{margin:0 0 6px}
.eu-form-signin-hint{margin-top:12px !important;padding:10px 16px;background:rgba(21,73,150,0.04);border:1px solid rgba(21,73,150,0.1);border-radius:8px;display:inline-block;font-size:13px}
.eu-form-signin-hint a{color:var(--eu-accent) !important;font-weight:600;text-decoration:none !important}
.eu-form-signin-hint a:hover{text-decoration:underline !important}
.eu-help-tips{margin-bottom:20px}
.eu-tip{display:flex;align-items:center;gap:10px;padding:12px 16px;background:rgba(21,73,150,0.05);border:1px solid rgba(21,73,150,0.1);border-radius:var(--eu-radius);font-size:14px;color:var(--eu-text-secondary) !important}
.eu-dark .eu-tip{background:rgba(21,73,150,0.08);border-color:rgba(21,73,150,0.15)}
.eu-tip svg{color:var(--eu-icon-color);flex-shrink:0}
.eu-form-container{background:var(--eu-bg-card) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius-lg) !important;padding:32px !important;box-shadow:var(--eu-shadow)}
.eu-form-container button[type="submit"],.eu-form-container [data-garden-id*="buttons.button"][data-garden-container-id*="primary"],#new-request-form button[type="submit"],.form button[type="submit"]{background:var(--eu-accent) !important;color:#fff !important;border:none !important;border-radius:8px !important;padding:10px 24px !important;font-size:14px !important;font-weight:600 !important;cursor:pointer !important;transition:background 0.15s !important}
.eu-form-container button[type="submit"]:hover,#new-request-form button[type="submit"]:hover,.form button[type="submit"]:hover{background:var(--eu-accent-hover) !important}
.form-field label,[data-garden-id] label{color:var(--eu-text-primary) !important;font-weight:600 !important;font-size:14px !important;margin-bottom:6px !important;font-family:'Inter',sans-serif !important}
.form-field .hint{color:var(--eu-text-muted) !important;font-size:13px}
input[type="text"],input[type="email"],input[type="password"],input[type="url"],input[type="number"],input[type="tel"],input[type="search"],textarea,select,.nesty-input{background:var(--eu-input-bg) !important;border:1px solid var(--eu-border) !important;color:var(--eu-text-primary) !important;border-radius:var(--eu-radius) !important;font-family:'Inter',sans-serif !important;font-size:14px !important;padding:10px 14px !important;min-height:44px;width:100%;box-sizing:border-box}
input:focus,textarea:focus,select:focus,.nesty-input:focus{border-color:var(--eu-accent) !important;box-shadow:0 0 0 3px rgba(21,73,150,0.15) !important;outline:none !important}
textarea{min-height:140px !important;resize:vertical;line-height:1.6}
.form-field{margin-bottom:20px !important}
.nesty-panel{background:var(--eu-bg-secondary) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius) !important;box-shadow:var(--eu-shadow-hover) !important}
.nesty-panel li{color:var(--eu-text-primary) !important;padding:10px 16px !important;border-bottom:1px solid var(--eu-border)}
.nesty-panel li:hover{background:var(--eu-bg-hover) !important}
.nesty-panel li:last-child{border-bottom:none}
.upload-dropzone{background:var(--eu-bg-tertiary) !important;border:2px dashed var(--eu-border) !important;border-radius:var(--eu-radius) !important;padding:24px !important;text-align:center;color:var(--eu-text-muted) !important}
.upload-dropzone:hover{border-color:var(--eu-accent) !important}
input[type="submit"],button[type="submit"],.request-submit input{background:var(--eu-gradient-accent) !important;color:#fff !important;border:none !important;border-radius:var(--eu-radius) !important;font-weight:600 !important;font-size:15px !important;padding:12px 32px !important;cursor:pointer;font-family:'Inter',sans-serif !important;min-height:48px;box-shadow:0 2px 8px rgba(21,73,150,0.3)}
input[type="submit"]:hover,button[type="submit"]:hover{box-shadow:0 4px 16px rgba(21,73,150,0.5) !important;transform:translateY(-1px)}
.zd-editor,.fr-box,.fr-wrapper{background:var(--eu-input-bg) !important;border-color:var(--eu-border) !important;color:var(--eu-text-primary) !important}
.fr-toolbar{background:var(--eu-bg-tertiary) !important;border-color:var(--eu-border) !important}
table{border-collapse:collapse;width:100%}
th{background:var(--eu-bg-tertiary) !important;color:var(--eu-text-primary) !important;border-color:var(--eu-border) !important;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:0.5px;padding:12px 16px !important}
td{color:var(--eu-text-secondary) !important;border-color:var(--eu-border) !important;padding:12px 16px !important}
tr:hover td{background:var(--eu-bg-hover) !important}
.status-label,.request-status{border-radius:20px !important;font-weight:500 !important;font-size:12px !important;padding:4px 12px !important}
.container-divider,.sub-nav{background:var(--eu-bg-secondary) !important;border-color:var(--eu-border) !important}
.breadcrumbs li a,.breadcrumbs li span{color:var(--eu-text-secondary) !important}
.breadcrumbs li a:hover{color:var(--eu-accent-light) !important}
.article-body:not(.eu-doc-article__body){color:var(--eu-text-primary) !important}
.article-body h1,.article-body h2,.article-body h3{color:var(--eu-text-primary) !important}
.article-body p,.article-body li{color:var(--eu-text-secondary) !important;line-height:1.7}
.article-body a{color:var(--eu-accent-light) !important}
.article-body code,.article-body pre{background:var(--eu-bg-tertiary) !important;border:1px solid var(--eu-border) !important;color:var(--eu-text-primary) !important;border-radius:4px}
.article-body blockquote{border-left:3px solid var(--eu-accent) !important;background:var(--eu-bg-tertiary) !important;padding:12px 20px !important}
.btn,a.btn,button.btn{background:var(--eu-gradient-accent) !important;color:#fff !important;border:none !important;border-radius:var(--eu-radius) !important;font-weight:500 !important;box-shadow:0 2px 8px rgba(21,73,150,0.3)}
.btn:hover{box-shadow:0 4px 16px rgba(21,73,150,0.5) !important;transform:translateY(-1px)}
a{color:var(--eu-accent-light) !important}
a:hover{color:var(--eu-accent-hover) !important}
a:visited{color:var(--eu-accent) !important}
h1,h2,h3,h4,h5,h6{color:var(--eu-text-primary) !important;font-family:'Inter',sans-serif !important}
p,li,span,div{color:inherit}
.footer,footer{background:var(--eu-bg-secondary) !important;border-top:1px solid var(--eu-border) !important;color:var(--eu-text-muted) !important}
.footer a,footer a{color:var(--eu-text-secondary) !important}
.footer a:hover,footer a:hover{color:var(--eu-accent-light) !important}
.eu-theme-toggle{position:fixed !important;top:auto !important;bottom:24px !important;right:24px !important;left:auto !important;z-index:9999;width:auto;height:40px;padding:0 14px 0 10px;border-radius:20px;border:2px solid var(--eu-border);background:var(--eu-bg-card);color:var(--eu-icon-color);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;box-shadow:0 2px 12px rgba(0,0,0,0.15);font-size:11px;font-weight:500;font-family:'Inter',sans-serif}
.eu-theme-toggle:hover{box-shadow:0 4px 20px rgba(21,73,150,0.25);border-color:var(--eu-accent);transform:scale(1.1);background:var(--eu-accent);color:#fff}
.eu-theme-icon--sun{display:none}
.eu-theme-icon--moon{display:block}
.eu-dark .eu-theme-icon--sun{display:block}
.eu-dark .eu-theme-icon--moon{display:none}
.eu-dark::-webkit-scrollbar{width:6px}
.eu-dark::-webkit-scrollbar-track{background:#080c16}
.eu-dark::-webkit-scrollbar-thumb{background:#4a5c74;border-radius:3px}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}
to{opacity:1;transform:translateY(0)}
}
.blocks-item,.eu-action-card,.eu-form-container{animation:fadeIn 0.4s ease-out}
.notification,.callout{background:var(--eu-bg-tertiary) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius) !important;color:var(--eu-text-primary) !important}
.comment,.comment-container{border-color:var(--eu-border) !important}
.comment-author,.comment-body{color:var(--eu-text-primary) !important}
.section-tree a{color:var(--eu-text-secondary) !important}
.section-tree a:hover,.section-tree a.current{color:var(--eu-accent-light) !important}
.service-catalog-list,.service-catalog-item{background:var(--eu-bg-card) !important;border:1px solid var(--eu-border) !important;border-radius:var(--eu-radius) !important}
.pagination .pagination-current{background:var(--eu-accent) !important;color:white !important;border-radius:var(--eu-radius-sm) !important}
input[type="checkbox"],input[type="radio"]{accent-color:var(--eu-accent);min-height:auto}
.required-hint,.required{color:#c0392b !important}
.eu-dark .hero-inner .hero-image,.eu-dark .hero__image{opacity:0.15}
.eu-form-categories{margin-bottom:24px;padding:0 4px}
.eu-category-group{margin-bottom:24px}
.eu-category-group-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--eu-border)}
.eu-category-group-title{display:flex;align-items:center;gap:8px;font-size:14px !important;font-weight:600 !important;color:var(--eu-text-primary) !important;margin:0 !important;font-family:'Inter',sans-serif !important}
.eu-category-group-title svg{color:var(--eu-icon-color);flex-shrink:0}
.eu-category-group-badge{font-size:10px;font-weight:600;padding:2px 8px;border-radius:10px;background:rgba(21,73,150,0.08);color:var(--eu-accent);letter-spacing:0.5px}
.eu-category-group-badge--nop{background:rgba(39,174,96,0.08);color:#1e7e34}
.eu-dark .eu-category-group-badge{background:rgba(21,73,150,0.15)}
.eu-dark .eu-category-group-badge--nop{background:rgba(39,174,96,0.15)}
.eu-category-group--nop{margin-top:8px}
.eu-category-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.eu-cat-card{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--eu-bg-card) !important;border:1px solid var(--eu-border);border-radius:10px !important;text-decoration:none !important;transition:all 0.2s ease;cursor:pointer}
.eu-cat-card:hover{border-color:var(--eu-accent) !important;background:var(--eu-bg-hover) !important;box-shadow:0 2px 8px rgba(21,73,150,0.08);transform:translateY(-1px)}
.eu-cat-icon{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(21,73,150,0.06);color:var(--eu-icon-color)}
.eu-category-group--nop .eu-cat-icon{background:rgba(39,174,96,0.06);color:#1e7e34}
.eu-dark .eu-cat-icon{background:rgba(21,73,150,0.12)}
.eu-dark .eu-category-group--nop .eu-cat-icon{background:rgba(39,174,96,0.12)}
.eu-cat-text{flex:1;min-width:0}
.eu-cat-title{display:block;font-size:13px;font-weight:600;color:var(--eu-text-primary) !important;line-height:1.3}
.eu-cat-desc{display:block;font-size:13px;color:var(--eu-text-muted) !important;line-height:1.4}
.eu-back-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--eu-accent-light) !important;margin-bottom:16px;text-decoration:none !important}
.eu-back-link:hover{color:var(--eu-accent-hover) !important}
.footer,footer{background:var(--eu-bg-secondary) !important;border-top:1px solid var(--eu-border) !important;padding:24px !important}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}
@media (max-width:768px){.eu-quick-actions{grid-template-columns:1fr}
.blocks-list{grid-template-columns:1fr !important}
.eu-hero-title{font-size:24px !important}
.eu-req-hero{padding:24px 16px 20px}
.eu-req-hero h1{font-size:20px !important}
.eu-form-container{padding:20px !important}
.eu-category-cards{grid-template-columns:1fr}
.eu-cat-card{padding:12px 14px}
.eu-nop-filters{flex-direction:column}
.eu-nop-table-wrap{overflow-x:auto}
.eu-dash-tabs{flex-wrap:wrap}
}
.eu-dash-tabs{display:flex;gap:4px;margin-top:16px;border-bottom:2px solid var(--eu-border)}
.eu-dash-tab{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border:none;background:none;font-size:14px;font-weight:500;font-family:'Inter',sans-serif;color:var(--eu-text-muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all 0.2s ease}
.eu-dash-tab:hover{color:var(--eu-text-primary);background:var(--eu-bg-hover);border-radius:var(--eu-radius-sm) var(--eu-radius-sm) 0 0}
.eu-dash-tab--active{color:var(--eu-accent) !important;border-bottom-color:var(--eu-accent) !important;font-weight:600}
.eu-dash-panel{display:none}
.eu-dash-panel--active{display:block}
.eu-nop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 0 10px;flex-wrap:wrap}
.eu-nop-toolbar-selects{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
.eu-nop-sel{height:32px;padding:0 8px;border:1px solid var(--eu-border);border-radius:6px;background:var(--eu-bg-card);color:var(--eu-text-primary);font-size:12px;font-family:'Inter',sans-serif;transition:border-color 0.15s;flex-shrink:1;min-width:0}
.eu-nop-sel:focus{outline:none;border-color:var(--eu-accent);box-shadow:0 0 0 2px rgba(21,73,150,0.08)}
.eu-nop-search-wrap{position:relative;flex:1;min-width:80px;max-width:160px}
.eu-nop-search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:var(--eu-text-muted);pointer-events:none}
.eu-nop-search-input{padding-left:26px !important;width:100%}
.eu-nop-toolbar-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--eu-border);border-radius:6px;background:var(--eu-bg-card);color:var(--eu-text-muted);cursor:pointer;transition:all 0.15s;flex-shrink:0}
.eu-nop-toolbar-btn:hover{background:var(--eu-bg-hover);color:var(--eu-text-primary)}
.eu-nop-toolbar-counts{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--eu-text-muted);white-space:nowrap;flex-shrink:0}
.eu-nop-toolbar-counts .eu-ct{display:inline-flex;align-items:center;gap:3px}
.eu-nop-toolbar-counts .eu-ct-n{font-weight:700;font-size:12px}
.eu-nop-toolbar-counts .eu-ct--open .eu-ct-n{color:#e67e22}
.eu-nop-toolbar-counts .eu-ct--pending .eu-ct-n{color:#3498db}
.eu-nop-toolbar-counts .eu-ct--solved .eu-ct-n{color:#27ae60}
.eu-nop-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--eu-border);border-radius:8px;background:var(--eu-bg-card);color:var(--eu-text-primary);font-size:13px;font-weight:500;font-family:'Inter',sans-serif;cursor:pointer;transition:all 0.2s;white-space:nowrap}
.eu-nop-btn:hover{background:var(--eu-bg-hover);border-color:var(--eu-border-accent)}
.eu-nop-btn--icon{padding:7px 8px;color:var(--eu-text-muted)}
.eu-nop-btn--assign{padding:5px 10px;font-size:12px;color:var(--eu-accent);border-color:var(--eu-accent);background:rgba(21,73,150,0.05)}
.eu-nop-btn--assign:hover{background:var(--eu-accent);color:#fff}
.eu-nop-following{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:#27ae60;font-weight:500}
.eu-nop-table-wrap{border:1px solid var(--eu-border);border-radius:12px;overflow:hidden}
.eu-nop-table{width:100%;border-collapse:collapse;font-size:13px}
.eu-nop-th{padding:8px 14px;text-align:left;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:var(--eu-text-muted);background:var(--eu-bg-secondary);border-bottom:1px solid var(--eu-border)}
.eu-nop-td{padding:8px 14px;border-bottom:1px solid var(--eu-border);color:var(--eu-text-primary);vertical-align:middle}
.eu-nop-row:last-child .eu-nop-td{border-bottom:none}
.eu-nop-row:hover{background:var(--eu-bg-hover)}
.eu-nop-td--id a,.eu-nop-td--subject a{color:var(--eu-accent-light) !important;text-decoration:none !important;font-weight:500}
.eu-nop-td--id a:hover,.eu-nop-td--subject a:hover{color:var(--eu-accent-hover) !important;text-decoration:underline !important}
.eu-nop-td--subject{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eu-nop-td--time{font-size:12px;color:var(--eu-text-muted);white-space:nowrap}
.eu-badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:12px;font-weight:600;text-transform:capitalize}
.eu-badge--new,.eu-badge--open{background:#fff3e0;color:#e67e22}
.eu-badge--pending,.eu-badge--hold{background:#e3f2fd;color:#154996}
.eu-badge--solved{background:#e8f5e9;color:#2e7d32}
.eu-badge--closed{background:#f5f5f5;color:#757575}
.eu-badge--none{color:var(--eu-text-muted)}
/* Priority colour scale, mapped to SLA-target severity:
 *   P1 Urgent → red       (immediate action / criticality)
 *   P2 High   → amber/brown (impaired but non-critical)
 *   P3 Normal → green     (standard / on-track)
 *   P4 Low    → grey      (cosmetic) */
.eu-badge--pri-urgent{background:#fee2e2;color:#b91c1c;border-color:#fecaca}
.eu-badge--pri-high{background:#fef3c7;color:#92400e;border-color:#fde68a}
.eu-badge--pri-normal{background:#dcfce7;color:#15803d;border-color:#bbf7d0}
.eu-badge--pri-low{background:#f3f4f6;color:#6b7280;border-color:#e5e7eb}
.eu-dark .eu-badge--new,.eu-dark .eu-badge--open{background:rgba(230,126,34,0.15)}
.eu-dark .eu-badge--pending,.eu-dark .eu-badge--hold{background:rgba(25,118,210,0.15)}
.eu-dark .eu-badge--solved{background:rgba(46,125,50,0.15)}
.eu-dark .eu-badge--closed{background:rgba(117,117,117,0.15)}
.eu-dark .eu-badge--pri-urgent{background:rgba(198,40,40,0.15)}
.eu-dark .eu-badge--pri-high{background:rgba(230,81,0,0.15)}
.eu-dark .eu-badge--pri-normal{background:rgba(21,101,192,0.15)}
.eu-nop-spinner{display:inline-block;width:20px;height:20px;border:2px solid var(--eu-border);border-top-color:var(--eu-accent);border-radius:50%;animation:eu-spin 0.6s linear infinite;margin-right:8px;vertical-align:middle}
.eu-nop-spinner--sm{width:14px;height:14px;border-width:2px;margin-right:0}
@keyframes eu-spin{to{transform:rotate(360deg)}
}
.eu-nop-loading td{text-align:center;padding:40px !important;color:var(--eu-text-muted)}
.eu-nop-empty{text-align:center;padding:60px 20px;color:var(--eu-text-muted)}
.eu-nop-empty svg{margin-bottom:12px;opacity:0.4}
.eu-nop-pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 0;flex-wrap:wrap;gap:8px}
.eu-nop-pag-info{font-size:13px;color:var(--eu-text-muted)}
.eu-nop-pag-btns{display:flex;gap:4px}
.eu-nop-btn--pag{padding:6px 12px;font-size:13px;min-width:36px;justify-content:center}
.eu-nop-btn--pag-active{background:var(--eu-accent) !important;color:#fff !important;border-color:var(--eu-accent) !important}
.eu-node-card{background:var(--eu-bg-card);border:1px solid var(--eu-border);border-top:3px solid var(--eu-accent);border-radius:12px;padding:16px 20px;margin-bottom:20px}
.eu-node-card-header{display:flex;align-items:center;gap:12px}
.eu-node-card-identity{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.eu-node-card-icon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:rgba(39,174,96,0.08);border-radius:10px;color:#27ae60;flex-shrink:0}
.eu-node-card-icon--pending{background:rgba(230,126,34,0.08);color:#e67e22}
.eu-node-card-icon--inactive{background:rgba(117,117,117,0.08);color:#757575}
.eu-dark .eu-node-card-icon{background:rgba(39,174,96,0.15)}
.eu-dark .eu-node-card-icon--pending{background:rgba(230,126,34,0.15)}
.eu-dark .eu-node-card-icon--inactive{background:rgba(117,117,117,0.15)}
.eu-node-card-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.eu-node-card-name h3{margin:0;font-size:17px;font-weight:600;color:var(--eu-text-primary)}
.eu-node-card-meta{display:flex;align-items:center;gap:6px;margin-top:4px;flex-wrap:wrap;font-size:12px;color:var(--eu-text-muted)}
.eu-node-card-meta .eu-meta-chip{display:inline-flex;align-items:center;gap:4px}
.eu-node-card-meta .eu-meta-sep{width:3px;height:3px;border-radius:50%;background:var(--eu-text-muted);opacity:0.5;flex-shrink:0}
.eu-sla-tier--basic{color:#757575}
.eu-sla-tier--standard{color:#154996;font-weight:600}
.eu-sla-tier--premium{color:#e65100;font-weight:700}
.eu-badge--node-active-validator{background:#e8f5e9;color:#2e7d32}
.eu-badge--node-active{background:#e8f5e9;color:#388e3c}
.eu-badge--node-installation{background:#fff3e0;color:#f57c00}
.eu-badge--node-offline{background:#fce4ec;color:#c62828}
.eu-badge--node-suspended{background:#fce4ec;color:#d32f2f}
.eu-badge--node-opted-out{background:#f5f5f5;color:#757575}
.eu-badge--node-opting-out{background:#fff3e0;color:#e65100}
.eu-badge--node-banned{background:#fce4ec;color:#b71c1c}
.eu-badge--node-unknown{background:#f5f5f5;color:#9e9e9e}
.eu-dark .eu-badge--node-active-validator{background:rgba(46,125,50,0.15)}
.eu-dark .eu-badge--node-active{background:rgba(56,142,60,0.15)}
.eu-dark .eu-badge--node-installation{background:rgba(245,124,0,0.15)}
.eu-dark .eu-badge--node-offline{background:rgba(198,40,40,0.15)}
.eu-dark .eu-badge--node-suspended{background:rgba(211,47,47,0.15)}
.eu-dark .eu-badge--node-opted-out,.eu-dark .eu-badge--node-unknown{background:rgba(117,117,117,0.15)}
.eu-nop-btn--primary{background:var(--eu-accent) !important;color:#fff !important;border-color:var(--eu-accent) !important;border-radius:8px !important;text-decoration:none !important;margin-left:auto;flex-shrink:0}
.eu-nop-btn--primary:hover{background:var(--eu-accent-hover) !important;border-color:var(--eu-accent-hover) !important}
.eu-sla-widget{background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:12px;padding:20px;margin-bottom:20px}
.eu-sla-widget-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.eu-sla-widget-title{display:flex;align-items:center;gap:8px;margin:0;font-size:15px;font-weight:600;color:var(--eu-text-primary)}
.eu-sla-bh-badge{font-size:11px;font-weight:500;color:var(--eu-text-muted);background:var(--eu-bg-secondary);padding:4px 10px;border-radius:20px;white-space:nowrap}
.eu-sla-env-tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.eu-sla-env-tab{padding:5px 14px;border:1px solid var(--eu-border);border-radius:20px;background:transparent;font-size:12px;font-weight:500;font-family:'Inter',sans-serif;color:var(--eu-text-primary);cursor:pointer;transition:all 0.15s}
.eu-sla-env-tab:hover{border-color:var(--eu-accent);color:var(--eu-accent)}
.eu-sla-env-tab--active{background:var(--eu-accent) !important;color:#fff !important;border-color:var(--eu-accent) !important}
.eu-sla-dual-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:768px){.eu-sla-dual-grid{grid-template-columns:1fr}
}
.eu-sla-section{padding:16px;border-radius:10px;background:var(--eu-bg-secondary)}
.eu-sla-section--nop{background:rgba(21,73,150,0.04);border:1px solid rgba(21,73,150,0.10)}
.eu-dark .eu-sla-section--nop{background:rgba(21,73,150,0.08)}
.eu-sla-section-title{margin:0 0 12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:var(--eu-text-muted)}
.eu-sla-rows{display:flex;flex-direction:column;gap:0}
.eu-sla-row{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--eu-border)}
.eu-sla-row:last-child{border-bottom:none}
.eu-sla-row--accent{background:rgba(198,40,40,0.03);border-radius:0 0 6px 6px}
.eu-dark .eu-sla-row--accent{background:rgba(198,40,40,0.06)}
.eu-sla-row-label{font-size:13px;color:var(--eu-text-primary)}
.eu-sla-row-value{font-size:15px;font-weight:700;color:var(--eu-accent);font-variant-numeric:tabular-nums}
.eu-sla-row-value--critical{color:#c62828}
.eu-sla-progress-bar{display:none}
.eu-sla-metric-label{display:none}
.eu-sla-request-details{border-top:1px solid var(--eu-border);padding-top:12px;margin-top:12px}
.eu-badge--sla-4h{background:#fce4ec;color:#c62828}
.eu-badge--sla-8h{background:#fff3e0;color:#e65100}
.eu-badge--sla-24h{background:#e3f2fd;color:#154996}
.eu-badge--sla-72h{background:#f5f5f5;color:#757575}
.eu-dark .eu-badge--sla-4h{background:rgba(198,40,40,0.15)}
.eu-dark .eu-badge--sla-8h{background:rgba(230,81,0,0.15)}
.eu-dark .eu-badge--sla-24h{background:rgba(21,101,192,0.15)}
.eu-env-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;white-space:nowrap;color:var(--eu-text-muted)}
.eu-env-badge--pilot{background:rgba(33,150,243,0.08);color:#154996}
.eu-env-badge--preprod{background:rgba(230,126,34,0.08);color:#e67e22}
.eu-env-badge--prod{background:rgba(39,174,96,0.08);color:#27ae60}
.eu-dark .eu-env-badge--pilot{background:rgba(33,150,243,0.15)}
.eu-dark .eu-env-badge--preprod{background:rgba(230,126,34,0.15)}
.eu-dark .eu-env-badge--prod{background:rgba(39,174,96,0.15)}
.eu-proc-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;white-space:nowrap}
.eu-proc-badge--critical{background:#fce4ec;color:#c62828}
.eu-proc-badge--high{background:#fff3e0;color:#e65100}
.eu-proc-badge--standard{background:#e3f2fd;color:#154996}
.eu-proc-badge--none{color:var(--eu-text-muted);background:transparent}
.eu-dark .eu-proc-badge--critical{background:rgba(198,40,40,0.15)}
.eu-dark .eu-proc-badge--high{background:rgba(230,81,0,0.15)}
.eu-dark .eu-proc-badge--standard{background:rgba(21,101,192,0.15)}
.eu-dark .eu-badge--sla-72h{background:rgba(117,117,117,0.15)}
.eu-highlight-flash{animation:eu-flash 1.5s ease}
@keyframes eu-flash{0%,100%{background:transparent}
30%{background:rgba(21,73,150,0.08)}
}
@media (max-width:768px){.eu-node-card-header{flex-wrap:wrap}
.eu-node-card-identity{flex-basis:100%}
.eu-nop-btn--primary{margin-left:0;width:100%;justify-content:center;margin-top:8px}
.eu-sla-env-tabs{gap:6px}
.eu-nop-toolbar-selects{flex-wrap:wrap}
.eu-nop-sel{flex:1 1 calc(50% - 3px);min-width:0}
.eu-nop-search-wrap{flex:1 1 100%;max-width:none}
.eu-nop-toolbar-counts{flex-wrap:wrap}
}

@media(max-width:640px){
.eu-req-hero{padding:20px 12px 16px !important}
.eu-req-hero h1{font-size:18px !important}
.eu-category-cards{grid-template-columns:1fr !important}
.eu-nop-toolbar-selects{flex-wrap:wrap}
.eu-nop-sel{flex:1 1 calc(50% - 3px);min-width:0}
.eu-nop-search-wrap{flex:1 1 100%;max-width:none}
.eu-sla-dual-grid,.eu-sla-2col{grid-template-columns:1fr !important}
.eu-node-card-header{flex-wrap:wrap}
.eu-node-card-identity{flex-basis:100%}
}

.eu-form-container:empty::after{content:'Loading form...';display:block;text-align:center;padding:40px;color:var(--eu-text-muted);font-size:13px}

footer,#footer,.footer{border-top:1px solid var(--eu-border) !important;padding:20px !important}

/* WCAG 2.1 — Focus indicators */
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--eu-accent) !important;outline-offset:2px !important;border-radius:4px}
/* WCAG — Reduced motion */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}}
/* WCAG — High contrast mode support */
@media(forced-colors:active){.eu-badge,.eu-cat-card,.eu-node-card{border:1px solid ButtonText}}

/* Lazy loading hint for images */
img[loading="lazy"]{opacity:0;transition:opacity 0.3s}
img[loading="lazy"].loaded,img[loading="lazy"][complete]{opacity:1}

.eu-sla-compliance{background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:12px;padding:20px;margin-bottom:20px}
.eu-compliance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.eu-comp-card{text-align:center;padding:12px 8px;border-radius:8px;background:var(--eu-bg-secondary)}
.eu-comp-value{font-size:24px;font-weight:700;color:var(--eu-text-primary)}
.eu-comp-value--open{color:#e67e22}
.eu-comp-value--pending{color:#154996}
.eu-comp-value--solved{color:#27ae60}
.eu-comp-label{font-size:10px;color:var(--eu-text-muted);text-transform:uppercase;letter-spacing:0.5px;font-weight:600;margin-top:2px}
.eu-env-breakdown{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-bottom:14px}
.eu-env-card{padding:12px;border-radius:8px;border:1px solid var(--eu-border)}
.eu-env-card--pilot{border-left:3px solid #154996;background:rgba(33,150,243,0.03)}
.eu-env-card--preprod{border-left:3px solid #ff9800;background:rgba(255,152,0,0.03)}
.eu-env-card--prod{border-left:3px solid #4caf50;background:rgba(76,175,80,0.03)}
.eu-env-card-title{font-size:12px;font-weight:600;color:var(--eu-text-primary);margin-bottom:6px;text-transform:capitalize}
.eu-env-card-stats{display:flex;gap:12px;font-size:11px;color:var(--eu-text-muted)}
.eu-env-card-stat{display:flex;align-items:center;gap:3px}
.eu-env-card-stat strong{color:var(--eu-text-primary)}
.eu-env-card-bar{height:4px;border-radius:2px;background:var(--eu-border);margin-top:8px;overflow:hidden}
.eu-env-card-fill{height:100%;border-radius:2px;transition:width 0.4s}
.eu-env-card-fill--good{background:#27ae60}
.eu-env-card-fill--warn{background:#ff9800}
.eu-env-card-fill--bad{background:#e53935}
.eu-response-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.eu-resp-card{padding:10px;border-radius:8px;background:var(--eu-bg-secondary);text-align:center}
.eu-resp-val{font-size:18px;font-weight:700}
.eu-resp-val--good{color:#27ae60}
.eu-resp-val--warn{color:#ff9800}
.eu-resp-val--bad{color:#e53935}
.eu-resp-label{font-size:10px;color:var(--eu-text-muted);margin-top:2px}
@media(max-width:640px){.eu-compliance-grid{grid-template-columns:repeat(2,1fr)}.eu-env-breakdown{grid-template-columns:1fr}}


/* ══════════════════════════════════════
   DESIGN SYSTEM v2 — Smooth & Professional
   ══════════════════════════════════════ */

/* ── Global Transitions ── */
*{transition-property:background-color,border-color,color,box-shadow,opacity,transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.4,0,0.2,1)}
a,button,input,select,textarea{transition-duration:0.15s}

/* ── Smooth Page Load ── */
body{opacity:0;animation:pageIn 0.4s ease forwards}
@keyframes pageIn{from{opacity:0}to{opacity:1}}

/* ── Better Card Hover Effects ── */
.eu-cat-card{transform:translateY(0);transition:transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease !important}
.eu-cat-card:hover{transform:translateY(-2px) !important;box-shadow:0 4px 16px rgba(21,73,150,0.12) !important}

/* ── Hero Polish ── */
.eu-req-hero{background:linear-gradient(135deg,rgba(21,73,150,0.03) 0%,rgba(41,121,201,0.06) 50%,rgba(21,73,150,0.02) 100%) !important;backdrop-filter:blur(40px)}
.eu-req-hero-logo{transition:transform 0.3s ease;box-shadow:0 8px 32px rgba(21,73,150,0.25) !important}
.eu-req-hero-logo:hover{transform:scale(1.05) rotate(3deg)}

/* ── Header Glass Effect ── */
.header{backdrop-filter:blur(16px) saturate(180%) !important;-webkit-backdrop-filter:blur(16px) saturate(180%) !important;background:rgba(255,255,255,0.85) !important;border-bottom:1px solid rgba(0,0,0,0.06) !important}
.eu-dark .header{background:rgba(14,20,36,0.9) !important;border-bottom:1px solid rgba(255,255,255,0.04) !important}

/* ── Node Card Premium Feel ── */
.eu-node-card{border-top:3px solid var(--eu-accent) !important;box-shadow:0 2px 12px rgba(21,73,150,0.06) !important;transition:box-shadow 0.3s !important}
.eu-node-card:hover{box-shadow:0 4px 24px rgba(21,73,150,0.1) !important}

/* ── SLA Widget Polish ── */
.eu-sla-widget{box-shadow:0 1px 8px rgba(0,0,0,0.04) !important;transition:box-shadow 0.3s !important}
.eu-sla-widget:hover{box-shadow:0 3px 16px rgba(0,0,0,0.08) !important}
.eu-sla-env-tab{transition:all 0.2s ease !important}
.eu-sla-env-tab--active{box-shadow:0 2px 8px rgba(21,73,150,0.3) !important}
.eu-sla-row{transition:background 0.15s !important}
.eu-sla-row:hover{background:rgba(21,73,150,0.03) !important}
.eu-sla-row-value{transition:color 0.2s,transform 0.2s !important}

/* ── Compliance Dashboard Animations ── */
.eu-sla-compliance{box-shadow:0 1px 8px rgba(0,0,0,0.04) !important}
.eu-comp-card{transition:transform 0.2s ease,box-shadow 0.2s ease !important}
.eu-comp-card:hover{transform:translateY(-1px);box-shadow:0 3px 12px rgba(0,0,0,0.08)}
.eu-comp-value{transition:color 0.3s !important}
.eu-env-card{transition:transform 0.2s ease,box-shadow 0.2s ease !important}
.eu-env-card:hover{transform:translateY(-1px);box-shadow:0 2px 10px rgba(0,0,0,0.06)}
.eu-env-card-fill{transition:width 0.6s cubic-bezier(0.4,0,0.2,1) !important}
.eu-resp-card{transition:transform 0.2s ease !important}
.eu-resp-card:hover{transform:scale(1.02)}

/* ── Toolbar Polish ── */
.eu-nop-sel{transition:border-color 0.15s,box-shadow 0.15s !important}
.eu-nop-sel:hover{border-color:var(--eu-accent) !important}
.eu-nop-toolbar-btn{transition:all 0.15s !important}

/* ── Table Row Animations ── */
.eu-nop-row{transition:background 0.15s ease !important}
.eu-nop-row:hover{background:rgba(21,73,150,0.03) !important}
.eu-nop-td a{transition:color 0.15s !important}
.eu-nop-td a:hover{color:var(--eu-accent) !important}

/* ── Badge Animations ── */
.eu-badge{transition:transform 0.15s,box-shadow 0.15s !important}
.eu-badge:hover{transform:scale(1.05)}
.eu-proc-badge{transition:transform 0.15s !important}
.eu-proc-badge:hover{transform:scale(1.05)}

/* ── Category Group Headers ── */
.eu-category-group-header{transition:border-color 0.2s !important}
.eu-category-group:hover .eu-category-group-header{border-color:var(--eu-accent) !important}

/* ── Footer Polish ── */
footer{transition:background 0.3s !important}
footer a{transition:color 0.15s !important}
footer a:hover{color:var(--eu-accent) !important}

/* ── Theme Toggle Animation ── */
.eu-theme-toggle{transition:all 0.25s cubic-bezier(0.4,0,0.2,1) !important}
.eu-theme-toggle:active{transform:scale(0.95) !important}

/* ── Scrollbar Styling ── */
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(21,73,150,0.15);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:rgba(21,73,150,0.3)}
.eu-dark ::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1)}
.eu-dark ::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.2)}

/* ── Selection Color ── */
::selection{background:rgba(21,73,150,0.15);color:inherit}
.eu-dark ::selection{background:rgba(41,121,201,0.3)}

/* ── KB Article Styling ── */
.article-body:not(.eu-doc-article__body){font-size:15px !important;line-height:1.75 !important;color:var(--eu-text-primary) !important}
.article-body:not(.eu-doc-article__body) h2{font-size:22px !important;font-weight:700 !important;margin:32px 0 12px !important;padding-bottom:8px !important;border-bottom:2px solid var(--eu-accent) !important;color:var(--eu-text-primary) !important}
.article-body:not(.eu-doc-article__body) h3{font-size:18px !important;font-weight:600 !important;margin:24px 0 8px !important;color:var(--eu-accent) !important}
.article-body:not(.eu-doc-article__body) p{margin:0 0 16px !important}
.article-body:not(.eu-doc-article__body) ul,.article-body:not(.eu-doc-article__body) ol{margin:0 0 16px !important;padding-left:24px !important}
.article-body:not(.eu-doc-article__body) li{margin:0 0 6px !important;line-height:1.6 !important}
.article-body:not(.eu-doc-article__body) table{width:100% !important;border-collapse:collapse !important;margin:16px 0 !important;border-radius:8px !important;overflow:hidden !important;box-shadow:0 1px 4px rgba(0,0,0,0.06) !important}
.article-body:not(.eu-doc-article__body) th{background:var(--eu-accent) !important;color:#fff !important;padding:10px 14px !important;font-size:13px !important;font-weight:600 !important;text-align:left !important}
.article-body:not(.eu-doc-article__body) td{padding:10px 14px !important;border-bottom:1px solid var(--eu-border) !important;font-size:14px !important}
.article-body:not(.eu-doc-article__body) tr:hover td{background:rgba(21,73,150,0.02) !important}
.article-body:not(.eu-doc-article__body) code{background:rgba(21,73,150,0.06) !important;padding:2px 6px !important;border-radius:4px !important;font-size:13px !important;font-family:'Consolas','Monaco',monospace !important;color:var(--eu-accent) !important}
.article-body:not(.eu-doc-article__body) pre{background:var(--eu-bg-secondary) !important;border:1px solid var(--eu-border) !important;border-radius:8px !important;padding:16px !important;overflow-x:auto !important;margin:16px 0 !important}
.article-body:not(.eu-doc-article__body) pre code{background:transparent !important;padding:0 !important;color:var(--eu-text-primary) !important;font-size:13px !important;line-height:1.6 !important}
.article-body:not(.eu-doc-article__body) a{color:var(--eu-accent) !important;text-decoration:none !important;border-bottom:1px solid transparent !important;transition:border-color 0.15s !important}
.article-body:not(.eu-doc-article__body) a:hover{border-bottom-color:var(--eu-accent) !important}
.article-body:not(.eu-doc-article__body) blockquote{border-left:3px solid var(--eu-accent) !important;margin:16px 0 !important;padding:12px 16px !important;background:rgba(21,73,150,0.03) !important;border-radius:0 8px 8px 0 !important}
.article-body:not(.eu-doc-article__body) img{max-width:100% !important;border-radius:8px !important;box-shadow:0 2px 12px rgba(0,0,0,0.08) !important;margin:12px 0 !important}
.article-body:not(.eu-doc-article__body) hr{border:none !important;height:1px !important;background:var(--eu-border) !important;margin:24px 0 !important}

/* ── Article Page Layout ── */
.article-header h1{font-size:28px !important;font-weight:700 !important;line-height:1.3 !important}
.article-info{font-size:13px !important;color:var(--eu-text-muted) !important;margin-bottom:24px !important}
.article-sidebar{position:sticky !important;top:20px !important}

/* ── Community Polish ── */
.blocks-item{transition:transform 0.2s ease,box-shadow 0.2s ease !important}
.blocks-item:hover{transform:translateY(-2px) !important;box-shadow:0 4px 16px rgba(0,0,0,0.08) !important}
.blocks-item-title{transition:color 0.15s !important}
.blocks-item:hover .blocks-item-title{color:var(--eu-accent) !important}

/* ── Search Polish ── */
.search-full input{transition:border-color 0.2s,box-shadow 0.2s !important;border-radius:24px !important}
.search-full input:focus{border-color:var(--eu-accent) !important;box-shadow:0 0 0 3px rgba(21,73,150,0.1) !important}

/* ── Loading States ── */
.eu-nop-spinner{border-top-color:var(--eu-accent) !important}
@keyframes eu-pulse{0%,100%{opacity:1}50%{opacity:0.5}}
.eu-nop-loading{animation:eu-pulse 1.5s ease-in-out infinite}

/* ── Notification/Flash Messages ── */
[role="alert"],[role="status"]{border-radius:8px !important;animation:slideDown 0.3s ease !important}
@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* ── Print Styles ── */
/* ══════════════════════════════════════════════════════════════
   HOMEPAGE — Hero, Actions, KB Categories, Promoted Articles
   ══════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════ */
/* HOMEPAGE DESIGN SYSTEM v2                         */
/* Senior Design: hierarchy, spacing, brand presence */
/* ══════════════════════════════════════════════════ */

/* ── Hero ── */
.eu-hero{
  background:linear-gradient(135deg, #154996 0%, #4a2090 50%, #c01a85 100%);
  color:#fff;
  padding:56px 24px 64px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.eu-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,0.08) 0%,transparent 60%);pointer-events:none}
.eu-hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(to top,var(--eu-bg-primary,#f5f7fa),transparent);pointer-events:none}
.eu-hero__inner{max-width:600px;margin:0 auto;position:relative;z-index:1}
.eu-hero__badge{display:inline-block;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:4px 14px;border-radius:20px;border:1px solid rgba(255,255,255,0.25);color:rgba(255,255,255,0.85);margin-bottom:16px;backdrop-filter:blur(4px)}
.eu-hero__title{font-size:34px;font-weight:800;margin:0 0 10px;line-height:1.15}
.eu-hero__sub{font-size:15px;color:rgba(255,255,255,0.8);margin:0 0 28px;line-height:1.5}
.eu-hero__search{max-width:480px;margin:0 auto}
.eu-hero__search .search{width:100%}
.eu-hero__search input[type="search"]{width:100%;height:50px;padding:0 20px 0 44px;border:none;border-radius:25px;font-size:15px;background:rgba(255,255,255,0.95);color:#200c36;box-shadow:0 4px 20px rgba(0,0,0,0.15)}
.eu-hero__search input[type="search"]:focus{outline:none;box-shadow:0 4px 20px rgba(0,0,0,0.15),0 0 0 3px rgba(255,255,255,0.4)}
.eu-hero__search input[type="search"]::placeholder{color:#87929d}
.eu-dark .eu-hero{background:linear-gradient(135deg, #0d0618 0%, #200c36 50%, #3d1450 100%)}
.eu-dark .eu-hero::after{background:linear-gradient(to top,var(--eu-bg-primary,#0d0618),transparent)}
.eu-dark .eu-hero__search input[type="search"]{background:rgba(255,255,255,0.1);color:#eae4f4;border:1px solid rgba(255,255,255,0.15)}
.eu-dark .eu-hero__search input[type="search"]::placeholder{color:rgba(255,255,255,0.4)}

/* ── Action Cards ── */
.eu-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:-32px auto 40px;max-width:780px;position:relative;z-index:2;padding:0 16px}
.eu-actions__card{display:flex;flex-direction:column;padding:20px;background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#e1e6eb);border-radius:14px;text-decoration:none !important;box-shadow:0 2px 12px rgba(0,0,0,0.06);transition:all 0.25s ease;position:relative;overflow:hidden}
.eu-actions__card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(21,73,150,0.12);border-color:var(--eu-accent,#154996)}
.eu-actions__card:hover .eu-actions__arrow{opacity:1;transform:translateX(0)}
.eu-actions__icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(21,73,150,0.06);color:var(--eu-accent,#154996);margin-bottom:14px}
.eu-actions__title{font-size:15px;font-weight:700;color:var(--eu-text-primary,#200c36);margin-bottom:4px;display:block}
.eu-actions__desc{font-size:12px;color:var(--eu-text-muted,#87929d);display:block;line-height:1.4;flex:1}
.eu-actions__arrow{position:absolute;top:20px;right:16px;opacity:0;transform:translateX(-4px);transition:all 0.2s;color:var(--eu-accent,#154996)}
.eu-actions__card--ops{border-left:3px solid var(--eu-magenta,#c01a85)}
.eu-actions__card--ops:hover{border-color:var(--eu-magenta,#c01a85);box-shadow:0 8px 24px rgba(192,26,133,0.1)}
.eu-actions__icon--ops{background:rgba(192,26,133,0.06);color:var(--eu-magenta,#c01a85)}
.eu-dark .eu-actions__card{background:var(--eu-bg-card);border-color:var(--eu-border)}
.eu-dark .eu-actions__icon{background:rgba(91,155,230,0.1);color:var(--eu-accent)}
.eu-dark .eu-actions__icon--ops{background:rgba(232,74,173,0.1);color:var(--eu-magenta)}

/* ── Section Headers ── */
.eu-section-hdr{margin-bottom:20px}
.eu-section-hdr__title{font-size:20px;font-weight:800;color:var(--eu-text-primary,#200c36);margin:0 0 4px;display:flex;align-items:center;gap:8px}
.eu-section-hdr__sub{font-size:13px;color:var(--eu-text-muted,#87929d);margin:0}

/* ── KB Grid ── */
.eu-kb{margin-bottom:48px}
.eu-kb__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;list-style:none;padding:0;margin:0}
.eu-kb__card{border-radius:12px;border:1px solid var(--eu-border,#e1e6eb);background:var(--eu-bg-card,#fff);transition:all 0.25s ease;overflow:hidden}
.eu-kb__card:hover{border-color:var(--eu-accent,#154996);box-shadow:0 4px 16px rgba(21,73,150,0.08);transform:translateY(-2px)}
.eu-kb__link{display:flex;flex-direction:column;padding:20px;text-decoration:none !important;height:100%;position:relative}
.eu-kb__name{font-size:15px;font-weight:700;color:var(--eu-accent,#154996);margin-bottom:6px;padding-right:20px}
.eu-kb__desc{font-size:12px;color:var(--eu-text-muted,#87929d);line-height:1.5;flex:1}
.eu-kb__arrow{position:absolute;top:20px;right:16px;color:var(--eu-text-muted,#c5cdd8);transition:all 0.2s}
.eu-kb__card:hover .eu-kb__arrow{color:var(--eu-accent,#154996);transform:translateX(2px)}
.eu-dark .eu-kb__card{background:var(--eu-bg-card);border-color:var(--eu-border)}
@media(max-width:768px){.eu-kb__grid{grid-template-columns:1fr}}

/* ── Promoted Articles ── */
.eu-promoted{margin-bottom:48px}
.eu-promoted__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.eu-promoted__item{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:8px;text-decoration:none !important;transition:background 0.15s;color:var(--eu-text-primary,#200c36)}
.eu-promoted__item:hover{background:var(--eu-bg-hover,#e8ecf4)}
.eu-promoted__icon{color:var(--eu-text-muted,#c5cdd8);flex-shrink:0}
.eu-promoted__title{font-size:14px;font-weight:500;flex:1}
.eu-promoted__badge{font-size:10px;font-weight:600;padding:2px 8px;border-radius:10px;background:rgba(242,205,48,0.15);color:#b8960a;flex-shrink:0}
@media(max-width:640px){.eu-promoted__grid{grid-template-columns:1fr}}

/* ── Community CTA ── */
.eu-community{margin-bottom:48px}
.eu-community__inner{display:flex;align-items:center;justify-content:space-between;padding:24px 28px;border-radius:14px;background:linear-gradient(135deg,rgba(21,73,150,0.04),rgba(192,26,133,0.04));border:1px solid var(--eu-border,#e1e6eb)}
.eu-community__title{font-size:17px;font-weight:700;color:var(--eu-text-primary,#200c36);margin:0 0 4px}
.eu-community__desc{font-size:13px;color:var(--eu-text-muted,#87929d);margin:0}
.eu-community__btn{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;background:var(--eu-accent,#154996);color:#fff !important;border-radius:8px;font-weight:600;font-size:13px;text-decoration:none !important;transition:all 0.2s;flex-shrink:0}
.eu-community__btn:hover{box-shadow:0 4px 12px rgba(21,73,150,0.25);transform:translateY(-1px)}
.eu-dark .eu-community__inner{background:linear-gradient(135deg,rgba(91,155,230,0.06),rgba(232,74,173,0.06));border-color:var(--eu-border)}

/* ── Mobile ── */
@media(max-width:640px){
  .eu-hero{padding:40px 16px 52px}
  .eu-hero__title{font-size:26px}
  .eu-actions{grid-template-columns:1fr;margin-top:-24px}
  .eu-community__inner{flex-direction:column;gap:16px;text-align:center}
}

/* legacy cleanup — hide old classes */
.eu-home-hero,.eu-home-actions,.eu-home-kb,.eu-home-promoted,.eu-home-community,.eu-home-activity{display:none !important}

  padding:56px 24px 48px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.eu-home-hero::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 20% 80%, rgba(255,255,255,0.06) 0%, transparent 60%),
             radial-gradient(circle at 80% 20%, rgba(255,255,255,0.04) 0%, transparent 60%);
  pointer-events:none;
}
.eu-home-hero-inner{
  max-width:640px;margin:0 auto;position:relative;z-index:1;
}
.eu-home-hero-logo{
  margin-bottom:16px;
  color:rgba(255,255,255,0.85);
}
.eu-home-hero-logo svg{
  filter:drop-shadow(0 2px 8px rgba(0,0,0,0.15));
}
.eu-home-hero-title{
  font-size:28px;font-weight:700;margin:0 0 8px;
  letter-spacing:-0.3px;
  font-family:var(--eu-font-heading, inherit);
}
.eu-home-hero-sub{
  font-size:15px;margin:0 0 24px;
  color:rgba(255,255,255,0.8);
  line-height:1.5;
}
.eu-home-search{
  max-width:520px;margin:0 auto;position:relative;
}
.eu-home-search .search{
  width:100%;
}
.eu-home-search .search input[type="search"]{
  background:rgba(255,255,255,0.95);
  border:none;border-radius:10px;
  padding:14px 16px 14px 42px;
  font-size:15px;color:#1a1a2e;
  box-shadow:0 4px 20px rgba(0,0,0,0.15);
  transition:box-shadow 0.2s;
}
.eu-home-search .search input[type="search"]:focus{
  box-shadow:0 4px 24px rgba(0,0,0,0.25);
  outline:2px solid rgba(255,255,255,0.5);outline-offset:2px;
}
.eu-home-search .search-icon{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:#555;z-index:2;
}

/* Dark mode hero */
.eu-dark .eu-home-hero{
  background:linear-gradient(135deg, #0a1628 0%, #0f1f3d 100%);
}
.eu-dark .eu-home-search .search input[type="search"]{
  background:rgba(15,22,36,0.9);color:#e0e6ed;
  border:1px solid rgba(255,255,255,0.1);
}

/* ── Quick-action Cards ── */
.eu-home-actions{
  display:flex;gap:14px;
  margin:-28px auto 32px;
  max-width:900px;
  position:relative;z-index:2;
  padding:0 16px;
  flex-wrap:wrap;
  justify-content:center;
}
@media (max-width:640px){.eu-home-actions{flex-direction:column;max-width:400px}}
.eu-home-action-card{
  flex:1;display:flex;align-items:center;gap:14px;
  background:var(--eu-bg-card,#fff);
  border:1px solid var(--eu-border,#e1e6eb);
  border-radius:12px;padding:18px 20px;
  text-decoration:none;color:var(--eu-text,#2f3941);
  box-shadow:0 2px 12px rgba(0,0,0,0.06);
  transition:all 0.2s ease;
}
.eu-home-action-card:hover{
  border-color:var(--eu-accent,#154996);
  box-shadow:0 4px 20px rgba(21,73,150,0.12);
  transform:translateY(-2px);
}
.eu-home-action-icon{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;min-width:44px;
  border-radius:10px;
  background:var(--eu-accent-subtle, rgba(21,73,150,0.08));
  color:var(--eu-accent,#154996);
}
.eu-home-action-text{display:flex;flex-direction:column;gap:2px;}
.eu-home-action-title{
  font-size:15px;font-weight:600;
  color:var(--eu-text,#2f3941);
}
.eu-home-action-desc{
  font-size:12px;color:var(--eu-text-muted,#68768a);
}
.eu-home-action-card:hover .eu-home-action-title{
  color:var(--eu-accent,#154996);
}

/* Dark mode action cards */
.eu-dark .eu-home-action-card{
  background:var(--eu-bg-card, rgba(15,22,36,0.8));
  border-color:rgba(255,255,255,0.08);
  color:#e0e6ed;
}
.eu-dark .eu-home-action-title{color:#e0e6ed;}
.eu-dark .eu-home-action-card:hover .eu-home-action-title{color:var(--eu-accent,#5b9df5);}
.eu-home-action-card--ops{border-left:3px solid var(--eu-magenta,#c01a85) !important}
.eu-home-action-card--ops:hover{border-color:var(--eu-magenta,#c01a85) !important;box-shadow:0 4px 16px rgba(192,26,133,0.12) !important}
.eu-home-action-icon--ops{background:rgba(192,26,133,0.08) !important;color:var(--eu-magenta,#c01a85) !important}
.eu-dark .eu-home-action-icon--ops{background:rgba(232,74,173,0.15) !important;color:var(--eu-magenta,#e84aad) !important}
.eu-home-action-card--ops:hover .eu-home-action-title{color:var(--eu-magenta,#c01a85) !important}

/* ── KB Categories Grid ── */
.eu-home-kb{
  margin-bottom:40px;
}
.eu-home-section-title{
  display:flex;align-items:center;gap:8px;
  font-size:18px;font-weight:700;
  color:var(--eu-text,#2f3941);
  margin:0 0 20px;
  padding-bottom:12px;
  border-bottom:2px solid var(--eu-accent,#154996);
}
.eu-home-section-title svg{color:var(--eu-accent,#154996);}

.eu-home-cat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:14px;
  list-style:none;padding:0;margin:0;
}
.eu-home-cat-item{margin:0;}
.eu-home-cat-link{
  display:flex;flex-direction:column;position:relative;
  padding:20px;
  background:var(--eu-bg-card,#fff);
  border:1px solid var(--eu-border,#e1e6eb);
  border-radius:10px;
  text-decoration:none;color:var(--eu-text,#2f3941);
  transition:all 0.2s ease;
  min-height:80px;
}
.eu-home-cat-link:hover{
  border-color:var(--eu-accent,#154996);
  box-shadow:0 4px 16px rgba(21,73,150,0.1);
  transform:translateY(-2px);
}
.eu-home-cat-title{
  font-size:15px;font-weight:600;
  margin-bottom:6px;
  padding-right:24px;
}
.eu-home-cat-desc{
  font-size:13px;
  color:var(--eu-text-muted,#68768a);
  line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.eu-home-cat-arrow{
  position:absolute;right:16px;top:20px;
  color:var(--eu-text-muted,#aaa);
  transition:transform 0.2s, color 0.2s;
}
.eu-home-cat-link:hover .eu-home-cat-arrow{
  transform:translateX(3px);
  color:var(--eu-accent,#154996);
}
.eu-home-cat-link:hover .eu-home-cat-title{
  color:var(--eu-accent,#154996);
}

/* Dark mode categories */
.eu-dark .eu-home-cat-link{
  background:var(--eu-bg-card, rgba(15,22,36,0.8));
  border-color:rgba(255,255,255,0.08);
}
.eu-dark .eu-home-section-title{color:#e0e6ed;}
.eu-dark .eu-home-cat-title{color:#e0e6ed;}
.eu-dark .eu-home-cat-link:hover .eu-home-cat-title{color:var(--eu-accent,#5b9df5);}

/* ── Promoted Articles ── */
.eu-home-promoted{margin-top:32px;}
.eu-home-article-list{
  list-style:none;padding:0;margin:0;
  display:grid;gap:8px;
}
.eu-home-article-item a{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;
  border-radius:8px;
  text-decoration:none;
  color:var(--eu-text,#2f3941);
  font-size:14px;font-weight:500;
  transition:background 0.15s;
}
.eu-home-article-item a:hover{
  background:var(--eu-bg-hover, rgba(21,73,150,0.04));
}
.eu-home-article-icon{
  color:var(--eu-text-muted,#aaa);flex-shrink:0;
}
.eu-home-article-item .icon-lock{
  color:var(--eu-text-muted,#aaa);margin-left:4px;flex-shrink:0;
}
.eu-dark .eu-home-article-item a{color:#e0e6ed;}

/* ── Community Link ── */
.eu-home-community{margin-bottom:32px;}
.eu-home-community-link{
  display:inline-flex;align-items:center;gap:6px;
  color:var(--eu-accent,#154996);font-weight:500;
  text-decoration:none;
  transition:gap 0.2s;
}
.eu-home-community-link:hover{gap:10px;}

/* ── Recent Activity ── */
.eu-home-activity{margin-bottom:40px;}

/* ── Mobile Responsive ── */
@media(max-width:768px){
  .eu-home-hero{padding:40px 16px 36px;}
  .eu-home-hero-title{font-size:22px;}
  .eu-home-actions{flex-direction:column;margin-top:-20px;}
  .eu-home-cat-grid{grid-template-columns:1fr;}
}

@media print{
.header,.footer,.eu-theme-toggle,.eu-nop-toolbar,.eu-sla-env-tabs{display:none !important}
.eu-node-card,.eu-sla-widget,.eu-sla-compliance{box-shadow:none !important;border:1px solid #ccc !important}
body{background:#fff !important;color:#000 !important}
}

/* ── Node Badge (ticket table) ── */
.eu-node-badge{font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px;background:rgba(21,73,150,0.08);color:#154996;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;display:inline-block}
.eu-node-badge--none{background:transparent;color:#87929d}
.eu-dark .eu-node-badge{background:rgba(91,155,230,0.12);color:#5b9be6}

/* ── SLA Target + Remaining + Follow-up (Node Ops table additions) ── */
.eu-sla-cell{display:inline-flex;flex-direction:column;line-height:1.15;gap:2px;padding:4px 8px;border-radius:6px;border:1px solid transparent}
.eu-sla-cell__label{font-size:10px;font-weight:700;color:#200c36;white-space:nowrap}
.eu-sla-cell__nums{font-size:10px;color:#4d6178;white-space:nowrap}
/* Severity-coloured cell — same scale as the SLA-targets card. */
.eu-sla-cell[data-pri="urgent"]{background:#fee2e2;border-color:#fecaca}
.eu-sla-cell[data-pri="urgent"] .eu-sla-cell__label{color:#b91c1c}
.eu-sla-cell[data-pri="urgent"] .eu-sla-cell__nums{color:#991b1b}
.eu-sla-cell[data-pri="high"]{background:#fef3c7;border-color:#fde68a}
.eu-sla-cell[data-pri="high"] .eu-sla-cell__label{color:#92400e}
.eu-sla-cell[data-pri="high"] .eu-sla-cell__nums{color:#78350f}
.eu-sla-cell[data-pri="normal"]{background:#dcfce7;border-color:#bbf7d0}
.eu-sla-cell[data-pri="normal"] .eu-sla-cell__label{color:#15803d}
.eu-sla-cell[data-pri="normal"] .eu-sla-cell__nums{color:#166534}
.eu-sla-cell[data-pri="low"]{background:#f3f4f6;border-color:#e5e7eb}
.eu-sla-cell[data-pri="low"] .eu-sla-cell__label{color:#6b7280}
.eu-sla-cell[data-pri="low"] .eu-sla-cell__nums{color:#4b5563}
.eu-sla-cell--none{color:#87929d;font-size:12px}
.eu-dark .eu-sla-cell__label{color:#eae4f4}
.eu-dark .eu-sla-cell__nums{color:#a7b0c0}

.eu-sla-rem{display:inline-block;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;white-space:nowrap}
.eu-sla-rem--ok{background:#e7f5ee;color:#19643a}
.eu-sla-rem--warn{background:#fff4d6;color:#7a5a00}
.eu-sla-rem--breached{background:#fbe4e4;color:#a5180c}
.eu-sla-rem--done{background:#eef1f5;color:#4d6178}
.eu-sla-rem--na{color:#87929d}
.eu-dark .eu-sla-rem--ok{background:rgba(157,198,184,.18);color:#9dc6b8}
.eu-dark .eu-sla-rem--warn{background:rgba(242,205,48,.18);color:#f2cd30}
.eu-dark .eu-sla-rem--breached{background:rgba(232,74,74,.22);color:#ff8a8a}
.eu-dark .eu-sla-rem--done{background:rgba(255,255,255,.06);color:#a7b0c0}

.eu-nop-btn--follow{font-size:11px;padding:5px 10px;border-radius:6px;border:1px solid #154996;background:#fff;color:#154996;font-weight:600;cursor:pointer;transition:all .15s ease}
.eu-nop-btn--follow:hover{background:#154996;color:#fff}
.eu-nop-btn--follow:disabled{opacity:.6;cursor:wait}
.eu-dark .eu-nop-btn--follow{background:transparent;color:#5b9be6;border-color:#5b9be6}
.eu-dark .eu-nop-btn--follow:hover{background:#5b9be6;color:#080c16}

.eu-nop-following{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#19643a}
.eu-dark .eu-nop-following{color:#9dc6b8}
.eu-nop-td--muted{color:#87929d}

.eu-node-badge__more{display:inline-block;margin-left:4px;font-size:9px;padding:1px 5px;border-radius:999px;background:rgba(192,26,133,.15);color:#c01a85;font-weight:700}
.eu-dark .eu-node-badge__more{background:rgba(232,74,173,.18);color:#e84aad}

.eu-sla-env-tab__count{display:inline-block;margin-left:5px;font-size:10px;padding:1px 6px;border-radius:999px;background:rgba(21,73,150,0.12);color:#154996;font-weight:700}
.eu-sla-env-tab--active .eu-sla-env-tab__count{background:rgba(255,255,255,.25);color:#fff}
.eu-dark .eu-sla-env-tab__count{background:rgba(91,155,230,.2);color:#5b9be6}

/* ── Action Summary Cards (Node Ops) ── */
.eu-action-summary{display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.eu-action-card{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-width:160px;padding:16px 12px;border-radius:10px;text-align:center;cursor:default;transition:transform .15s ease,box-shadow .15s ease}
.eu-action-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.eu-action-card--urgent{background:linear-gradient(135deg,#fff5f5,#fee2e2);border:1px solid #fecaca}
.eu-action-card--warn{background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1px solid #fde68a}
.eu-action-card--info{background:linear-gradient(135deg,#eff6ff,#dbeafe);border:1px solid #bfdbfe}
.eu-action-card__icon{font-size:24px;margin-bottom:4px}
.eu-action-card__count{font-size:28px;font-weight:800;line-height:1;color:var(--eu-text-primary,#200c36)}
.eu-action-card--urgent .eu-action-card__count{color:#dc2626}
.eu-action-card--warn .eu-action-card__count{color:#d97706}
.eu-action-card--info .eu-action-card__count{color:#2563eb}
.eu-action-card__label{font-size:12px;font-weight:700;margin-top:4px;color:var(--eu-text-primary,#200c36)}
.eu-action-card__hint{font-size:10px;color:var(--eu-muted,#6b7280);margin-top:2px}
.eu-dark .eu-action-card--urgent{background:rgba(220,38,38,.1);border-color:rgba(220,38,38,.25)}
.eu-dark .eu-action-card--warn{background:rgba(217,119,6,.1);border-color:rgba(217,119,6,.25)}
.eu-dark .eu-action-card--info{background:rgba(37,99,235,.1);border-color:rgba(37,99,235,.25)}
.eu-dark .eu-action-card--urgent .eu-action-card__count{color:#f87171}
.eu-dark .eu-action-card--warn .eu-action-card__count{color:#fbbf24}
.eu-dark .eu-action-card--info .eu-action-card__count{color:#60a5fa}

/* ── Action buttons/labels (ticket table) ── */
.eu-action-btn{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:5px 12px;border-radius:6px;text-decoration:none;white-space:nowrap;transition:all .15s ease}
.eu-action-btn--urgent{background:#dc2626;color:#fff;border:0}
.eu-action-btn--urgent:hover{background:#b91c1c;color:#fff}
.eu-action-btn--solved{background:#fff;color:#059669;border:1px solid #059669}
.eu-action-btn--solved:hover{background:#059669;color:#fff}
.eu-action-btn--default{background:#fff;color:#154996;border:1px solid #154996}
.eu-action-btn--default:hover{background:#154996;color:#fff}
.eu-action-label{font-size:11px;font-weight:500;white-space:nowrap;padding:4px 8px;border-radius:4px}
.eu-action-label--new{background:#f3f4f6;color:#6b7280}
.eu-action-label--open{background:#eff6ff;color:#2563eb}
.eu-action-label--hold{background:#fffbeb;color:#d97706}
.eu-action-label--closed{background:#f3f4f6;color:#9ca3af}
.eu-dark .eu-action-btn--urgent{background:#ef4444}
.eu-dark .eu-action-btn--solved{background:transparent;color:#34d399;border-color:#34d399}
.eu-dark .eu-action-btn--default{background:transparent;color:#60a5fa;border-color:#60a5fa}
.eu-dark .eu-action-label--new{background:rgba(255,255,255,.06);color:#9ca3af}
.eu-dark .eu-action-label--open{background:rgba(37,99,235,.12);color:#60a5fa}
.eu-dark .eu-action-label--hold{background:rgba(217,119,6,.12);color:#fbbf24}
.eu-dark .eu-action-label--closed{background:rgba(255,255,255,.04);color:#6b7280}

/* ── Responsive: stack action cards on narrow screens ── */
@media(max-width:640px){
  .eu-action-summary{flex-direction:column}
  .eu-action-card{flex-direction:row;gap:12px;padding:12px 16px;text-align:left}
  .eu-action-card__icon{font-size:20px;margin-bottom:0}
  .eu-action-card__count{font-size:22px}
}

/* ── Responsive: ticket table horizontal scroll ── */
.eu-nop-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -4px;padding:0 4px}
@media(max-width:1100px){
  .eu-nop-th:nth-child(5),.eu-nop-td:nth-child(5){display:none}
  .eu-nop-th:nth-child(10),.eu-nop-td:nth-child(10){display:none}
}
@media(max-width:860px){
  .eu-nop-th:nth-child(8),.eu-nop-td:nth-child(8){display:none}
  .eu-nop-th:nth-child(3),.eu-nop-td:nth-child(3){display:none}
}

/* ── Context Card (request detail page) ── */
.eu-req-context{background:linear-gradient(135deg,#f0f4ff,#faf5ff);border:1px solid #c7d2fe;border-radius:10px;padding:20px;margin-bottom:24px}
.eu-req-context__title{font-size:14px;font-weight:700;margin:0 0 8px;color:var(--eu-text-primary,#200c36)}
.eu-req-context__desc{font-size:13px;line-height:1.5;color:var(--eu-text-primary,#200c36);margin:0 0 12px}
.eu-req-context__action{margin-top:12px;padding-top:12px;border-top:1px dashed rgba(125,125,125,.2)}
.eu-req-context__steps{margin:6px 0 0;padding-left:20px;font-size:13px;line-height:1.6;color:var(--eu-text-primary,#200c36)}
.eu-req-context__steps li{margin-bottom:4px}
.eu-req-context__sla{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:12px;border-top:1px dashed rgba(125,125,125,.2);font-size:12px;flex-wrap:wrap}
.eu-req-context__sla-label{font-weight:600;color:var(--eu-muted,#6b7280)}
.eu-req-context__sla-val{font-weight:600;color:var(--eu-text-primary,#200c36)}
.eu-req-context__sla-rem{font-weight:700;padding:3px 9px;border-radius:999px;font-size:11px}
.eu-dark .eu-req-context{background:linear-gradient(135deg,rgba(21,73,150,.08),rgba(192,26,133,.06));border-color:rgba(91,155,230,.2)}

/* ══════════════════════════════════════════════════════
   Phase 4: UI/UX Overhaul
   ══════════════════════════════════════════════════════ */

/* ── Dark mode polish ── */
.eu-dark .eu-nop-table{border-color:rgba(255,255,255,.06)}
.eu-dark .eu-nop-th{background:rgba(15,22,36,.6);border-color:rgba(255,255,255,.06);color:#a7b0c0}
.eu-dark .eu-nop-td{border-color:rgba(255,255,255,.04)}
.eu-dark .eu-nop-row:hover{background:rgba(91,155,230,.06)}
.eu-dark .eu-nop-table-wrap{border-color:rgba(255,255,255,.08)}
.eu-dark .eu-comp-card{background:rgba(15,22,36,.5);border:1px solid rgba(255,255,255,.06)}
.eu-dark .eu-env-card{border-color:rgba(255,255,255,.08);background:rgba(15,22,36,.3)}
.eu-dark .eu-env-card--pilot{border-left-color:#5b9be6}
.eu-dark .eu-env-card--preprod{border-left-color:#fbbf24}
.eu-dark .eu-env-card--prod{border-left-color:#34d399}
.eu-dark .eu-env-card-bar{background:rgba(255,255,255,.08)}
.eu-dark .eu-sla-widget{border-color:rgba(255,255,255,.08)}
.eu-dark .eu-node-card{border-color:rgba(255,255,255,.08);border-top-color:#5b9be6}
.eu-dark .eu-nop-sel{background:rgba(15,22,36,.6);border-color:rgba(255,255,255,.1);color:#eae4f4}
.eu-dark .eu-nop-search-input{background:rgba(15,22,36,.6);border-color:rgba(255,255,255,.1);color:#eae4f4}
.eu-dark .eu-nop-search-input::placeholder{color:#6b7280}
.eu-dark .eu-sla-row{border-color:rgba(255,255,255,.04)}
.eu-dark .eu-sla-section{background:rgba(15,22,36,.3);border-color:rgba(255,255,255,.06)}
.eu-dark .eu-resp-card{background:rgba(15,22,36,.4);border:1px solid rgba(255,255,255,.06)}
.eu-dark .eu-proc-badge{background:rgba(255,255,255,.08)}
.eu-dark .eu-proc-badge--critical{background:rgba(220,38,38,.15);color:#f87171}
.eu-dark .eu-proc-badge--high{background:rgba(217,119,6,.15);color:#fbbf24}

/* ── Sortable columns ── */
.eu-nop-th--sortable{cursor:pointer;user-select:none;position:relative;padding-right:22px !important;transition:color .15s}
.eu-nop-th--sortable:hover{color:var(--eu-accent,#154996)}
.eu-nop-th--sortable::after{content:"\2195";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:10px;opacity:.4}
.eu-nop-th--sortable.eu-sort-asc::after{content:"\2191";opacity:.8}
.eu-nop-th--sortable.eu-sort-desc::after{content:"\2193";opacity:.8}
.eu-dark .eu-nop-th--sortable:hover{color:#5b9be6}

/* ── Sticky tabs ── */
.eu-dash-tabs{position:sticky;top:0;z-index:50;background:var(--eu-bg-primary,#fff);padding:8px 0 0;margin-bottom:16px;border-bottom:1px solid var(--eu-border,#d1d5db)}
.eu-dark .eu-dash-tabs{background:var(--eu-bg-primary,#080c16)}
.eu-dash-tab{transition:all .2s ease;border-bottom:3px solid transparent;padding-bottom:10px;margin-bottom:-1px}
.eu-dash-tab--active{border-bottom-color:transparent;border-image:linear-gradient(90deg,#154996,#c01a85) 1;font-weight:700}

/* ── Row hover accent ── */
.eu-nop-row{transition:background .12s ease,border-color .12s ease;border-left:3px solid transparent}
.eu-nop-row:hover{border-left-color:var(--eu-accent,#154996)}

/* ── Toolbar polish ── */
.eu-nop-toolbar{position:sticky;top:44px;z-index:40;background:var(--eu-bg-primary,#fff);padding:10px 0;margin:0 -4px;padding:10px 4px;border-bottom:1px solid var(--eu-border,#d1d5db)}
.eu-dark .eu-nop-toolbar{background:var(--eu-bg-primary,#080c16)}

/* ── Filter counts polish ── */
/* Clickable count pills (button) — same look as the read-only chips
 * but with hover + active states. data-stat-target maps to the status
 * filter dropdown value. */
.eu-ct{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--eu-text-muted);padding:4px 10px;border-radius:999px;background:var(--eu-bg-secondary,#f3f4f6);border:1px solid transparent;cursor:pointer;font-family:inherit;transition:background .12s ease, border-color .12s ease}
.eu-ct:hover{background:#eaecf0}
.eu-ct.is-on{background:#fff;border-color:var(--eu-border,#d1d5db);box-shadow:0 1px 2px rgba(32,12,54,.06)}
.eu-ct-n{font-weight:700;color:var(--eu-text-primary,#200c36)}
.eu-ct--active .eu-ct-n{color:#1850b5}
.eu-ct--open .eu-ct-n{color:#e67e22}
.eu-ct--pending .eu-ct-n{color:#b91367}
.eu-ct--solved .eu-ct-n{color:#15803d}
.eu-ct.is-on.eu-ct--pending{border-color:#fbcfe8}
.eu-ct.is-on.eu-ct--open{border-color:#fed7aa}
.eu-ct.is-on.eu-ct--active{border-color:#bfdbfe}
.eu-ct.is-on.eu-ct--solved{border-color:#bbf7d0}
.eu-dark .eu-ct{background:rgba(255,255,255,.06)}
.eu-dark .eu-ct-n{color:#eae4f4}

/* ── Empty state polish ── */
.eu-nop-empty{text-align:center;padding:48px 20px;color:var(--eu-text-muted)}
.eu-nop-empty svg{opacity:.4;margin-bottom:12px}
.eu-nop-empty p{font-size:14px;margin:0}

/* ── Print ── */
@media print{
  .eu-action-summary,.eu-nop-toolbar,.eu-dash-tabs,.eu-nop-pagination,.eu-sla-env-tabs{display:none !important}
  .eu-nop-row{border-left:0 !important}
  .eu-nop-table-wrap{overflow:visible !important}
}

/* ── Smooth scroll behavior ── */
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ══════════════════════════════════════════════════════
   Branded Category Page (Node Operator Community)
   ══════════════════════════════════════════════════════ */
.eu-cat-page{min-height:100vh}
.eu-cat-hero{background:linear-gradient(135deg,#154996 0%,#4a2090 50%,#c01a85 100%);padding:48px 20px 40px;text-align:center;position:relative;overflow:hidden}
.eu-cat-hero::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.12) 0%,transparent 60%);pointer-events:none}
.eu-cat-hero__inner{position:relative;z-index:1;max-width:680px;margin:0 auto}
.eu-cat-hero__logo{display:block;margin:0 auto 16px;opacity:.9}
.eu-cat-hero__title{font-size:28px;font-weight:800;color:#fff;margin:0 0 8px;letter-spacing:.3px}
.eu-cat-hero__desc{font-size:15px;color:rgba(255,255,255,.8);margin:0;line-height:1.5;font-weight:400}
.eu-cat-breadcrumbs{padding:12px 0;font-size:12px;color:var(--eu-muted,#6b7280)}
.eu-cat-breadcrumbs a{color:var(--eu-accent,#154996);text-decoration:none}
.eu-cat-breadcrumbs a:hover{text-decoration:underline}
.eu-cat-grid{padding:8px 0 48px}
.eu-cat-section{background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#d1d5db);border-radius:12px;padding:24px;margin-bottom:20px}
.eu-cat-section__title{font-size:16px;font-weight:700;color:var(--eu-text-primary,#200c36);margin:0 0 16px;display:flex;align-items:center;gap:10px}
.eu-cat-section__title svg{color:var(--eu-accent,#154996);flex-shrink:0}
.eu-cat-section__title a{color:inherit;text-decoration:none}
.eu-cat-section__title a:hover{color:var(--eu-accent,#154996)}
.eu-cat-articles{list-style:none;padding:0;margin:0}
.eu-cat-article{border-bottom:1px solid rgba(0,0,0,.04)}
.eu-cat-article:last-child{border-bottom:0}
.eu-cat-article__link{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:8px;text-decoration:none;color:var(--eu-text-primary,#200c36);font-size:14px;font-weight:500;transition:all .15s ease}
.eu-cat-article__link:hover{background:rgba(21,73,150,.04);color:var(--eu-accent,#154996);transform:translateX(4px)}
.eu-cat-article__title{flex:1}
.eu-cat-article__arrow{color:var(--eu-accent,#154996);opacity:0;transition:opacity .15s,transform .15s;flex-shrink:0}
.eu-cat-article__link:hover .eu-cat-article__arrow{opacity:1;transform:translateX(2px)}
.eu-cat-article__badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:4px;background:linear-gradient(135deg,#154996,#c01a85);color:#fff;white-space:nowrap;flex-shrink:0}
.eu-cat-article--promoted .eu-cat-article__link{font-weight:600}
.eu-cat-more{display:inline-block;margin-top:12px;font-size:13px;font-weight:600;color:var(--eu-accent,#154996);text-decoration:none;padding:6px 14px;border:1px solid var(--eu-accent,#154996);border-radius:6px;transition:all .15s}
.eu-cat-more:hover{background:var(--eu-accent,#154996);color:#fff}

/* Dark mode */
.eu-dark .eu-cat-hero{background:linear-gradient(135deg,#0a1628 0%,#1a0e30 50%,#2d0a28 100%)}
.eu-dark .eu-cat-section{background:var(--eu-bg-card,rgba(15,22,36,.8));border-color:rgba(255,255,255,.08)}
.eu-dark .eu-cat-article__link:hover{background:rgba(91,155,230,.06)}
.eu-dark .eu-cat-article__arrow{color:#5b9be6}

/* Responsive */
@media(max-width:640px){
  .eu-cat-hero{padding:32px 16px 28px}
  .eu-cat-hero__title{font-size:22px}
  .eu-cat-section{padding:16px}
}

/* Compact hero (section pages, search, etc.) */
.eu-cat-hero--compact{padding:32px 20px 28px}
.eu-cat-hero--compact .eu-cat-hero__title{font-size:22px}
.eu-cat-hero__sub{margin-top:10px}
.eu-cat-hero__sub button,.eu-cat-hero__sub a{color:#fff !important;border-color:rgba(255,255,255,.4) !important}
.eu-cat-article__lock{color:var(--eu-muted,#6b7280);flex-shrink:0;opacity:.5}

/* Override default Zendesk list styles inside eu-cat */
.eu-cat-grid .pagination{margin:16px 0;text-align:center}

/* Search in hero */
.eu-cat-hero__search{margin-top:14px;max-width:480px;margin-left:auto;margin-right:auto}
.eu-cat-hero__search input[type="search"],.eu-cat-hero__search .search-input{background:rgba(255,255,255,.15) !important;border:1px solid rgba(255,255,255,.3) !important;border-radius:8px !important;color:#fff !important;padding:10px 14px !important;font-size:14px !important;width:100% !important}
.eu-cat-hero__search input::placeholder{color:rgba(255,255,255,.6) !important}
.eu-cat-hero__search .search-icon{color:rgba(255,255,255,.6) !important}

/* Override default container-divider for branded pages */
.eu-cat-page .container-divider{display:none}
.eu-cat-page .container{max-width:960px;margin:0 auto;padding:0 20px}

/* Search results list polish */
.eu-cat-page .search-results-list li{padding:16px;border:1px solid var(--eu-border,#e5e7eb);border-radius:10px;margin-bottom:12px;background:var(--eu-bg-card,#fff);transition:border-color .15s}
.eu-cat-page .search-results-list li:hover{border-color:var(--eu-accent,#154996)}
.eu-cat-page .search-result-title a{color:var(--eu-accent,#154996) !important;font-weight:600;text-decoration:none}
.eu-cat-page .search-result-title a:hover{text-decoration:underline}
.eu-cat-page .search-result-description{color:var(--eu-text-muted,#6b7280);font-size:13px;margin-top:6px}

/* ══════════════════════════════════════════════════════
   Confluence-style Macros for KB Articles
   Usage: add data-macro="..." attributes in article HTML
   ══════════════════════════════════════════════════════ */

/* Info/Warning/Success/Error panels */
.eu-panel-info,.eu-panel-warn,.eu-panel-success,.eu-panel-error{padding:14px 18px;border-radius:8px;margin:16px 0;font-size:13px;line-height:1.6;border-left:4px solid}
.eu-panel-info{background:#eff6ff;border-color:#154996;color:#1e3a5f}
.eu-panel-warn{background:#fffbeb;border-color:#d97706;color:#78350f}
.eu-panel-success{background:#ecfdf5;border-color:#059669;color:#064e3b}
.eu-panel-error{background:#fef2f2;border-color:#dc2626;color:#7f1d1d}
.eu-panel-info strong,.eu-panel-warn strong,.eu-panel-success strong,.eu-panel-error strong{display:block;margin-bottom:4px;font-size:14px}
.eu-dark .eu-panel-info{background:rgba(21,73,150,.1);color:#93c5fd}
.eu-dark .eu-panel-warn{background:rgba(217,119,6,.1);color:#fcd34d}
.eu-dark .eu-panel-success{background:rgba(5,150,105,.1);color:#6ee7b7}
.eu-dark .eu-panel-error{background:rgba(220,38,38,.1);color:#fca5a5}

/* Expandable/Collapse sections */
.eu-expand{border:1px solid var(--eu-border,#d1d5db);border-radius:8px;margin:12px 0;overflow:hidden}
.eu-expand__head{display:flex;align-items:center;gap:8px;padding:12px 16px;cursor:pointer;font-weight:600;font-size:14px;color:var(--eu-text-primary,#200c36);background:var(--eu-bg-secondary,#f9fafb);transition:background .15s;user-select:none}
.eu-expand__head:hover{background:rgba(21,73,150,.04)}
.eu-expand__head::before{content:"\25B6";font-size:10px;transition:transform .2s;color:var(--eu-accent,#154996)}
.eu-expand--open .eu-expand__head::before{transform:rotate(90deg)}
.eu-expand__body{display:none;padding:14px 16px;font-size:13px;line-height:1.6;border-top:1px solid var(--eu-border,#d1d5db)}
.eu-expand--open .eu-expand__body{display:block}

/* Status badges */
.eu-status{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.3px}
.eu-status--green{background:#ecfdf5;color:#059669}
.eu-status--yellow{background:#fffbeb;color:#d97706}
.eu-status--red{background:#fef2f2;color:#dc2626}
.eu-status--blue{background:#eff6ff;color:#154996}
.eu-status--grey{background:#f3f4f6;color:#6b7280}
.eu-status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}

/* Navigation cards grid (for home pages) */
.eu-nav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin:20px 0}
.eu-nav-card{display:flex;flex-direction:column;padding:20px;border:1px solid var(--eu-border,#d1d5db);border-radius:10px;text-decoration:none;color:var(--eu-text-primary,#200c36);background:var(--eu-bg-card,#fff);transition:all .2s ease}
.eu-nav-card:hover{border-color:var(--eu-accent,#154996);transform:translateY(-3px);box-shadow:0 8px 24px rgba(21,73,150,.1)}
.eu-nav-card__icon{font-size:28px;margin-bottom:10px}
.eu-nav-card__title{font-size:15px;font-weight:700;margin-bottom:6px;color:var(--eu-accent,#154996)}
.eu-nav-card__desc{font-size:12px;color:var(--eu-muted,#6b7280);line-height:1.5;flex:1}
.eu-nav-card__arrow{align-self:flex-end;margin-top:12px;color:var(--eu-accent,#154996);opacity:0;transition:opacity .2s,transform .2s}
.eu-nav-card:hover .eu-nav-card__arrow{opacity:1;transform:translateX(4px)}
.eu-dark .eu-nav-card{background:var(--eu-bg-card,rgba(15,22,36,.8));border-color:rgba(255,255,255,.08)}
.eu-dark .eu-nav-card:hover{border-color:#5b9be6;box-shadow:0 8px 24px rgba(91,155,230,.1)}
.eu-dark .eu-nav-card__title{color:#5b9be6}

/* Table of contents */
.eu-toc{background:var(--eu-bg-secondary,#f9fafb);border:1px solid var(--eu-border,#d1d5db);border-radius:10px;padding:16px 20px;margin:20px 0}
.eu-toc__title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--eu-muted,#6b7280);margin:0 0 10px}
.eu-toc__list{list-style:none;padding:0;margin:0;columns:2;column-gap:20px}
.eu-toc__list li{break-inside:avoid;margin-bottom:6px}
.eu-toc__list a{color:var(--eu-accent,#154996);text-decoration:none;font-size:13px;font-weight:500}
.eu-toc__list a:hover{text-decoration:underline}

/* Quick stats row */
.eu-stats-row{display:flex;gap:12px;margin:20px 0;flex-wrap:wrap}
.eu-stat{flex:1;min-width:120px;text-align:center;padding:16px 12px;background:var(--eu-bg-secondary,#f9fafb);border:1px solid var(--eu-border,#d1d5db);border-radius:10px}
.eu-stat__n{font-size:28px;font-weight:800;color:var(--eu-accent,#154996);line-height:1}
.eu-stat__label{font-size:11px;font-weight:600;text-transform:uppercase;color:var(--eu-muted,#6b7280);margin-top:4px}

/* Responsive */
@media(max-width:640px){
  .eu-nav-grid{grid-template-columns:1fr}
  .eu-toc__list{columns:1}
  .eu-stats-row{flex-direction:column}
}

/* ══════════════════════════════════════════════════════
   Branded Article Page
   ══════════════════════════════════════════════════════ */
.eu-art-hero{background:linear-gradient(135deg,#154996 0%,#4a2090 50%,#c01a85 100%);padding:28px 20px 24px;position:relative;overflow:hidden}
.eu-art-hero::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.1) 0%,transparent 60%);pointer-events:none}
.eu-art-hero__inner{position:relative;z-index:1;max-width:900px;margin:0 auto}
.eu-art-hero__breadcrumbs{margin-bottom:10px;font-size:12px}
.eu-art-hero__breadcrumbs,.eu-art-hero__breadcrumbs a{color:rgba(255,255,255,.7) !important;text-decoration:none}
.eu-art-hero__breadcrumbs a:hover{color:#fff !important;text-decoration:underline}
.eu-art-hero__breadcrumbs li::before{color:rgba(255,255,255,.4) !important}
.eu-art-hero__title{font-size:24px;font-weight:800;color:#fff;margin:0 0 10px;line-height:1.25}
.eu-art-hero__meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.7)}
.eu-art-hero__author{font-weight:600;color:rgba(255,255,255,.9)}
.eu-art-hero__follow button,.eu-art-hero__follow a{background:rgba(0,0,0,.35) !important;color:#fff !important;border:1px solid rgba(255,255,255,.85) !important;font-size:11px !important;font-weight:600 !important;padding:4px 14px !important;border-radius:999px !important;backdrop-filter:blur(2px)}
.eu-art-hero__follow button:hover,.eu-art-hero__follow button:focus,.eu-art-hero__follow a:hover,.eu-art-hero__follow a:focus{background:#fff !important;color:#200c36 !important;border-color:#fff !important}
.eu-art-hero__follow button[data-selected=true]{background:#fff !important;color:#200c36 !important;border-color:#fff !important}
.eu-art-hero__follow button[data-selected=true]::after{border-left-color:rgba(32,12,54,.3) !important;color:#200c36 !important}

/* Two-column layout */
.eu-art-layout{display:flex;gap:28px;padding:24px 0 48px;align-items:flex-start}
.eu-art-sidebar{width:240px;flex-shrink:0;position:sticky;top:60px}
.eu-art-main{flex:1;min-width:0}

.eu-art-sidebar__inner{background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#d1d5db);border-radius:10px;padding:16px;overflow:hidden}
.eu-art-sidebar__title{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--eu-muted,#6b7280);margin-bottom:12px}
.eu-art-sidebar__title svg{color:var(--eu-accent,#154996);flex-shrink:0}
.eu-art-sidebar__list{list-style:none;padding:0;margin:0}
.eu-art-sidebar__list li{margin-bottom:2px}
.eu-art-sidebar__link{display:block;padding:8px 10px;border-radius:6px;font-size:13px;font-weight:500;color:var(--eu-text-primary,#200c36);text-decoration:none;transition:all .12s;border-left:3px solid transparent}
.eu-art-sidebar__link:hover{background:rgba(21,73,150,.04);color:var(--eu-accent,#154996)}
.eu-art-sidebar__link--active{background:rgba(21,73,150,.08);color:var(--eu-accent,#154996);font-weight:600;border-left-color:var(--eu-accent,#154996)}
.eu-art-sidebar__more{display:block;padding:8px 10px;font-size:12px;font-weight:600;color:var(--eu-accent,#154996);text-decoration:none;margin-top:8px;border-top:1px solid var(--eu-border,#d1d5db);padding-top:10px}
.eu-art-sidebar__more:hover{text-decoration:underline}

/* Article body polish */
.eu-art-main .article-body{font-size:14px;line-height:1.7;color:var(--eu-text-primary,#200c36)}
.eu-art-main .article-body h2{font-size:20px;font-weight:700;margin:28px 0 12px;padding-bottom:8px;border-bottom:2px solid var(--eu-accent,#154996);color:var(--eu-text-primary,#200c36)}
.eu-art-main .article-body h3{font-size:16px;font-weight:700;margin:20px 0 8px;color:var(--eu-text-primary,#200c36)}
.eu-art-main .article-body table{width:100%;border-collapse:collapse;margin:16px 0;font-size:13px}
.eu-art-main .article-body table thead th{background:linear-gradient(135deg,#154996,#1e5bb8);color:#fff;padding:10px 14px;text-align:left;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}
.eu-art-main .article-body table td{padding:10px 14px;border-bottom:1px solid var(--eu-border,#e5e7eb)}
.eu-art-main .article-body table tr:hover td{background:rgba(21,73,150,.02)}
.eu-art-main .article-body blockquote{border-left:4px solid var(--eu-accent,#154996);padding:12px 16px;margin:16px 0;background:rgba(21,73,150,.03);border-radius:0 8px 8px 0;font-style:italic}
.eu-art-main .article-body code{background:rgba(21,73,150,.06);padding:2px 6px;border-radius:4px;font-size:12px;color:#c01a85}
.eu-art-main .article-body pre{background:var(--eu-bg-secondary,#f3f4f6);border:1px solid var(--eu-border,#d1d5db);border-radius:8px;padding:14px;overflow-x:auto;font-size:12px}
.eu-art-main .article-body a{color:var(--eu-accent,#154996);font-weight:500}
.eu-art-main .article-body ul,.eu-art-main .article-body ol{padding-left:20px}
.eu-art-main .article-body li{margin-bottom:6px}

/* Dark mode */
.eu-dark .eu-art-hero{background:linear-gradient(135deg,#0a1628 0%,#1a0e30 50%,#2d0a28 100%)}
.eu-dark .eu-art-sidebar__inner{background:var(--eu-bg-card,rgba(15,22,36,.8));border-color:rgba(255,255,255,.08)}
.eu-dark .eu-art-sidebar__link:hover{background:rgba(91,155,230,.06)}
.eu-dark .eu-art-sidebar__link--active{background:rgba(91,155,230,.1);color:#5b9be6;border-left-color:#5b9be6}
.eu-dark .eu-art-main .article-body h2{border-bottom-color:#5b9be6}
.eu-dark .eu-art-main .article-body table thead th{background:linear-gradient(135deg,#1a2744,#2a1a44)}
.eu-dark .eu-art-main .article-body code{background:rgba(91,155,230,.1);color:#e84aad}

/* Responsive */
@media(max-width:860px){
  .eu-art-layout{flex-direction:column}
  .eu-art-sidebar{width:100%;position:static}
  .eu-art-hero__title{font-size:20px}
}

/* Force 2-column grid for nav cards inside article body (Zendesk strips inline grid) */
.eu-art-main .article-body > div[style*="grid"] {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 14px !important;
}
.eu-art-main .article-body > div[style*="grid"] > a {
  border: 1px solid var(--eu-border, #d1d5db);
  border-radius: 10px;
  transition: all .2s ease;
}
.eu-art-main .article-body > div[style*="grid"] > a:hover {
  border-color: var(--eu-accent, #154996);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(21,73,150,.1);
}
/* Stats row flex */
.eu-art-main .article-body > div[style*="flex"] {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
/* Details/summary (expandable sections) */
.eu-art-main .article-body details {
  border: 1px solid var(--eu-border, #d1d5db);
  border-radius: 8px;
  margin-bottom: 8px;
  overflow: hidden;
}
.eu-art-main .article-body details summary {
  padding: 12px 16px;
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
  background: var(--eu-bg-secondary, #f9fafb);
  color: var(--eu-text-primary, #200c36);
  transition: background .15s;
  list-style: none;
}
.eu-art-main .article-body details summary::-webkit-details-marker { display: none; }
.eu-art-main .article-body details summary::before {
  content: "\25B6";
  display: inline-block;
  margin-right: 8px;
  font-size: 10px;
  color: var(--eu-accent, #154996);
  transition: transform .2s;
}
.eu-art-main .article-body details[open] summary::before {
  transform: rotate(90deg);
}
.eu-art-main .article-body details summary:hover {
  background: rgba(21,73,150,.04);
}
.eu-art-main .article-body details > div {
  padding: 14px 16px;
  font-size: 13px;
  line-height: 1.6;
  border-top: 1px solid var(--eu-border, #d1d5db);
}
/* Dark mode for details */
.eu-dark .eu-art-main .article-body details {
  border-color: rgba(255,255,255,.08);
}
.eu-dark .eu-art-main .article-body details summary {
  background: rgba(15,22,36,.4);
}
.eu-dark .eu-art-main .article-body details > div {
  border-color: rgba(255,255,255,.06);
}
@media(max-width:640px) {
  .eu-art-main .article-body > div[style*="grid"] {
    grid-template-columns: 1fr !important;
  }
}

/* ── Node Health Cards (NO dashboard) ── */
.eu-node-health{background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#d1d5db);border-radius:12px;padding:20px;margin-bottom:20px}
.eu-node-health__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.eu-nh-card{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--eu-border,#d1d5db);border-radius:8px;background:var(--eu-bg-secondary,#f9fafb);transition:all .15s}
.eu-nh-card:hover{border-color:var(--eu-accent,#154996);background:rgba(21,73,150,.03);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.06)}
.eu-nh-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:3px}
.eu-nh-dot--active{background:#059669}
.eu-nh-dot--offline{background:#dc2626}
.eu-nh-dot--suspended{background:#d97706}
.eu-nh-dot--installation{background:#6366f1}
.eu-nh-dot--opted_out{background:#9ca3af}
.eu-nh-body{flex:1;min-width:0}
.eu-nh-host{font-size:12px;font-weight:700;color:var(--eu-text-primary,#200c36);word-break:break-all;margin-bottom:4px}
.eu-nh-badges{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:4px}
.eu-nh-badge{font-size:9px;font-weight:700;padding:2px 7px;border-radius:999px;text-transform:uppercase;letter-spacing:.3px}
.eu-nh-badge--pilot{background:#eff6ff;color:#154996}
.eu-nh-badge--preprod{background:#fffbeb;color:#d97706}
.eu-nh-badge--prod{background:#ecfdf5;color:#059669}
.eu-nh-badge--type{background:#f3f4f6;color:#6b7280}
.eu-nh-meta{font-size:10px;color:var(--eu-text-muted,#6b7280);line-height:1.4}
.eu-dark .eu-nh-card{background:rgba(15,22,36,.4);border-color:rgba(255,255,255,.06)}
.eu-dark .eu-nh-card:hover{border-color:#5b9be6;background:rgba(91,155,230,.06)}
.eu-dark .eu-nh-badge--pilot{background:rgba(91,155,230,.15);color:#5b9be6}
.eu-dark .eu-nh-badge--preprod{background:rgba(251,191,36,.15);color:#fbbf24}
.eu-dark .eu-nh-badge--prod{background:rgba(52,211,153,.15);color:#34d399}
@media(max-width:640px){.eu-node-health__grid{grid-template-columns:1fr}}

/* Fix action card icons (SVG instead of emoji) */
.eu-action-card__icon svg{display:block;margin:0 auto}
.eu-action-card--urgent .eu-action-card__icon svg{stroke:#dc2626}
.eu-action-card--warn .eu-action-card__icon svg{stroke:#d97706}
.eu-action-card--info .eu-action-card__icon svg{stroke:#2563eb}
.eu-dark .eu-action-card--urgent .eu-action-card__icon svg{stroke:#f87171}
.eu-dark .eu-action-card--warn .eu-action-card__icon svg{stroke:#fbbf24}
.eu-dark .eu-action-card--info .eu-action-card__icon svg{stroke:#60a5fa}

/* Streamline: tighter spacing between sections */
.eu-node-health,.eu-sla-widget,.eu-sla-compliance{margin-bottom:14px}
.eu-action-summary{margin-bottom:14px}

/* ── Full-width Node Ops panel ── */
#panel-node-ops{max-width:100%;padding:0 24px}
#panel-node-ops .eu-node-card,
#panel-node-ops .eu-action-summary,
#panel-node-ops .eu-node-health,
#panel-node-ops .eu-sla-widget,
#panel-node-ops .eu-sla-compliance,
#panel-node-ops .eu-nop-toolbar,
#panel-node-ops .eu-nop-table-wrap,
#panel-node-ops .eu-nop-pagination,
#panel-node-ops .eu-nop-empty{max-width:100%}

/* Expand the container for requests page */
.my-activities-header,.eu-dash-tabs{max-width:100%;padding-left:24px;padding-right:24px}

/* Make the overall container wider on the requests page */
body .container{max-width:1280px}

/* Node health grid: 3 cards per row minimum */
.eu-node-health__grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}

/* Wider table columns */
.eu-nop-td--subject{max-width:400px}
.eu-nop-table{table-layout:auto}

/* Env breakdown: horizontal layout */
.eu-env-breakdown{display:flex;gap:10px;flex-wrap:wrap}
.eu-env-breakdown .eu-env-card{flex:1;min-width:200px}

/* Compliance grid: wider cards */
.eu-compliance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}

/* Action summary: equal width cards */
.eu-action-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

/* SLA dual grid: wider */
.eu-sla-dual-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}

@media(max-width:768px){
  body .container{max-width:100%;padding:0 12px}
  #panel-node-ops{padding:0 12px}
  .eu-action-summary{grid-template-columns:1fr}
  .eu-compliance-grid{grid-template-columns:repeat(2,1fr)}
}

/* Smooth dark mode transitions */
html,body{transition:background-color .3s ease,color .3s ease}
.eu-node-card,.eu-sla-widget,.eu-sla-compliance,.eu-nop-table-wrap,.eu-node-health,.eu-action-card,.eu-comp-card,.eu-env-card,.eu-cat-section,.eu-art-sidebar__inner,.eu-req-context{transition:background-color .3s ease,border-color .3s ease,color .3s ease}
.eu-nop-th,.eu-nop-td,.eu-nop-sel,.eu-nop-search-input{transition:background-color .3s ease,border-color .3s ease,color .3s ease}
.eu-theme-toggle{transition:all .25s cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){
  html,body,.eu-node-card,.eu-sla-widget,.eu-sla-compliance,.eu-nop-table-wrap,.eu-node-health,.eu-action-card,.eu-comp-card,.eu-env-card,.eu-cat-section,.eu-art-sidebar__inner,.eu-req-context,.eu-nop-th,.eu-nop-td,.eu-nop-sel,.eu-nop-search-input{transition:none}
}

/* Fix: white text on blue background buttons in article body (Zendesk overrides inline color) */
.eu-art-main .article-body a[style*="background:#154996"],
.eu-art-main .article-body a[style*="background: #154996"],
.article-body a[style*="background:#154996"],
.article-body a[style*="background: #154996"]{
  color:#fff !important;
  text-decoration:none !important;
  display:inline-block !important;
  padding:6px 14px !important;
  border-radius:5px !important;
  font-size:11px !important;
  font-weight:600 !important;
}
.eu-art-main .article-body a[style*="background:#154996"]:hover,
.article-body a[style*="background:#154996"]:hover{
  opacity:.85;
}

/* ════════════════════════════════════════════════════════════
   Form UX upgrades — appended for v4.39.0
   ════════════════════════════════════════════════════════════ */

/* Required indicator → "REQUIRED" pill instead of stock asterisk */
.eu-form-container .form-field label .required,
.eu-form-container .form-field .required-hint,
#new-request-form label .required,
#new-request-form .required-hint{
  display:inline-block !important;
  font-size:9px !important;
  font-weight:700 !important;
  letter-spacing:0.05em !important;
  text-transform:uppercase !important;
  color:#fff !important;
  background:#c01a85 !important;
  padding:2px 7px !important;
  border-radius:10px !important;
  margin-left:8px !important;
  vertical-align:middle !important;
  line-height:1.3 !important;
}
/* Hide the stock asterisk character if present alongside the pill */
.eu-form-container .form-field label .required::before,
#new-request-form .required::before{
  content:"REQUIRED";
}
.eu-form-container .form-field label .required > *,
#new-request-form .required > *{
  display:none;
}

/* Brand-coloured invalid state */
.eu-form-container [aria-invalid="true"],
.eu-form-container input[aria-invalid="true"],
.eu-form-container textarea[aria-invalid="true"],
.eu-form-container select[aria-invalid="true"],
.eu-form-container .nesty-input[aria-invalid="true"],
#new-request-form [aria-invalid="true"]{
  border-color:#c01a85 !important;
  box-shadow:0 0 0 3px rgba(192,26,133,0.12) !important;
  outline:none !important;
}
.eu-form-container [data-garden-id="forms.message"],
.eu-form-container [data-garden-id*="forms.field-message"],
#new-request-form [role="alert"]{
  color:#c01a85 !important;
  font-size:13px !important;
  font-weight:500 !important;
  margin-top:6px !important;
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
}
.eu-form-container [data-garden-id*="forms.field-message"]::before,
#new-request-form [role="alert"]::before{
  content:"⚠";
  display:inline-block;
  font-size:14px;
}

/* Stronger focus ring (brand blue glow) */
.eu-form-container input:focus,
.eu-form-container textarea:focus,
.eu-form-container select:focus,
.eu-form-container .nesty-input:focus,
.eu-form-container .hc-multiselect-toggle:focus,
#new-request-form input:focus,
#new-request-form textarea:focus,
#new-request-form select:focus{
  border-color:#154996 !important;
  box-shadow:0 0 0 3px rgba(21,73,150,0.18) !important;
  outline:none !important;
}

/* Field description (the field.description from API) */
.eu-form-container .form-field p,
.eu-form-container .form-field .hint,
#new-request-form .form-field p,
#new-request-form .form-field .hint{
  color:#5a6877 !important;
  font-size:12.5px !important;
  line-height:1.45 !important;
  margin:4px 0 8px !important;
  font-style:normal;
}

/* Section group headers — injected by JS */
.eu-form-section-header{
  display:flex;
  align-items:center;
  gap:8px;
  margin:24px 0 12px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(21,73,150,0.10);
  font-size:11px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--eu-accent, #154996);
}
.eu-form-section-header::before{
  content:"";
  display:inline-block;
  width:14px;
  height:2px;
  background:currentColor;
  border-radius:2px;
  flex-shrink:0;
}
.eu-form-section-header:first-of-type{margin-top:8px}

/* Optional badge for clarity */
.eu-form-container .form-field label .optional,
#new-request-form .optional{
  display:inline-block !important;
  font-size:9px !important;
  font-weight:600 !important;
  letter-spacing:0.04em !important;
  text-transform:uppercase !important;
  color:#5a6877 !important;
  background:rgba(90,104,119,0.08) !important;
  padding:2px 7px !important;
  border-radius:10px !important;
  margin-left:8px !important;
  vertical-align:middle !important;
  line-height:1.3 !important;
}

/* Responsive */
@media(max-width:640px){
  .eu-form-section-header{font-size:10px}
}

/* ============================================================
 * DESIGN TOKEN ADDITIONS (Europeum v2 hand-off, 2026-05-04)
 * Type scale, spacing scale, motion. Additive only.
 * ============================================================ */
:root {
  --eu-fs-display: 56px; --eu-lh-display: 1.05;
  --eu-fs-h1:      40px; --eu-lh-h1:      1.10;
  --eu-fs-h2:      28px; --eu-lh-h2:      1.20;
  --eu-fs-h3:      20px; --eu-lh-h3:      1.30;
  --eu-fs-body:    16px; --eu-lh-body:    1.65;
  --eu-fs-ui:      14px; --eu-lh-ui:      1.45;
  --eu-fs-meta:    13px; --eu-lh-meta:    1.40;
  --eu-fs-caption: 11px; --eu-lh-caption: 1.30;

  --eu-s-1:  4px;
  --eu-s-2:  8px;
  --eu-s-3:  12px;
  --eu-s-4:  16px;
  --eu-s-6:  24px;
  --eu-s-8:  32px;
  --eu-s-12: 48px;
  --eu-s-16: 64px;
  --eu-s-20: 80px;

  --eu-ease:     cubic-bezier(0.20, 0.80, 0.20, 1.00);
  --eu-ease-out: cubic-bezier(0.16, 1.00, 0.30, 1.00);
  --eu-dur-fast: 120ms;
  --eu-dur:      180ms;
  --eu-dur-slow: 320ms;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================
 * Europeum v2 design hand-off — HOME page styles (2026-05-04)
 * ============================================================ */
/* ============================================================
   HOME — branded moment
   ============================================================ */
.t-home{position:relative}

.t-hero{
  position:relative;
  padding:var(--eu-s-20) var(--eu-s-8) var(--eu-s-16);
  overflow:hidden;
  background:var(--eu-bg-primary);
}
/* Atmospheric radial gradient, top-right */
.t-hero::before{
  content:'';position:absolute;inset:-40% -10% auto auto;width:80%;height:140%;
  background:radial-gradient(ellipse at 70% 30%,
    rgba(192,26,133,0.10) 0%,
    rgba(74,32,144,0.08) 30%,
    rgba(21,73,150,0.05) 50%,
    transparent 70%);
  pointer-events:none;
  animation:hue-drift 18s var(--eu-ease) infinite alternate;
}
.eu-dark .t-hero::before{
  background:radial-gradient(ellipse at 70% 30%,
    rgba(232,74,173,0.18) 0%,
    rgba(147,88,176,0.14) 30%,
    rgba(91,155,230,0.10) 50%,
    transparent 70%);
}
@keyframes hue-drift{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(-3%,2%) scale(1.05)}
}
/* Bottom fade to bg */
.t-hero::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:96px;
  background:linear-gradient(to top,var(--eu-bg-primary),transparent);
  pointer-events:none;
}
.t-hero__cubes{
  position:absolute;
  right:-40px;top:50%;
  transform:translateY(-50%);
  width:480px;height:380px;
  opacity:0.08;
  pointer-events:none;
}
.eu-dark .t-hero__cubes{opacity:0.14}
.t-hero__cubes svg{width:100%;height:100%;display:block}
.t-hero__cubes .cube{transform-origin:center; transform-box:fill-box; animation:cube-drift 12s ease-in-out infinite}
.t-hero__cubes .cube:nth-child(1){animation-delay:0s}
.t-hero__cubes .cube:nth-child(2){animation-delay:-1.5s}
.t-hero__cubes .cube:nth-child(3){animation-delay:-3s}
.t-hero__cubes .cube:nth-child(4){animation-delay:-4.5s}
.t-hero__cubes .cube:nth-child(5){animation-delay:-6s}
.t-hero__cubes .cube:nth-child(6){animation-delay:-7.5s}
@keyframes cube-drift{
  0%,100%{transform:translateY(0); opacity:1}
  50%{transform:translateY(-3px); opacity:0.7}
}

.t-hero__inner{position:relative;max-width:1180px;margin:0 auto;z-index:2}
.t-hero__eyebrow{
  font-size:var(--eu-fs-caption);
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  background:var(--eu-gradient-accent);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  margin-bottom:var(--eu-s-4);
  display:inline-block;
}
.t-hero__title{
  font-size:var(--eu-fs-display) !important;
  line-height:var(--eu-lh-display);
  font-weight:800;
  letter-spacing:-0.025em;
  margin:0 0 var(--eu-s-4) !important;
  max-width:14ch;
}
.t-hero__sub{
  font-size:var(--eu-fs-h3);
  line-height:var(--eu-lh-h3);
  color:var(--eu-text-secondary);
  max-width:56ch;
  margin:0 0 var(--eu-s-8) !important;
  font-weight:400;
}
.t-search{
  position:relative;max-width:720px;
}
.t-search input{
  width:100%;height:56px;
  padding:0 92px 0 52px;
  border-radius:var(--eu-radius);
  border:1px solid var(--eu-border);
  background:var(--eu-input-bg);
  color:var(--eu-text-primary);
  font-size:15px;font-family:inherit;
  box-shadow:0 4px 20px rgba(21,73,150,0.06),0 1px 2px rgba(32,12,54,0.06);
  transition:all var(--eu-dur) var(--eu-ease);
}
.t-search input:focus{
  outline:none;
  border-color:var(--eu-accent);
  box-shadow:0 0 0 3px rgba(21,73,150,0.15),0 4px 20px rgba(21,73,150,0.10);
}
.t-search input::placeholder{color:var(--eu-text-muted)}
.t-search__icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--eu-text-muted)}
.t-search__kbd{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);
  font-family:'JetBrains Mono',monospace;
  font-size:11px;font-weight:600;
  padding:4px 8px;border-radius:6px;
  background:var(--eu-bg-tertiary);
  border:1px solid var(--eu-border);
  color:var(--eu-text-muted);
}
.t-chips{display:flex;gap:var(--eu-s-2);margin-top:var(--eu-s-4);flex-wrap:wrap}
.t-chip{
  display:inline-block;
  font-size:var(--eu-fs-meta);
  font-weight:500;
  padding:6px 14px;
  border-radius:20px;
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  color:var(--eu-text-secondary);
  text-decoration:none;
  transition:all var(--eu-dur) var(--eu-ease);
  cursor:pointer;
}
.t-chip:hover{border-color:var(--eu-border-accent);color:var(--eu-accent);text-decoration:none;transform:translateY(-1px)}
.t-chip:focus-visible{outline:2px solid var(--eu-accent);outline-offset:2px}

/* Main content area */
.t-main{
  position:relative;
  max-width:1180px;
  margin:0 auto;
  padding:var(--eu-s-8) var(--eu-s-8) var(--eu-s-12);
}

/* Action cards: primary + secondary */
.t-actions{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:var(--eu-s-4);
  margin-bottom:var(--eu-s-12);
}
.t-action{
  position:relative;
  display:flex;flex-direction:column;
  padding:var(--eu-s-6);
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);
  box-shadow:var(--eu-shadow);
  transition:transform var(--eu-dur) var(--eu-ease-out), box-shadow var(--eu-dur) var(--eu-ease-out), border-color var(--eu-dur) var(--eu-ease-out);
  overflow:hidden;
  min-height:140px;
}
.t-action:hover{transform:translateY(-2px);box-shadow:var(--eu-shadow-hover);border-color:var(--eu-border-accent)}
.t-action--primary{
  background:linear-gradient(135deg,rgba(21,73,150,0.04),rgba(192,26,133,0.04));
}
.eu-dark .t-action--primary{
  background:linear-gradient(135deg,rgba(91,155,230,0.08),rgba(232,74,173,0.06));
}
.t-action--primary::before{
  content:'';position:absolute;inset:0;
  border-radius:var(--eu-radius-lg);
  padding:1px;
  background:var(--eu-gradient-accent);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;
}
.t-action__icon{
  width:44px;height:44px;
  border-radius:12px;
  display:grid;place-items:center;
  background:rgba(21,73,150,0.08);
  color:var(--eu-accent);
  margin-bottom:var(--eu-s-4);
}
.eu-dark .t-action__icon{background:rgba(91,155,230,0.12)}
.t-action--primary .t-action__icon{
  background:var(--eu-gradient-accent);
  color:#fff;
  box-shadow:0 4px 12px rgba(21,73,150,0.25);
}
.t-action--ops{box-shadow:inset 3px 0 var(--eu-magenta), var(--eu-shadow)}
.t-action--ops .t-action__icon{background:rgba(192,26,133,0.08);color:var(--eu-magenta)}
.eu-dark .t-action--ops .t-action__icon{background:rgba(232,74,173,0.12)}
.t-action__title{
  font-size:var(--eu-fs-h3);
  font-weight:700;
  margin-bottom:var(--eu-s-1);
}
.t-action__desc{
  font-size:var(--eu-fs-meta);
  color:var(--eu-text-muted);
  flex:1;
  line-height:1.5;
}
.t-action__arrow{
  position:absolute;top:var(--eu-s-6);right:var(--eu-s-6);
  color:var(--eu-text-muted);
  transition:transform var(--eu-dur) var(--eu-ease-out), color var(--eu-dur) var(--eu-ease-out);
}
.t-action:hover .t-action__arrow{transform:translateX(4px);color:var(--eu-accent)}

/* Section header pattern */
.t-sect-hdr{
  display:flex;align-items:flex-end;justify-content:space-between;gap:var(--eu-s-6);
  margin-bottom:var(--eu-s-6);
  padding-bottom:var(--eu-s-3);
  border-bottom:1px solid var(--eu-border);
}
.t-sect-hdr__title{
  font-size:var(--eu-fs-h2);
  font-weight:700;
  margin:0 0 var(--eu-s-1);
  letter-spacing:-0.015em;
}
.t-sect-hdr__sub{
  font-size:var(--eu-fs-meta);
  color:var(--eu-text-muted);
  margin:0;
}
.t-sect-hdr__link{
  font-size:var(--eu-fs-meta);
  font-weight:600;
  color:var(--eu-accent-light);
  display:inline-flex;align-items:center;gap:4px;
  white-space:nowrap;
}

/* KB grid */
.t-kb{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--eu-s-4);margin-bottom:var(--eu-s-12)}
.t-kb__card{
  position:relative;
  padding:var(--eu-s-6);
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);
  box-shadow:var(--eu-shadow);
  transition:all var(--eu-dur) var(--eu-ease-out);
  display:flex;flex-direction:column;
  gap:var(--eu-s-3);
  overflow:hidden;
}
.t-kb__card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(91,155,230,0.06) 50%,transparent 70%);
  background-size:200% 100%;background-position:200% 0;
  transition:background-position 700ms var(--eu-ease-out);
  pointer-events:none;border-radius:inherit;
}
.t-kb__card:hover{transform:translateY(-3px);box-shadow:var(--eu-shadow-hover);border-color:var(--eu-border-accent)}
.t-kb__card:hover::before{background-position:-100% 0}
.t-kb__icon{
  width:40px;height:40px;border-radius:10px;
  background:rgba(21,73,150,0.08);
  color:var(--eu-accent);
  display:grid;place-items:center;
}
.eu-dark .t-kb__icon{background:rgba(91,155,230,0.12)}
.t-kb__name{font-size:var(--eu-fs-h3);font-weight:700;margin:0;letter-spacing:-0.01em}
.t-kb__desc{
  font-size:var(--eu-fs-meta);
  color:var(--eu-text-muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
  margin:0;
}
.t-kb__meta{
  display:flex;align-items:center;gap:var(--eu-s-2);
  margin-top:auto;padding-top:var(--eu-s-2);
  font-size:var(--eu-fs-caption);font-weight:600;
  color:var(--eu-text-muted);
  text-transform:uppercase;letter-spacing:0.06em;
}
.t-kb__meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:0.5}

/* Popular articles — numbered list */
.t-pop{margin-bottom:var(--eu-s-12)}
.t-pop__grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--eu-border);border-radius:var(--eu-radius-lg);overflow:hidden;background:var(--eu-bg-card)}
.t-pop__item{
  display:flex;align-items:center;gap:var(--eu-s-4);
  padding:var(--eu-s-4) var(--eu-s-6);
  border-bottom:1px solid var(--eu-border);
  transition:background var(--eu-dur) var(--eu-ease);
}
.t-pop__item:nth-child(2n){border-left:1px solid var(--eu-border)}
.t-pop__item:nth-last-child(-n+2){border-bottom:none}
.t-pop__item:hover{background:var(--eu-bg-hover)}
.t-pop__num{
  font-size:24px;font-weight:800;
  font-variant-numeric:tabular-nums;
  background:var(--eu-gradient-accent);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  min-width:36px;
}
.t-pop__title{
  flex:1;font-size:var(--eu-fs-ui);font-weight:500;
  color:var(--eu-text-primary);
  line-height:1.4;
}
.t-pop__badge{
  font-size:10px;font-weight:700;letter-spacing:0.06em;
  padding:3px 8px;border-radius:6px;
  background:rgba(192,26,133,0.1);color:var(--eu-magenta);
  text-transform:uppercase;
}
.t-pop__arrow{color:var(--eu-text-muted);transition:transform var(--eu-dur) var(--eu-ease-out)}
.t-pop__item:hover .t-pop__arrow{transform:translateX(3px);color:var(--eu-accent)}

/* Community CTA */
.t-comm-cta{
  position:relative;overflow:hidden;
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);
  padding:var(--eu-s-8);
  display:flex;align-items:center;gap:var(--eu-s-6);
  box-shadow:var(--eu-shadow);
}
.t-comm-cta__decor{
  position:absolute;right:-20px;top:50%;transform:translateY(-50%);
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  width:280px;
  opacity:0.16;
  pointer-events:none;
}
.eu-dark .t-comm-cta__decor{opacity:0.22}
.t-comm-cta__decor svg{width:54px;height:54px}
.t-comm-cta__body{flex:1;position:relative;z-index:1;max-width:60%}
.t-comm-cta__title{font-size:var(--eu-fs-h2);font-weight:700;margin:0 0 var(--eu-s-2);letter-spacing:-0.015em}
.t-comm-cta__sub{font-size:var(--eu-fs-meta);color:var(--eu-text-secondary);margin:0;max-width:42ch}
.t-comm-cta__btn{
  background:var(--eu-gradient-accent);
  color:#fff !important;
  padding:12px 22px;
  border-radius:var(--eu-radius);
  font-weight:600;
  display:inline-flex;align-items:center;gap:8px;
  box-shadow:0 4px 16px rgba(21,73,150,0.25);
  position:relative;z-index:1;
  transition:transform var(--eu-dur) var(--eu-ease-out);
}
.t-comm-cta__btn:hover{transform:translateY(-1px)}

/* ============================================================
 * Europeum v2 design hand-off — ARTICLE page styles (2026-05-04)
 * Forward-looking .t-art-* classes; activate when article_page.hbs
 * is restructured. Existing .eu-art-* selectors continue to work
 * and pick up the new design tokens automatically.
 * ============================================================ */
/* ============================================================
   ARTICLE PAGE
   ============================================================ */
.t-art-hero{
  position:relative;
  padding:var(--eu-s-12) var(--eu-s-8) var(--eu-s-8);
  background:var(--eu-bg-secondary);
  border-bottom:1px solid var(--eu-border);
  overflow:hidden;
}
.t-art-hero::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 100% 0%,
    rgba(192,26,133,0.06),transparent 50%);
  pointer-events:none;
}
.eu-dark .t-art-hero::before{background:radial-gradient(ellipse at 100% 0%,rgba(232,74,173,0.10),transparent 50%)}
.t-art-hero__inner{position:relative;max-width:1180px;margin:0 auto}
.t-bc{
  font-size:var(--eu-fs-caption);
  font-weight:600;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--eu-text-muted);
  margin-bottom:var(--eu-s-4);
  display:flex;gap:var(--eu-s-2);align-items:center;
}
.t-bc a{color:inherit;transition:color var(--eu-dur) var(--eu-ease)}
.t-bc a:hover{color:var(--eu-accent)}
.t-bc__sep{opacity:0.5}
.t-art-title{
  font-size:var(--eu-fs-h1);
  line-height:var(--eu-lh-h1);
  font-weight:800;
  letter-spacing:-0.022em;
  margin:0 0 var(--eu-s-6) !important;
  max-width:24ch;
}
.t-art-meta{
  display:flex;align-items:center;gap:var(--eu-s-3);
  font-size:var(--eu-fs-meta);
  color:var(--eu-text-muted);
}
.t-art-meta__author{
  display:flex;align-items:center;gap:var(--eu-s-2);
  color:var(--eu-text-primary);font-weight:600;
}
.t-art-meta__author .t-avatar{width:24px;height:24px;font-size:10px}
.t-art-meta__sep{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:0.5}
/* Follow button — outlined, transparent fill so it reads on tinted hero in BOTH themes.
   Fixes Zendesk #10584 (Follow button white-on-white in light mode). */
.t-art-meta__follow{
  margin-left:auto;
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;border-radius:var(--eu-radius);
  border:1.5px solid var(--eu-text-primary);
  background:transparent;
  font-weight:600;color:var(--eu-text-primary);
  cursor:pointer;
  transition:all var(--eu-dur) var(--eu-ease);
}
.t-art-meta__follow:hover{
  background:var(--eu-text-primary);
  color:var(--eu-bg-primary);
  border-color:var(--eu-text-primary);
}



.t-art-progress{
  position:absolute;top:0;left:0;height:2px;
  width:36%;
  background:var(--eu-gradient-bar);
  border-radius:0 2px 2px 0;
}

/* Article layout */
.t-art-layout{
  max-width:1180px;margin:0 auto;
  padding:var(--eu-s-8) var(--eu-s-8) var(--eu-s-12);
  display:grid;
  grid-template-columns:240px minmax(0,1fr) 220px;
  gap:var(--eu-s-8);
}

/* Sidebar: in this section */
.t-art-side{
  align-self:flex-start;position:sticky;top:96px;
}
.t-art-side__hdr{
  display:flex;align-items:center;gap:var(--eu-s-2);
  font-size:var(--eu-fs-caption);font-weight:700;
  letter-spacing:0.08em;text-transform:uppercase;
  color:var(--eu-text-muted);
  margin-bottom:var(--eu-s-3);
  padding-bottom:var(--eu-s-2);
  border-bottom:1px solid var(--eu-border);
}
.t-art-side__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px}
.t-art-side__list a{
  position:relative;display:block;
  padding:8px 12px 8px 16px;
  border-radius:var(--eu-radius-sm);
  font-size:var(--eu-fs-meta);
  color:var(--eu-text-secondary);
  font-weight:500;
  transition:all var(--eu-dur) var(--eu-ease);
  line-height:1.4;
}
.t-art-side__list a:hover{background:var(--eu-bg-hover);color:var(--eu-text-primary)}
.t-art-side__list a.is-active{
  color:var(--eu-text-primary);
  font-weight:700;
  background:var(--eu-bg-hover);
}
.t-art-side__list a.is-active::before{
  content:'';position:absolute;left:0;top:6px;bottom:6px;width:2px;
  border-radius:2px;
  background:var(--eu-gradient-bar);
}

/* TOC right rail */
.t-toc{align-self:flex-start;position:sticky;top:96px}
.t-toc__hdr{
  font-size:var(--eu-fs-caption);font-weight:700;
  letter-spacing:0.08em;text-transform:uppercase;
  color:var(--eu-text-muted);
  margin-bottom:var(--eu-s-3);
}
.t-toc__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px;border-left:1px solid var(--eu-border)}
.t-toc__list a{
  position:relative;display:block;
  padding:6px 12px;
  font-size:var(--eu-fs-meta);
  color:var(--eu-text-muted);
  transition:color var(--eu-dur) var(--eu-ease);
  line-height:1.4;
  margin-left:-1px;
}
.t-toc__list a.is-h3{padding-left:22px;font-size:12px}
.t-toc__list a:hover{color:var(--eu-text-primary)}
.t-toc__list a.is-active{
  color:var(--eu-text-primary);font-weight:700;
  border-left:2px solid;
  border-image:var(--eu-gradient-bar) 1;
}

/* Article body — reading optimized */
.t-art-main{min-width:0;max-width:720px}
.t-art-main h2{
  font-size:var(--eu-fs-h2) !important;
  margin:var(--eu-s-12) 0 var(--eu-s-3) !important;
  padding-bottom:var(--eu-s-2);
  border-bottom:2px solid var(--eu-accent);
  font-weight:700 !important;
  letter-spacing:-0.015em;
}
.t-art-main h2:first-child{margin-top:0 !important}
.t-art-main h3{
  font-size:var(--eu-fs-h3) !important;
  margin:var(--eu-s-8) 0 var(--eu-s-3) !important;
  font-weight:700;
  color:var(--eu-accent) !important;
}
.t-art-main p{
  font-size:17px;
  line-height:1.7;
  color:var(--eu-text-primary);
  margin:0 0 var(--eu-s-4);
  max-width:65ch;
}
.t-art-main strong{font-weight:700;color:var(--eu-text-primary)}
.t-art-main a{color:var(--eu-accent);border-bottom:1px solid transparent;transition:border-color var(--eu-dur) var(--eu-ease)}
.t-art-main a:hover{border-bottom-color:var(--eu-accent)}
.t-art-main code{
  font-family:'JetBrains Mono',monospace;
  font-size:13px;
  background:rgba(21,73,150,0.08);
  color:var(--eu-accent);
  padding:2px 6px;border-radius:4px;
}
.eu-dark .t-art-main code{background:rgba(91,155,230,0.12)}
.t-art-main pre{
  margin:var(--eu-s-4) 0;
  background:var(--eu-bg-secondary);
  border:1px solid var(--eu-border);
  border-radius:10px;
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
}
.t-art-main pre .pre-hdr{
  display:flex;justify-content:space-between;align-items:center;
  padding:8px 14px;
  background:var(--eu-bg-tertiary);
  border-bottom:1px solid var(--eu-border);
  font-family:'JetBrains Mono',monospace;
  font-size:11px;
  font-weight:600;
  color:var(--eu-text-muted);
  text-transform:uppercase;letter-spacing:0.06em;
}
.t-art-main pre .copy-btn{
  display:inline-flex;align-items:center;gap:4px;
  background:none;border:none;
  color:var(--eu-text-muted);
  font-size:11px;font-weight:600;
  cursor:pointer;padding:2px 6px;border-radius:4px;
  font-family:inherit;
}
.t-art-main pre .copy-btn:hover{color:var(--eu-accent);background:rgba(21,73,150,0.08)}
.t-art-main pre code{
  display:block;
  background:transparent;
  color:var(--eu-text-primary);
  padding:14px;
  font-size:13px;line-height:1.6;
  border-radius:0;
}
/* Article callouts — Note (default) / Tip / Warning.
   Body text always --eu-text-primary so it reads in BOTH modes.
   Fixes Zendesk #10585 (disclaimer/info blocks unreadable in dark mode). */
.t-art-main blockquote{
  margin:var(--eu-s-4) 0;
  padding:var(--eu-s-3) var(--eu-s-4);
  border-radius:0 var(--eu-radius) var(--eu-radius) 0;
  background:rgba(21,73,150,0.06);
  border-left:3px solid var(--eu-accent);
  font-size:15px;line-height:1.65;
  color:var(--eu-text-primary);
}
.eu-dark .t-art-main blockquote{background:rgba(74,144,226,0.12)}
.t-art-main blockquote strong{color:var(--eu-text-primary);font-weight:700}
.t-art-main blockquote a{color:var(--eu-accent);text-decoration:underline;text-underline-offset:2px}
.eu-dark .t-art-main blockquote a{color:var(--eu-accent-hover)}

.t-art-main blockquote.is-tip{
  background:rgba(46,125,98,0.08);
  border-left-color:#2e7d62;
}
.eu-dark .t-art-main blockquote.is-tip{background:rgba(94,200,158,0.14);border-left-color:#5ec89e}

.t-art-main blockquote.is-warning{
  background:rgba(180,116,18,0.10);
  border-left-color:#b47412;
}
.eu-dark .t-art-main blockquote.is-warning{
  background:rgba(232,168,72,0.16);
  border-left-color:#e8a848;
}

.t-art-main blockquote .cl-icon{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:700;
  color:var(--eu-accent);
  text-transform:uppercase;letter-spacing:0.06em;
  margin-bottom:6px;
}
.eu-dark .t-art-main blockquote .cl-icon{color:var(--eu-accent-hover)}
.t-art-main blockquote.is-tip .cl-icon{color:#2e7d62}
.eu-dark .t-art-main blockquote.is-tip .cl-icon{color:#5ec89e}
.t-art-main blockquote.is-warning .cl-icon{color:#b47412}
.eu-dark .t-art-main blockquote.is-warning .cl-icon{color:#e8a848}
.t-art-main ul,.t-art-main ol{padding-left:24px;margin:var(--eu-s-3) 0;color:var(--eu-text-primary)}
.t-art-main li{margin:6px 0;font-size:17px;line-height:1.7}

/* Article footer module */
.t-art-foot{
  margin:var(--eu-s-16) 0 0;
  padding-top:var(--eu-s-8);
  border-top:1px solid var(--eu-border);
}
.t-art-helpful{
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);
  padding:var(--eu-s-6);
  margin-bottom:var(--eu-s-6);
  text-align:center;
}
.t-art-helpful__q{font-size:var(--eu-fs-h3);font-weight:700;margin:0 0 var(--eu-s-4)}
.t-art-helpful__btns{display:flex;gap:var(--eu-s-3);justify-content:center}
.t-art-helpful__btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 22px;
  border-radius:var(--eu-radius);
  border:1px solid var(--eu-border);
  background:var(--eu-bg-card);
  color:var(--eu-text-primary);
  font-weight:600;font-size:var(--eu-fs-ui);
  cursor:pointer;
  transition:all var(--eu-dur) var(--eu-ease);
}
.t-art-helpful__btn:hover{border-color:var(--eu-accent);background:rgba(21,73,150,0.04);color:var(--eu-accent)}
.t-art-foot__row{display:flex;align-items:center;gap:var(--eu-s-4);font-size:var(--eu-fs-meta);color:var(--eu-text-muted)}
.t-ghost-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;border-radius:var(--eu-radius-sm);
  border:1px solid var(--eu-border);background:transparent;
  color:var(--eu-text-secondary);
  font-size:var(--eu-fs-meta);font-weight:600;
  cursor:pointer;
}
.t-ghost-btn:hover{border-color:var(--eu-accent);color:var(--eu-accent)}

/* Related articles row */
.t-related{margin-top:var(--eu-s-8)}
.t-related__title{font-size:var(--eu-fs-caption);font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--eu-text-muted);margin-bottom:var(--eu-s-3)}
.t-related__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--eu-s-3)}
.t-related__card{
  padding:var(--eu-s-4);
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius);
  transition:all var(--eu-dur) var(--eu-ease-out);
}
.t-related__card:hover{transform:translateY(-2px);border-color:var(--eu-border-accent);box-shadow:var(--eu-shadow-hover)}
.t-related__card-cat{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--eu-magenta);margin-bottom:6px}
.t-related__card-title{font-size:var(--eu-fs-ui);font-weight:600;color:var(--eu-text-primary);line-height:1.4}


/* ============================================================
 * Europeum v2 design hand-off — RUNBOOK block (2026-05-04)
 * Numbered procedure block usable inside article body when
 * authors mark up steps with .t-runbook / .t-step.
 * ============================================================ */
/* ============================================================
   v2 ADDITIONS
   - SLA strip (post-hero, pre-actions on Home)
   - Runbook-style numbered procedure block (Article)
   ============================================================ */
.t-sla{
  position:relative;
  margin:calc(-1 * var(--eu-s-12)) auto var(--eu-s-8);
  max-width:1100px;
  display:grid;
  grid-template-columns:auto 1fr auto auto auto;
  align-items:center;
  gap:var(--eu-s-6);
  padding:var(--eu-s-3) var(--eu-s-6);
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);
  box-shadow:0 12px 32px rgba(32,12,54,0.06),0 1px 3px rgba(32,12,54,0.06);
  z-index:3;
}
.eu-dark .t-sla{box-shadow:0 16px 40px rgba(0,0,0,0.5),0 0 0 1px rgba(255,255,255,0.04)}
.t-sla__pulse{
  display:flex;align-items:center;gap:var(--eu-s-2);
  font-size:var(--eu-fs-caption);font-weight:700;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--eu-text-primary);
  padding-right:var(--eu-s-4);border-right:1px solid var(--eu-border);
}
.t-sla__dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--eu-mint);
  box-shadow:0 0 0 4px rgba(157,198,184,0.25);
  animation:t-sla-pulse 2s var(--eu-ease) infinite;
}
@keyframes t-sla-pulse{
  0%,100%{box-shadow:0 0 0 4px rgba(157,198,184,0.25)}
  50%{box-shadow:0 0 0 8px rgba(157,198,184,0)}
}
.t-sla__msg{font-size:var(--eu-fs-meta);color:var(--eu-text-secondary);line-height:1.4}
.t-sla__msg strong{color:var(--eu-text-primary);font-weight:600}
.t-sla__metric{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:88px}
.t-sla__num{font-size:var(--eu-fs-h3);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-0.01em;color:var(--eu-text-primary);line-height:1}
.t-sla__num.is-ok{color:#2d7a5f}
.eu-dark .t-sla__num.is-ok{color:var(--eu-mint)}
.t-sla__num.is-warn{color:#a87f00}
.eu-dark .t-sla__num.is-warn{color:var(--eu-yellow)}
.t-sla__lab{font-size:10px;font-weight:600;color:var(--eu-text-muted);text-transform:uppercase;letter-spacing:0.06em}

/* Runbook procedure block — supersedes the inline h3 "1./2./3." within Article */
.t-runbook{margin:var(--eu-s-6) 0 var(--eu-s-8)}
.t-runbook__hdr{
  display:flex;align-items:center;gap:var(--eu-s-3);
  margin-bottom:var(--eu-s-4);
  padding:var(--eu-s-3) var(--eu-s-4);
  background:linear-gradient(135deg,rgba(21,73,150,0.05),rgba(192,26,133,0.03));
  border:1px solid var(--eu-border);
  border-left:3px solid;
  border-image:var(--eu-gradient-bar) 1;
  border-radius:0 var(--eu-radius) var(--eu-radius) 0;
  font-size:var(--eu-fs-meta);
}
.t-runbook__hdr-i{color:var(--eu-magenta)}
.t-runbook__hdr-t{font-weight:700;color:var(--eu-text-primary)}
.t-runbook__hdr-meta{color:var(--eu-text-muted);margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:11px}
.t-runbook__hdr-meta strong{color:var(--eu-text-primary);font-weight:600}
.t-step{
  display:grid;grid-template-columns:48px 1fr;gap:var(--eu-s-4);
  position:relative;padding-bottom:var(--eu-s-6);
}
.t-step::before{
  content:'';position:absolute;left:23px;top:48px;bottom:0;width:1px;
  background:var(--eu-border);
}
.t-step:last-child{padding-bottom:0}
.t-step:last-child::before{display:none}
.t-step__num{
  width:48px;height:48px;border-radius:50%;
  background:var(--eu-bg-card);border:2px solid var(--eu-accent);
  color:var(--eu-accent);
  display:grid;place-items:center;
  font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;
  position:relative;z-index:1;
}
.t-step--done .t-step__num{background:var(--eu-accent);color:#fff;border-color:var(--eu-accent)}
.t-step--done .t-step__num::after{
  content:'';position:absolute;inset:0;display:grid;place-items:center;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/20px no-repeat;
}
.t-step--current .t-step__num{
  background:var(--eu-gradient-accent);color:#fff;border:none;
  box-shadow:0 0 0 4px rgba(192,26,133,0.15);
}
.t-step__body{padding-top:6px;min-width:0}
.t-step__body h4{
  font-size:var(--eu-fs-h3) !important;
  font-weight:700 !important;
  margin:0 0 4px !important;
  color:var(--eu-text-primary) !important;
  letter-spacing:-0.01em;
}
.t-step__est{
  font-size:11px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--eu-text-muted);margin-bottom:var(--eu-s-3);
  display:flex;align-items:center;gap:var(--eu-s-2);flex-wrap:wrap;
}
.t-step__est .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:0.5}
.t-step__body p{font-size:15px !important;line-height:1.65 !important;margin:0 0 var(--eu-s-3) !important}


/* ============================================================
 * Europeum v2 design hand-off — Zendesk ticket fixes (2026-05-04)
 * Mirrored onto BOTH the new .t-* selectors (forward-looking)
 * and the live .article-body / existing selectors (active now).
 * Closes: #10584, #10585, #10582, #10583
 * ============================================================ */

/* #10584 — Article "Follow" button visibility
   Forward-looking selector for the new design. The current
   .eu-art-hero__follow style was patched separately on 2026-04-30. */
.t-art-meta__follow{
  margin-left:auto;
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;border-radius:var(--eu-radius);
  border:1.5px solid var(--eu-text-primary);
  background:transparent;
  font-weight:600;color:var(--eu-text-primary);
  cursor:pointer;
  transition:all var(--eu-dur) var(--eu-ease);
}
.t-art-meta__follow:hover{
  background:var(--eu-text-primary);
  color:var(--eu-bg-primary);
  border-color:var(--eu-text-primary);
}

/* #10585 — Article callouts (blockquote / .is-tip / .is-warning) readable in dark mode.
   Mirrored onto Zendesk's .article-body wrapper which is what {{article.body}} renders into. */
.article-body blockquote,
.t-art-main blockquote{
  margin:var(--eu-s-4) 0;
  padding:var(--eu-s-3) var(--eu-s-4);
  border-radius:0 var(--eu-radius) var(--eu-radius) 0;
  background:rgba(21,73,150,0.06);
  border-left:3px solid var(--eu-accent);
  font-size:15px;line-height:1.65;
  color:var(--eu-text-primary);
}
.eu-dark .article-body blockquote,
.eu-dark .t-art-main blockquote{background:rgba(74,144,226,0.12)}
.article-body blockquote strong,
.t-art-main blockquote strong{color:var(--eu-text-primary);font-weight:700}
.article-body blockquote a,
.t-art-main blockquote a{color:var(--eu-accent);text-decoration:underline;text-underline-offset:2px}
.eu-dark .article-body blockquote a,
.eu-dark .t-art-main blockquote a{color:var(--eu-accent-hover,var(--eu-accent-light))}

.article-body blockquote.is-tip,
.t-art-main blockquote.is-tip{background:rgba(46,125,98,0.08);border-left-color:#2e7d62}
.eu-dark .article-body blockquote.is-tip,
.eu-dark .t-art-main blockquote.is-tip{background:rgba(94,200,158,0.14);border-left-color:#5ec89e}

.article-body blockquote.is-warning,
.t-art-main blockquote.is-warning{background:rgba(180,116,18,0.10);border-left-color:#b47412}
.eu-dark .article-body blockquote.is-warning,
.eu-dark .t-art-main blockquote.is-warning{background:rgba(232,168,72,0.16);border-left-color:#e8a848}

.article-body blockquote .cl-icon,
.t-art-main blockquote .cl-icon{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:700;
  color:var(--eu-accent);
  text-transform:uppercase;letter-spacing:0.06em;
  margin-bottom:6px;
}
.eu-dark .article-body blockquote .cl-icon,
.eu-dark .t-art-main blockquote .cl-icon{color:var(--eu-accent-hover,var(--eu-accent-light))}
.article-body blockquote.is-tip .cl-icon,
.t-art-main blockquote.is-tip .cl-icon{color:#2e7d62}
.eu-dark .article-body blockquote.is-tip .cl-icon,
.eu-dark .t-art-main blockquote.is-tip .cl-icon{color:#5ec89e}
.article-body blockquote.is-warning .cl-icon,
.t-art-main blockquote.is-warning .cl-icon{color:#b47412}
.eu-dark .article-body blockquote.is-warning .cl-icon,
.eu-dark .t-art-main blockquote.is-warning .cl-icon{color:#e8a848}

/* #10597 — header "Submit a request" CTA: gradient pill, high contrast.
   Forward-looking selector; will activate when header.hbs uses .t-cta. */
.t-cta{
  background:var(--eu-gradient-accent);
  color:#fff !important;
  padding:8px 16px !important;
  border-radius:var(--eu-radius);
  font-weight:600 !important;
  box-shadow:0 2px 10px rgba(21,73,150,0.25);
}

/* #10582, #10583 — search bar containment.
   .t-search rules already present from home page block above; this is
   the search-results-page contained variant. */
.t-sr-search{
  display:flex;align-items:center;gap:var(--eu-s-3);
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius);
  padding:10px 14px;max-width:720px;
  box-shadow:var(--eu-shadow);
}
.t-sr-search input{
  flex:1;border:none;background:transparent;
  font-family:inherit;font-size:var(--eu-fs-h3);
  color:var(--eu-text-primary);outline:none;
}

/* ============================================================
 * NOCS — EBSI Node Operators Community Space (Phase 1)
 * Landing layout (.nocs-*), access-denied page, macro shims
 * (.eu-aui-btn / .eu-lozenge / .eu-expand)
 * ============================================================ */

/* Landing hero */
.nocs-hero{background:linear-gradient(135deg,#154996 0%,#4a2090 50%,#c01a85 100%);color:#fff;padding:48px 24px;border-radius:0 0 24px 24px;position:relative;overflow:hidden}
.nocs-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 25% 20%,rgba(255,255,255,.12) 0%,transparent 60%);pointer-events:none}
.nocs-hero__inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.nocs-hero__logo{flex-shrink:0;width:72px;height:72px}
.nocs-hero__logo svg{width:100%;height:100%}
.nocs-hero__copy{flex:1;min-width:240px}
.nocs-hero__title{font-size:32px;font-weight:800;margin:0 0 6px;letter-spacing:-0.5px}
.nocs-hero__sub{font-size:14px;opacity:.85;margin:0}
.nocs-hero__badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;backdrop-filter:blur(2px)}
.nocs-hero__badge-dot{width:8px;height:8px;border-radius:50%;background:#9dc6b8;box-shadow:0 0 0 3px rgba(157,198,184,.3)}

/* Top row: search / contact / pinned */
.nocs-toprow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1100px;margin:32px auto 0;padding:0 24px}
@media (max-width:900px){.nocs-toprow{grid-template-columns:1fr}}
.nocs-card{background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:14px;padding:20px;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;display:flex;flex-direction:column;gap:10px}
.nocs-card:hover{transform:translateY(-3px);border-color:var(--eu-border-accent);box-shadow:var(--eu-shadow-hover,0 8px 24px rgba(21,73,150,.12))}
.nocs-card__title{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--eu-text-muted);margin:0;display:flex;align-items:center;gap:8px}
.nocs-card__icon{width:18px;height:18px}

/* Live search */
.nocs-search__input{width:100%;padding:10px 12px;border:1px solid var(--eu-border);border-radius:8px;background:var(--eu-input-bg);color:var(--eu-text-primary);font-size:14px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}
.nocs-search__input:focus{border-color:var(--eu-accent);box-shadow:0 0 0 3px rgba(21,73,150,.15)}
.nocs-search__results{margin-top:10px;display:none;flex-direction:column;gap:6px;max-height:280px;overflow:auto}
.nocs-search__results.is-open{display:flex}
.nocs-search__group{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--eu-text-muted);padding:6px 4px}
.nocs-search__hit{display:block;padding:8px 10px;border-radius:6px;color:var(--eu-text-primary);text-decoration:none;font-size:13px;line-height:1.4;border:1px solid transparent}
.nocs-search__hit:hover{background:var(--eu-bg-hover);border-color:var(--eu-border)}
.nocs-search__empty{padding:8px 10px;font-size:12px;color:var(--eu-text-muted)}

/* Contact / pinned card buttons */
.nocs-card__cta{align-self:flex-start;margin-top:auto;background:linear-gradient(135deg,#154996,#c01a85);color:#fff;text-decoration:none;padding:8px 18px;border-radius:8px;font-size:13px;font-weight:600;transition:filter .15s ease}
.nocs-card__cta:hover{filter:brightness(1.1)}
.nocs-pinned__title{font-size:14px;font-weight:600;color:var(--eu-text-primary);margin:0}
.nocs-pinned__meta{font-size:12px;color:var(--eu-text-muted)}

/* Tile grid */
.nocs-tiles{max-width:1100px;margin:24px auto 0;padding:0 24px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.nocs-tiles__wide{grid-column:1 / -1}
@media (max-width:700px){.nocs-tiles{grid-template-columns:1fr}}
.nocs-tile{display:flex;flex-direction:column;gap:8px;padding:24px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:14px;color:var(--eu-text-primary);text-decoration:none;position:relative;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.nocs-tile::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#154996,#c01a85);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;pointer-events:none}
.nocs-tile:hover{transform:translateY(-3px);border-color:var(--eu-border-accent);box-shadow:0 8px 24px rgba(21,73,150,.12)}
.nocs-tile:hover::after{transform:scaleX(1)}
.nocs-tile__icon{font-size:28px;line-height:1}
.nocs-tile__title{font-size:18px;font-weight:700;margin:0}
.nocs-tile__desc{font-size:13px;color:var(--eu-text-muted);margin:0}
.nocs-tile__arrow{align-self:flex-end;margin-top:auto;font-size:18px;color:var(--eu-accent);opacity:0;transform:translateX(-4px);transition:opacity .2s ease,transform .2s ease}
.nocs-tile:hover .nocs-tile__arrow{opacity:1;transform:translateX(0)}

/* Welcome banner */
.nocs-welcome{max-width:1100px;margin:28px auto 0;padding:0 24px}
.nocs-welcome__inner{background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:14px;padding:24px 28px}
.nocs-welcome__title{font-size:20px;font-weight:800;margin:0 0 6px;color:var(--eu-text-primary)}
.nocs-welcome__sub{font-size:14px;color:var(--eu-text-muted);margin:0;line-height:1.6}

/* Category cards */
.nocs-cats{max-width:1100px;margin:20px auto 0;padding:0 24px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:1000px){.nocs-cats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.nocs-cats{grid-template-columns:1fr}}
.nocs-cat{display:flex;flex-direction:column;gap:6px;padding:20px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:14px;color:var(--eu-text-primary);text-decoration:none;position:relative;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.nocs-cat::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#154996,#c01a85);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;pointer-events:none}
.nocs-cat:hover{transform:translateY(-3px);border-color:var(--eu-border-accent);box-shadow:0 8px 24px rgba(21,73,150,.12)}
.nocs-cat:hover::after{transform:scaleX(1)}
.nocs-cat__icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;background:rgba(21,73,150,0.08);color:var(--eu-accent)}
.nocs-cat__icon svg{width:22px;height:22px}
.eu-dark .nocs-cat__icon{background:rgba(91,155,230,0.12)}
.nocs-deny__icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:14px;background:rgba(21,73,150,0.08);color:var(--eu-accent);margin:0 auto var(--eu-s-4,16px)}
.nocs-deny__icon svg{width:36px;height:36px}
.eu-dark .nocs-deny__icon{background:rgba(91,155,230,0.12)}
.nocs-cat h3{font-size:15px;font-weight:700;margin:0}
.nocs-cat p{font-size:12px;color:var(--eu-text-muted);margin:0;line-height:1.5}

/* Recent posts */
.nocs-recent{max-width:1100px;margin:32px auto 48px;padding:0 24px}
.nocs-recent__title{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--eu-text-muted);margin:0 0 12px}
.nocs-recent__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.nocs-recent__item{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 18px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:10px}
.nocs-recent__item a{color:var(--eu-text-primary);text-decoration:none;font-weight:600;font-size:14px}
.nocs-recent__item a:hover{color:var(--eu-accent)}
.nocs-recent__meta{font-size:12px;color:var(--eu-text-muted);white-space:nowrap}

/* Access-denied page */
.nocs-deny{max-width:560px;margin:80px auto;padding:40px 32px;text-align:center;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:16px}
.nocs-deny__icon{font-size:48px;margin-bottom:16px}
.nocs-deny__title{font-size:24px;font-weight:800;margin:0 0 8px;color:var(--eu-text-primary)}
.nocs-deny__body{font-size:14px;color:var(--eu-text-muted);margin:0 0 24px;line-height:1.6}
.nocs-deny__cta{display:inline-block;background:linear-gradient(135deg,#154996,#c01a85);color:#fff;text-decoration:none;padding:10px 24px;border-radius:8px;font-weight:600}

/* Macro shims (Confluence → CSS) */
.eu-aui-btn{display:inline-block;padding:6px 16px;border-radius:6px;border:1px solid var(--eu-accent);background:transparent;color:var(--eu-accent);font-size:13px;font-weight:600;text-decoration:none;cursor:pointer;transition:all .15s ease}
.eu-aui-btn:hover{background:var(--eu-accent);color:#fff}
.eu-aui-btn--gradient{background:linear-gradient(135deg,#154996,#c01a85);border:none;color:#fff}
.eu-aui-btn--gradient:hover{filter:brightness(1.1);color:#fff}
.eu-aui-btn--ghost{border-color:var(--eu-border);color:var(--eu-text-muted)}
.eu-aui-btn--ghost:hover{background:var(--eu-bg-hover);color:var(--eu-text-primary)}

.eu-lozenge{display:inline-block;padding:2px 8px;border-radius:3px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.eu-lozenge--success{background:rgba(157,198,184,.2);color:#1a6b4d}
.eu-lozenge--warning{background:rgba(242,205,48,.2);color:#7a5a00}
.eu-lozenge--info{background:rgba(21,73,150,.15);color:#154996}
.eu-lozenge--error{background:rgba(192,26,133,.15);color:#c01a85}
.eu-lozenge--neutral{background:var(--eu-bg-hover);color:var(--eu-text-muted)}

.eu-expand{border:1px solid var(--eu-border);border-radius:8px;padding:0;overflow:hidden;background:var(--eu-bg-card)}
.eu-expand>summary{padding:12px 16px;cursor:pointer;font-weight:600;color:var(--eu-text-primary);list-style:none;display:flex;align-items:center;gap:8px}
.eu-expand>summary::before{content:"▸";display:inline-block;transition:transform .2s ease;color:var(--eu-accent)}
.eu-expand[open]>summary::before{transform:rotate(90deg)}
.eu-expand>summary::-webkit-details-marker{display:none}
.eu-expand__body{padding:0 16px 16px;color:var(--eu-text-primary)}

.eu-dark .nocs-deny{box-shadow:0 8px 32px rgba(0,0,0,.4)}

/* ============================================================
 * Hero search bar fixes (2026-05-04)
 * - icon vertically centered (was static top:25px)
 * - ⌘K kbd hint hides when input has text (avoids clash with
 *   Zendesk's auto-rendered .clear-button at right:12px)
 * - paddingLeft 52px (was 44px) so query text clears the icon
 * ============================================================ */
.t-search{position:relative;max-width:720px}
.t-search__icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--eu-text-muted);pointer-events:none;z-index:2;display:flex;align-items:center;justify-content:center}
.t-search__kbd{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:600;padding:3px 8px;border:1px solid var(--eu-border);border-radius:4px;color:var(--eu-text-muted);background:var(--eu-bg-secondary);pointer-events:none;font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:0.04em;z-index:1;transition:opacity .15s ease}
.t-search form{position:relative;margin:0}
.t-search input[type="search"]{
  width:100%;height:56px;
  padding:0 92px 0 52px !important;
  border-radius:var(--eu-radius);
  border:1px solid var(--eu-border);
  background:var(--eu-input-bg);
  color:var(--eu-text-primary);
  font-size:15px;font-family:inherit;
  box-shadow:0 4px 20px rgba(21,73,150,0.06),0 1px 2px rgba(32,12,54,0.06);
  transition:all var(--eu-dur) var(--eu-ease);
  outline:none;
}
.t-search input[type="search"]:focus{
  border-color:var(--eu-accent);
  box-shadow:0 0 0 3px rgba(21,73,150,0.15);
}
/* Hide our ⌘K hint when the input has text — Zendesk renders a
   .clear-button (X) at the same position, which would overlap. */
.t-search:has(input[type="search"]:not(:placeholder-shown)) .t-search__kbd{opacity:0;visibility:hidden}
/* Style Zendesk's auto-rendered clear-button so it sits cleanly */
.t-search .clear-button{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  width:24px;height:24px;border:none;background:transparent;
  color:var(--eu-text-muted);cursor:pointer;border-radius:4px;
  display:none;align-items:center;justify-content:center;
}
.t-search:has(input[type="search"]:not(:placeholder-shown)) .clear-button{display:flex}
.t-search .clear-button:hover{background:var(--eu-bg-hover);color:var(--eu-text-primary)}

/* ============================================================
 * v2 polish for new_request_page (catalog) — 2026-05-04
 * Layered onto existing .eu-form-categories / .eu-cat-card
 * structure. Brings the design hand-off look (raised cards,
 * gradient hover CTA effect, tighter type rhythm, SLA hint).
 * ============================================================ */
.eu-request-page .eu-req-hero{padding:var(--eu-s-12) var(--eu-s-8) var(--eu-s-6);border-radius:var(--eu-radius-lg);position:relative;overflow:hidden}
.eu-request-page .eu-req-hero h1{font-size:var(--eu-fs-h1);font-weight:800;letter-spacing:-0.022em;line-height:var(--eu-lh-h1);margin:var(--eu-s-2) 0 var(--eu-s-3)}
.eu-request-page .eu-req-hero-sub{font-size:var(--eu-fs-h3);color:var(--eu-text-secondary);max-width:60ch;margin:0;font-weight:400;line-height:var(--eu-lh-h3)}

/* Section header — eyebrow style + dividing rule */
.eu-form-categories{padding:var(--eu-s-4) var(--eu-s-2) var(--eu-s-12);max-width:1180px;margin:0 auto}
.eu-category-group{margin-bottom:var(--eu-s-8)}
.eu-category-group-header{padding-bottom:var(--eu-s-3);margin-bottom:var(--eu-s-4);border-bottom:1px solid var(--eu-border)}
.eu-category-group-title{font-size:var(--eu-fs-caption) !important;font-weight:700 !important;text-transform:uppercase;letter-spacing:0.08em}
.eu-category-group-badge{font-size:var(--eu-fs-caption);font-weight:700;padding:3px 10px;border-radius:6px;letter-spacing:0.06em;text-transform:uppercase}

/* Card grid — taller cards, more breathing room, lift on hover */
.eu-category-cards{grid-template-columns:repeat(2,1fr);gap:var(--eu-s-3)}
.eu-cat-card{padding:var(--eu-s-5) var(--eu-s-5) !important;border-radius:var(--eu-radius-lg) !important;gap:var(--eu-s-4);align-items:center;position:relative;transition:transform var(--eu-dur) var(--eu-ease-out), border-color var(--eu-dur) var(--eu-ease-out), box-shadow var(--eu-dur) var(--eu-ease-out) !important}
.eu-cat-card:hover{transform:translateY(-2px) !important;border-color:var(--eu-border-accent) !important;box-shadow:var(--eu-shadow-hover) !important;background:var(--eu-bg-card) !important}
.eu-cat-card::after{content:"→";position:absolute;right:var(--eu-s-5);top:50%;transform:translateY(-50%) translateX(-4px);font-size:18px;color:var(--eu-accent);opacity:0;transition:opacity var(--eu-dur) var(--eu-ease), transform var(--eu-dur) var(--eu-ease);pointer-events:none}
.eu-cat-card:hover::after{opacity:1;transform:translateY(-50%) translateX(0)}
.eu-cat-icon{width:44px;height:44px;border-radius:12px}
.eu-cat-card .eu-cat-name,
.eu-cat-card > a > span:first-of-type{font-size:var(--eu-fs-h3);font-weight:700;letter-spacing:-0.01em;color:var(--eu-text-primary)}

/* SDNOP variant — magenta-leaning accent for ops surfaces */
.eu-category-group--nop .eu-cat-card{box-shadow:inset 3px 0 transparent, var(--eu-shadow);transition:box-shadow var(--eu-dur) var(--eu-ease-out), transform var(--eu-dur) var(--eu-ease-out), border-color var(--eu-dur) var(--eu-ease-out) !important}
.eu-category-group--nop .eu-cat-card:hover{box-shadow:inset 3px 0 var(--eu-magenta), var(--eu-shadow-hover) !important}

/* Single column under 700px */
@media (max-width:700px){.eu-category-cards{grid-template-columns:1fr !important}}

/* ============================================================
 * DARK-MODE SAFETY NET (2026-05-04)
 * Catch-all overrides for hardcoded light values from Copenhagen
 * base + earlier patches that didn't go through CSS variables.
 * Keeps surfaces dark, text readable, contrast preserved.
 * ============================================================ */

/* User-nav dropdown / mobile menu surfaces */
.eu-dark .user-nav[aria-expanded=true]{background-color:var(--eu-bg-secondary) !important;border-color:var(--eu-border) !important;box-shadow:var(--eu-shadow-hover) !important}
.eu-dark .nav-wrapper-mobile .menu-list-mobile{background-color:var(--eu-bg-secondary) !important;border-top-color:var(--eu-border) !important;border-bottom-color:var(--eu-border) !important}
.eu-dark .nav-wrapper-mobile .menu-list-mobile-items button:hover,
.eu-dark .nav-wrapper-mobile .menu-list-mobile-items button:focus,
.eu-dark .nav-wrapper-mobile .menu-list-mobile-items a:hover,
.eu-dark .nav-wrapper-mobile .menu-list-mobile-items a:focus{background-color:var(--eu-bg-hover) !important;color:var(--eu-text-primary) !important}

/* Notifications */
.eu-dark .notification-alert{background:rgba(242,205,48,.1) !important;border-color:rgba(242,205,48,.3) !important;color:var(--eu-yellow) !important}
.eu-dark .notification-inline.notification-error{background-color:rgba(192,26,133,.1) !important;border-color:rgba(192,26,133,.3) !important;color:var(--eu-magenta) !important}
.eu-dark .notification-inline.notification-success{background-color:rgba(157,198,184,.12) !important;border-color:rgba(157,198,184,.3) !important;color:var(--eu-mint) !important}

/* Status badges with hardcoded light bg — preserve semantic color but use translucent dark surface */
.eu-dark .eu-badge--new,.eu-dark .eu-badge--open{background:rgba(230,126,34,.18) !important;color:#ffa970 !important}
.eu-dark .eu-badge--pri-high,.eu-dark .eu-badge--node-installation,.eu-dark .eu-badge--node-opting-out,.eu-dark .eu-badge--sla-8h,.eu-dark .eu-proc-badge--high,.eu-dark .eu-nh-badge--preprod{background:rgba(230,81,0,.18) !important;color:#ffa970 !important}

/* Action buttons that hardcoded white bg */
.eu-dark .eu-action-btn--solved{background:transparent !important;color:#5ec89e !important;border-color:#5ec89e !important}
.eu-dark .eu-action-btn--default{background:transparent !important;color:var(--eu-accent-light) !important;border-color:var(--eu-accent-light) !important}
.eu-dark .eu-action-label--hold,.eu-dark .eu-status--yellow,.eu-dark .eu-panel-warn,.eu-dark .eu-sla-rem--warn{background:rgba(242,205,48,.12) !important;border-color:rgba(242,205,48,.3) !important;color:var(--eu-yellow) !important}

/* Old hero search (legacy .eu-hero__search) */
.eu-dark .eu-hero__search input[type="search"]{background:rgba(13,6,24,.9) !important;color:var(--eu-text-primary) !important;border:1px solid var(--eu-border) !important}

/* Brand name */
.eu-dark .eu-brand-name{color:var(--eu-text-primary) !important}

/* SLA cell label hardcoded #200c36 */
.eu-dark .eu-sla-cell__label{color:var(--eu-text-primary) !important}

/* Article search results "no results" headline */
.eu-dark .search-results .no-results .headline{color:var(--eu-text-primary) !important}

/* Node operator follow button */
.eu-dark .eu-nop-btn--follow{background:transparent !important;color:var(--eu-accent-light) !important;border-color:var(--eu-accent-light) !important}

/* Default Copenhagen body rule with rgb(255,255,255) — already overridden by !important
   var rule, but let's also reinforce for any other Zendesk-injected rule. */
html.eu-dark, html.eu-dark body{background-color:var(--eu-bg-primary) !important;color:var(--eu-text-primary) !important}

/* Inputs/selects/textareas that the Copenhagen base styles in light */
.eu-dark .hbs-form input:not([type=checkbox]):not([type=radio]):not([type=submit]),
.eu-dark .hbs-form select,
.eu-dark .hbs-form textarea,
.eu-dark .search input,
.eu-dark .search textarea,
.eu-dark input[type=text]:not(.t-search input),
.eu-dark input[type=email],
.eu-dark input[type=password],
.eu-dark textarea,
.eu-dark select{background-color:var(--eu-input-bg) !important;color:var(--eu-text-primary) !important;border-color:var(--eu-border) !important}

/* ============================================================
 * UNIFIED FOCUS RINGS (WCAG AA, branded)
 * Every interactive element gets the same recognisable ring.
 * ============================================================ */
*:focus{outline:none}
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible{
  outline:2px solid var(--eu-accent);
  outline-offset:2px;
  border-radius:var(--eu-radius-sm);
}
.t-action:focus-visible,
.t-kb__card:focus-visible,
.t-pop__item:focus-visible,
.nocs-tile:focus-visible,
.eu-cat-card:focus-visible{
  outline-offset:3px;
}
input[type=search]:focus-visible,
input[type=text]:focus-visible,
input[type=email]:focus-visible,
textarea:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(21,73,150,0.2);
  border-color:var(--eu-accent) !important;
}
.eu-dark input[type=search]:focus-visible,
.eu-dark input[type=text]:focus-visible,
.eu-dark input[type=email]:focus-visible,
.eu-dark textarea:focus-visible{
  box-shadow:0 0 0 3px rgba(91,155,230,0.25);
}

/* ============================================================
 * BUTTON POLISH — disabled state, active press feedback
 * ============================================================ */
button:disabled,
[type=submit]:disabled,
.btn:disabled,
.eu-aui-btn:disabled,
.eu-btn-submit:disabled{
  opacity:0.5;
  cursor:not-allowed;
  transform:none !important;
  box-shadow:none !important;
}
button:not(:disabled):active,
[type=submit]:not(:disabled):active,
.btn:not(:disabled):active{
  transform:translateY(1px);
}

/* ============================================================
 * DARK MODE FORCE-PAINT (2026-05-04)
 * Some browsers fail to re-resolve var() in `body { background:
 * var(--eu-bg-primary) }` after .eu-dark is toggled at runtime,
 * leaving the painted color stuck at the light-mode value even
 * though getPropertyValue('--eu-bg-primary') returns the dark
 * one. Hardcoded values inside .eu-dark sidestep this.
 * ============================================================ */
html.eu-dark{background-color:#0d0618}
html.eu-dark body{background-color:#0d0618 !important;color:#eae4f4 !important}
html.eu-dark .header{background-color:rgba(14,20,36,0.9) !important}
html.eu-dark .footer{background-color:#150b24 !important}
html.eu-dark .t-hero{background-color:#0d0618 !important}
html.eu-dark .t-kb__card,
html.eu-dark .t-comm-cta,
html.eu-dark .t-pop__grid,
html.eu-dark .t-action,
html.eu-dark .nocs-card,
html.eu-dark .nocs-tile,
html.eu-dark .nocs-recent__item,
html.eu-dark .eu-cat-card,
html.eu-dark .eu-action-card{background-color:rgba(32,12,54,0.6) !important}
html.eu-dark input[type=search],
html.eu-dark .t-search input,
html.eu-dark .nocs-search__input{background-color:#1c1230 !important;color:#eae4f4 !important}

/* ============================================================
 * Sign-in required (used on new_request_page for anonymous users)
 * ============================================================ */
.eu-signin-required{max-width:560px;margin:var(--eu-s-16) auto;padding:0 var(--eu-s-6)}
.eu-signin-required__inner{padding:var(--eu-s-12) var(--eu-s-8);text-align:center;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:var(--eu-radius-lg);box-shadow:var(--eu-shadow)}
.eu-signin-required__icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:16px;background:var(--eu-gradient-accent);color:#fff;margin-bottom:var(--eu-s-4);box-shadow:0 4px 16px rgba(21,73,150,0.25)}
.eu-signin-required__title{font-size:var(--eu-fs-h2);font-weight:800;letter-spacing:-0.015em;margin:0 0 var(--eu-s-3);color:var(--eu-text-primary)}
.eu-signin-required__body{font-size:var(--eu-fs-body);line-height:var(--eu-lh-body);color:var(--eu-text-secondary);margin:0 0 var(--eu-s-6);max-width:48ch;margin-left:auto;margin-right:auto}
.eu-signin-required__actions{display:flex;gap:var(--eu-s-3);justify-content:center;flex-wrap:wrap}
.eu-signin-required__cta{display:inline-block;padding:12px 28px;border-radius:var(--eu-radius);background:var(--eu-gradient-accent);color:#fff;text-decoration:none;font-weight:600;font-size:var(--eu-fs-ui);box-shadow:0 2px 10px rgba(21,73,150,0.25);transition:transform var(--eu-dur) var(--eu-ease), box-shadow var(--eu-dur) var(--eu-ease)}
.eu-signin-required__cta:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(21,73,150,0.35)}
.eu-signin-required__back{display:inline-block;padding:12px 24px;border-radius:var(--eu-radius);border:1px solid var(--eu-border);color:var(--eu-text-secondary);text-decoration:none;font-weight:500;font-size:var(--eu-fs-ui);transition:all var(--eu-dur) var(--eu-ease)}
.eu-signin-required__back:hover{background:var(--eu-bg-hover);color:var(--eu-text-primary);border-color:var(--eu-border-accent)}

/* ── Newsletter Subscribe Button ─────────────────────────────────────────── */
.eu-newsletter-sub {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: var(--eu-radius);
  background: var(--eu-gradient-accent); color: #fff !important;
  border: none; font-weight: 600; font-size: var(--eu-fs-meta);
  cursor: pointer; transition: transform var(--eu-dur) var(--eu-ease), filter var(--eu-dur) var(--eu-ease);
  box-shadow: 0 2px 8px rgba(21,73,150,.25);
  margin-left: 8px;
}
.eu-newsletter-sub:hover { transform: translateY(-1px); filter: brightness(1.08); }
.eu-newsletter-sub.is-subscribed {
  background: transparent; color: var(--eu-text-primary) !important;
  border: 1.5px solid var(--eu-text-primary); box-shadow: none;
}
.eu-newsletter-sub.is-subscribed:hover {
  background: var(--eu-text-primary); color: var(--eu-bg-primary) !important;
}
.eu-newsletter-sub:disabled { opacity: .5; cursor: wait; }

/* ============================================================
 * NOCS landing v2 — sandbox layout (2026-05-05)
 * Hero / welcome / quick actions / library grid / activity row
 * ============================================================ */

.nocs-hero__eyebrow{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:6px}

/* Quick actions row */
.nocs-quick{max-width:1200px;margin:24px auto 0;padding:0 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:14px}
@media (max-width:960px){.nocs-quick{grid-template-columns:1fr}}
.nocs-quick__search{position:relative;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:12px;padding:14px 14px 14px 48px;display:flex;flex-direction:column;justify-content:center;transition:border-color .2s,box-shadow .2s}
.nocs-quick__search:focus-within{border-color:var(--eu-accent);box-shadow:0 0 0 3px rgba(21,73,150,.12)}
.nocs-quick__search-icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--eu-text-muted);pointer-events:none}
.nocs-quick__search-icon svg{width:100%;height:100%}
.nocs-quick__search .nocs-search__input{border:none;background:transparent;padding:0;font-size:14px;outline:none;color:var(--eu-text-primary)}
.nocs-quick__search .nocs-search__input:focus{box-shadow:none;border:none}
.nocs-quick__search .nocs-search__results{margin-top:10px;max-height:240px;overflow:auto}

.nocs-quick__cta{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:12px;color:var(--eu-text-primary);text-decoration:none;transition:transform .2s,border-color .2s,box-shadow .2s}
.nocs-quick__cta:hover{transform:translateY(-2px);border-color:var(--eu-border-accent);box-shadow:0 8px 24px rgba(21,73,150,.10);color:var(--eu-text-primary)}
.nocs-quick__cta-icon{flex-shrink:0;width:42px;height:42px;border-radius:10px;background:rgba(21,73,150,.08);color:var(--eu-accent);display:flex;align-items:center;justify-content:center}
.nocs-quick__cta-icon svg{width:22px;height:22px}
.nocs-quick__cta--primary .nocs-quick__cta-icon{background:linear-gradient(135deg,#154996,#c01a85);color:#fff}
.nocs-quick__cta-text{display:flex;flex-direction:column;gap:2px;line-height:1.3}
.nocs-quick__cta-text strong{font-weight:700;font-size:14px;color:var(--eu-text-primary)}
.nocs-quick__cta-text small{font-size:12px;color:var(--eu-text-muted)}
.eu-dark .nocs-quick__cta-icon{background:rgba(91,155,230,.15)}

/* Library grid */
.nocs-lib{max-width:1200px;margin:48px auto 0;padding:0 24px}
.nocs-lib__head{margin-bottom:20px}
.nocs-lib__head h2{font-size:22px;font-weight:800;margin:0 0 6px;letter-spacing:-.01em;color:var(--eu-text-primary)}
.nocs-lib__head p{font-size:13px;color:var(--eu-text-muted);margin:0;max-width:60ch}
.nocs-lib__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:1100px){.nocs-lib__grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.nocs-lib__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.nocs-lib__grid{grid-template-columns:1fr}}

.nocs-block{display:flex;flex-direction:column;gap:8px;padding:18px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:14px;color:var(--eu-text-primary);text-decoration:none;position:relative;overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
/* Card-level clickability: <article> wrappers can't be links, so the title's
 * .nocs-block__link is stretched via ::after to make the whole card a hit
 * target. Inner <a> tags inside .nocs-block__links sit above the overlay. */
.nocs-block__title{font-size:15px;font-weight:700;margin:0;letter-spacing:-.01em;color:var(--eu-text-primary);line-height:1.3}
.nocs-block__link{color:inherit;text-decoration:none}
.nocs-block__link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:14px}
.nocs-block:hover .nocs-block__title{color:var(--eu-accent)}
.nocs-block .nocs-block__links,
.nocs-block .nocs-block__more{position:relative;z-index:2}
.nocs-block__link:focus-visible{outline:none}
.nocs-block:focus-within{border-color:var(--eu-border-accent);box-shadow:0 0 0 3px rgba(21,73,150,.18)}
.nocs-block::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#154996,#c01a85);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.nocs-block:hover{transform:translateY(-3px);border-color:var(--eu-border-accent);box-shadow:0 8px 24px rgba(21,73,150,.12);color:var(--eu-text-primary);text-decoration:none}
.nocs-block:hover::before{transform:scaleX(1)}
.nocs-block__head{display:flex;align-items:center;gap:10px;margin-bottom:2px}
.nocs-block__icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;background:rgba(21,73,150,.08);color:var(--eu-accent);display:flex;align-items:center;justify-content:center}
.nocs-block__icon svg{width:18px;height:18px}
.nocs-block__eyebrow{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--eu-text-muted)}
.nocs-block h3{font-size:15px;font-weight:700;margin:0;letter-spacing:-.01em;color:var(--eu-text-primary)}
.nocs-block > p{font-size:13px;color:var(--eu-text-muted);margin:0;line-height:1.5}
.nocs-block__links{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;border-top:1px dashed var(--eu-border);padding-top:10px}
.nocs-block__links li{font-size:12px;line-height:1.4}
.nocs-block__links a{color:var(--eu-text-secondary);text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.nocs-block__links a::before{content:"›";color:var(--eu-text-muted);font-size:14px;line-height:1}
.nocs-block__links a:hover{color:var(--eu-accent)}
.nocs-block__more{margin-top:auto;font-size:12px;font-weight:600;color:var(--eu-accent);display:inline-flex;align-items:center;gap:4px;padding-top:10px}
.nocs-block__more::after{content:"→";transition:transform .2s ease}
.nocs-block:hover .nocs-block__more::after{transform:translateX(3px)}

/* Per-block accent variants */
.nocs-block--start .nocs-block__icon{background:linear-gradient(135deg,rgba(21,73,150,.16),rgba(192,26,133,.12));color:var(--eu-accent)}
.nocs-block--ops .nocs-block__icon{background:rgba(39,174,96,.10);color:#1e7e34}
.nocs-block--proc .nocs-block__icon{background:rgba(192,26,133,.10);color:var(--eu-magenta)}
.nocs-block--legal .nocs-block__icon{background:rgba(74,32,144,.10);color:#4a2090}
.nocs-block--sla .nocs-block__icon{background:rgba(242,205,48,.16);color:#a07300}
.nocs-block--privacy .nocs-block__icon{background:rgba(157,198,184,.20);color:#1a6b4d}
.nocs-block--sod .nocs-block__icon{background:rgba(24,58,102,.10);color:#183A66}
.nocs-block--wallet .nocs-block__icon{background:rgba(91,155,230,.14);color:#3b76c4}
.eu-dark .nocs-block__icon{background:rgba(91,155,230,.14);color:var(--eu-accent-light)}
.eu-dark .nocs-block--ops .nocs-block__icon{background:rgba(94,200,158,.18);color:#5ec89e}
.eu-dark .nocs-block--proc .nocs-block__icon{background:rgba(232,74,173,.18);color:var(--eu-magenta)}
.eu-dark .nocs-block--privacy .nocs-block__icon{background:rgba(157,198,184,.16);color:#9dc6b8}

/* Activity row */
.nocs-activity{max-width:1200px;margin:48px auto;padding:0 24px;display:grid;grid-template-columns:1fr 320px;gap:24px}
@media (max-width:900px){.nocs-activity{grid-template-columns:1fr}}
.nocs-activity__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.nocs-activity__head h2{font-size:18px;font-weight:800;margin:0;color:var(--eu-text-primary)}
.nocs-activity__new{font-size:13px;font-weight:600;color:var(--eu-accent);text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.nocs-activity__new::after{content:"→";transition:transform .2s}
.nocs-activity__new:hover{color:var(--eu-accent-hover,var(--eu-accent))}
.nocs-activity__new:hover::after{transform:translateX(3px)}

.nocs-activity__side{display:flex;flex-direction:column;gap:14px}
.nocs-side-card{background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:12px;padding:18px}
.nocs-side-card__label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--eu-text-muted);display:block;margin-bottom:6px}
.nocs-side-card__title{font-size:15px;font-weight:700;margin:0 0 8px;color:var(--eu-text-primary);line-height:1.3}
.nocs-side-card__meta{font-size:13px;color:var(--eu-text-muted);margin:0 0 12px;line-height:1.5}
.nocs-side-card__cta{display:inline-block;background:transparent;color:var(--eu-accent);border:1px solid var(--eu-accent);padding:6px 14px;border-radius:8px;font-size:13px;font-weight:600;text-decoration:none;transition:background .15s,color .15s}
.nocs-side-card__cta:hover{background:var(--eu-accent);color:#fff}
.nocs-side-card--accent{background:linear-gradient(135deg,rgba(21,73,150,.04),rgba(192,26,133,.04));border-color:var(--eu-border-accent)}
.nocs-side-card--accent .nocs-side-card__cta{background:linear-gradient(135deg,#154996,#c01a85);color:#fff;border:none;padding:8px 16px}
.nocs-side-card--accent .nocs-side-card__cta:hover{filter:brightness(1.1)}
.eu-dark .nocs-side-card--accent{background:linear-gradient(135deg,rgba(91,155,230,.08),rgba(232,74,173,.08))}

/* ============================================================
 * User-panel dropdown — keep all items the same colour
 * regardless of :visited state (#10607).
 * The Copenhagen base sets a:visited to a separate visited
 * colour, which made some items render purple while others
 * stayed white in the user dropdown menu.
 * ============================================================ */
.dropdown-menu a,
.dropdown-menu a:link,
.dropdown-menu a:visited,
.user-nav a,
.user-nav a:link,
.user-nav a:visited,
[role="menuitem"],
[role="menuitem"]:visited{
  color:var(--eu-text-primary) !important;
}
.dropdown-menu a:hover,
.dropdown-menu a:focus,
.user-nav a:hover,
[role="menuitem"]:hover{
  color:var(--eu-accent) !important;
}
.eu-dark .dropdown-menu a,
.eu-dark .dropdown-menu a:visited,
.eu-dark .user-nav a,
.eu-dark .user-nav a:visited,
.eu-dark [role="menuitem"],
.eu-dark [role="menuitem"]:visited{
  color:var(--eu-text-primary) !important;
}
.eu-dark .dropdown-menu a:hover,
.eu-dark .user-nav a:hover,
.eu-dark [role="menuitem"]:hover{
  color:var(--eu-accent-light) !important;
}

/* ============================================================
 * Submit-request form: client-side required validation
 * (#10618 — form was submitting empty + redirecting to home)
 * ============================================================ */
.eu-field-invalid input,
.eu-field-invalid select,
.eu-field-invalid textarea,
.eu-field-invalid [role="combobox"],
.eu-field-invalid [data-garden-id*="forms"] > *:first-child{
  border-color:var(--eu-magenta) !important;
  box-shadow:0 0 0 3px rgba(192,26,133,.12) !important;
}
.eu-field-invalid label{color:var(--eu-magenta) !important}
.eu-field-error{
  display:flex;align-items:center;gap:6px;
  font-size:12px;font-weight:500;
  color:var(--eu-magenta);
  margin-top:6px;
}
/* #10613 — the previous SVG drew the exclamation-mark dot as a
   zero-length <line> (x1=12,x2=12.01) which renders as a broken
   half-stroke in Chromium-based browsers (Edge specifically) at
   14×14px. Replaced with a filled circle for the dot and a path
   for the bar so both shapes render crisply at any size. */
.eu-field-error::before{
  content:"";display:inline-block;width:14px;height:14px;flex-shrink:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23c01a85'><path d='M8 1.5a6.5 6.5 0 1 0 0 13A6.5 6.5 0 0 0 8 1.5zm-.85 3.25h1.7v4.75h-1.7V4.75zM8 12.5a.95.95 0 1 1 0-1.9.95.95 0 0 1 0 1.9z'/></svg>");
  background-size:contain;background-repeat:no-repeat;
}

/* ============================================================
 * Popular-this-month — CSS-driven numbering + 6-item cap.
 * Replaces the old 6 hardcoded `<a href="#">` placeholders that
 * scrolled the home page back to top (felt like a redirect-to-home
 * to users). Now the section is empty until promoted_articles has
 * real entries, and counter() generates the 01..06 prefix.
 * ============================================================ */
.t-pop__grid--counted{ counter-reset: tpop; }
.t-pop__grid--counted .t-pop__item{ counter-increment: tpop; }
.t-pop__grid--counted .t-pop__num::before{
  content: counter(tpop, decimal-leading-zero);
}
/* Cap visible items at 6 — Zendesk admin may promote more */
.t-pop__grid--counted .t-pop__item:nth-child(n+7){ display:none !important; }

/* ============================================================
 * Dark-mode CTA contrast safety net.
 * Force every prominent CTA + sign-in link to use explicit
 * readable colours in dark mode so they never inherit black-
 * on-dark from a parent or :visited rule.
 * ============================================================ */
html.eu-dark .eu-btn-submit,
html.eu-dark a.eu-btn-submit,
html.eu-dark .eu-btn-submit:link,
html.eu-dark .eu-btn-submit:visited,
html.eu-dark .eu-btn-submit:hover{
  color:#fff !important;
  text-shadow:0 1px 1px rgba(0,0,0,0.18);
}
/* Sign in link (header user-nav, when not signed in).
 * In dark mode the inherited body color was being beaten by
 * Copenhagen base styles → showed near-black on dark navbar. */
html.eu-dark .user-nav-list .sign-in,
html.eu-dark a.sign-in,
html.eu-dark .sign-in:link,
html.eu-dark .sign-in:visited,
html.eu-dark .sign-in:hover{
  color:var(--eu-text-primary) !important;
  background:transparent;
}
html.eu-dark .user-nav-list .sign-in:hover{
  background:var(--eu-bg-hover) !important;
  color:var(--eu-accent-light,var(--eu-accent)) !important;
}
/* Submit-request form button (any variant the form lib renders) */
html.eu-dark #new-request-form button[type="submit"],
html.eu-dark .eu-form-container button[type="submit"],
html.eu-dark .form button[type="submit"],
html.eu-dark [data-garden-id*="buttons.button"][data-garden-container-id*="primary"]{
  color:#fff !important;
  background:var(--eu-accent) !important;
}
/* Service Catalog / Hub primary tile CTAs */
html.eu-dark .eu-cat-card__cta,
html.eu-dark .eu-svc-card__cta,
html.eu-dark .nocs-quick__cta,
html.eu-dark .t-cta,
html.eu-dark .t-cta:link,
html.eu-dark .t-cta:visited{
  color:#fff !important;
}
/* Help-center search submit button (Zendesk's hidden default sometimes
 * surfaces with system colour in dark mode) */
html.eu-dark .search button[type="submit"],
html.eu-dark .search-full button[type="submit"]{
  color:#fff !important;
  background:var(--eu-accent) !important;
}
/* Generic backstop: any element whose role/class signals a primary CTA */
html.eu-dark a[role="button"][class*="primary"],
html.eu-dark button[class*="primary"]:not([disabled]){
  color:#fff !important;
}
/* Light mode "back to home" / outlined ghosts on dark hero
 * surfaces (article hero, community hero) — keep readable */
html.eu-dark .eu-art-hero__follow,
html.eu-dark .eu-art-hero__follow:link,
html.eu-dark .eu-art-hero__follow:visited,
html.eu-dark .eu-newsletter-sub,
html.eu-dark .eu-newsletter-sub:link,
html.eu-dark .eu-newsletter-sub:visited{
  color:#fff !important;
}

/* ============================================================
 * V2 — Force-hide legacy node-ops IDs we kept in DOM only so
 * _nopInit's textContent writes don't crash. `[hidden]` alone
 * is overridden by .eu-badge / .eu-node-card display rules.
 * ============================================================ */
#nop-node-card[hidden],
#nop-node-status[hidden],
#nop-org-name[hidden],
#nop-node-meta[hidden],
#nop-status-icon[hidden],
#nop-sla-fr[hidden],#nop-sla-nr[hidden],
#nop-sla-nop-fr[hidden],#nop-sla-nop-nr[hidden],#nop-sla-nop-crit[hidden],
#nop-sla-widget[hidden],#nop-sla-env-tabs[hidden],
#nop-node-health[hidden],#nop-node-health-grid[hidden],
#nop-action-summary[hidden],#nop-compliance-grid[hidden]{
  display:none !important;
}

/* ============================================================
 * V3 ticket-detail hero (request_page.hbs)
 * Court-coloured left rail, status/priority pills, hostname-tagged
 * title, court badge, SLA breach card, and a timeline ribbon.
 * Reads its data from the existing request_page.hbs IIFE that
 * already populates eu-req-sla-* — keeps a single source of truth.
 * ============================================================ */
:root,
html.eu-dark{
  --eu-v3-court-you: #c01a85;
  --eu-v3-court-you-bg: rgba(192,26,133,0.10);
  --eu-v3-court-us:  #1850b5;
  --eu-v3-court-us-bg:  rgba(24,80,181,0.08);
  --eu-v3-court-done: #2e8060;
  --eu-v3-court-done-bg: rgba(46,128,96,0.10);
}
html.eu-dark{
  --eu-v3-court-you-bg: rgba(232,74,173,0.14);
  --eu-v3-court-us-bg:  rgba(91,155,230,0.14);
  --eu-v3-court-done-bg: rgba(95,184,146,0.16);
}

/* The legacy <h1 class="request-title"> shows the same subject as our hero.
 * Hide it cleanly so the hero owns the title. */
.eu-v3-hide-legacy-title{ display:none !important; }
.eu-req-crumbs{ font-size:12px; color:var(--eu-text-muted); margin-bottom:10px; }

/* Hide the legacy "What this ticket is about" / "Response window: Breached"
 * context block — the V3 hero already owns this information (status pill,
 * hostname tag, breach card). Keeping it would duplicate the breach signal
 * for no UX benefit. */
#eu-req-context{ display:none !important; }

.eu-v3-thero{
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-left:4px solid var(--eu-v3-court-us);
  border-radius:12px;
  padding:20px 22px;
  margin-bottom:14px;
  box-shadow:var(--eu-shadow);
  position:relative; overflow:hidden;
}
.eu-v3-thero[data-court="you"]{ border-left-color:var(--eu-v3-court-you); }
.eu-v3-thero[data-court="done"]{ border-left-color:var(--eu-v3-court-done); }

.eu-v3-thero::before{
  content:''; position:absolute; right:-40px; top:-40px;
  width:240px; height:240px;
  background:radial-gradient(circle, var(--eu-v3-court-us-bg), transparent 65%);
  pointer-events:none;
}
.eu-v3-thero[data-court="you"]::before{
  background:radial-gradient(circle, var(--eu-v3-court-you-bg), transparent 65%);
}
.eu-v3-thero[data-court="done"]::before{
  background:radial-gradient(circle, var(--eu-v3-court-done-bg), transparent 65%);
}

.eu-v3-thero__inner{
  position:relative;
  display:grid; grid-template-columns:1fr auto;
  gap:20px; align-items:flex-start;
}
@media (max-width:780px){
  .eu-v3-thero__inner{ grid-template-columns:1fr; }
}
.eu-v3-thero__l{ min-width:0; }
.eu-v3-thero__crumb{
  display:flex; align-items:center; gap:8px;
  font-size:11px; color:var(--eu-text-muted);
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:0.04em; margin-bottom:8px; flex-wrap:wrap;
}
.eu-v3-thero__crumb-id{ color:var(--eu-text-secondary); font-weight:700; }
.eu-v3-thero__crumb-pill{
  padding:1px 8px; border-radius:4px;
  background:var(--eu-bg-secondary); color:var(--eu-text-secondary);
  font-weight:600;
}
.eu-v3-thero__crumb-pill.open{    background:rgba(24,80,181,0.10);  color:#1850b5; }
.eu-v3-thero__crumb-pill.pending{ background:rgba(242,180,30,0.16); color:#a87f00; }
.eu-v3-thero__crumb-pill.done{    background:rgba(46,128,96,0.12);  color:#2e7d62; }
.eu-v3-thero__crumb-pill.pri-urgent{ background:#fee2e2; color:#b91c1c; }
.eu-v3-thero__crumb-pill.pri-high  { background:#fef3c7; color:#92400e; }
.eu-v3-thero__crumb-pill.pri-normal{ background:#dcfce7; color:#15803d; }
.eu-v3-thero__crumb-pill.pri-low   { background:#f3f4f6; color:#6b7280; }
.eu-dark .eu-v3-thero__crumb-pill.open{ background:rgba(91,155,230,0.16); color:#5b9be6; }
.eu-dark .eu-v3-thero__crumb-pill.pending{ background:rgba(242,205,48,0.16); color:#dba300; }
.eu-dark .eu-v3-thero__crumb-pill.done{ background:rgba(95,184,146,0.16); color:#5fb892; }
.eu-dark .eu-v3-thero__crumb-pill.pri-urgent{ background:rgba(232,74,173,0.16); color:#e84aad; }

.eu-v3-thero__title{
  font-size:22px; font-weight:800; letter-spacing:-0.018em;
  line-height:1.25; color:var(--eu-text-primary);
  margin:0 0 6px 0;
}
.eu-v3-thero__title-tag{
  display:inline-block;
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:14px; font-weight:600;
  color:var(--eu-magenta); background:rgba(192,26,133,0.10);
  padding:2px 10px; border-radius:6px;
  vertical-align:2px; margin-right:6px;
}
.eu-v3-thero__sub{
  display:flex; align-items:center; gap:14px;
  font-size:12px; color:var(--eu-text-muted); flex-wrap:wrap;
}
.eu-v3-thero__sub-by{ display:flex; align-items:center; gap:6px; }
.eu-v3-thero__sub-avatar{
  width:18px; height:18px; border-radius:50%;
  background:linear-gradient(135deg,#a8c5e8,#d8a4cf);
}
.eu-v3-thero__sub strong{ color:var(--eu-text-secondary); font-weight:600; }

.eu-v3-thero__r{
  display:flex; flex-direction:column; align-items:flex-end; gap:8px;
  min-width:240px;
}
@media (max-width:780px){ .eu-v3-thero__r{ align-items:flex-start; min-width:0; } }
.eu-v3-thero__court{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border-radius:18px;
  font-size:12px; font-weight:700; letter-spacing:-0.005em;
  background:var(--eu-v3-court-us-bg); color:var(--eu-v3-court-us);
}
.eu-v3-thero[data-court="you"] .eu-v3-thero__court{ background:var(--eu-v3-court-you-bg); color:var(--eu-v3-court-you); }
.eu-v3-thero[data-court="done"] .eu-v3-thero__court{ background:var(--eu-v3-court-done-bg); color:var(--eu-v3-court-done); }
.eu-v3-thero__court-dot{
  width:7px; height:7px; border-radius:50%; background:currentColor;
  animation:euV3PulseSm 2s ease-in-out infinite;
}
@keyframes euV3PulseSm{
  0%,100%{ box-shadow:0 0 0 0 currentColor; opacity:1; }
  50%   { box-shadow:0 0 0 6px transparent; opacity:0.55; }
}

.eu-v3-thero__sla-card{
  background:linear-gradient(135deg, var(--eu-v3-court-us-bg), rgba(24,80,181,0.04));
  border:1px solid rgba(24,80,181,0.20);
  border-radius:10px; padding:10px 14px; min-width:220px;
}
.eu-v3-thero__sla-card[data-state="breach"]{
  background:linear-gradient(135deg, rgba(192,26,133,0.10), rgba(192,26,133,0.04));
  border-color:rgba(192,26,133,0.20);
}
.eu-v3-thero__sla-card[data-state="warn"]{
  background:linear-gradient(135deg, rgba(242,180,30,0.16), rgba(242,180,30,0.04));
  border-color:rgba(176,123,0,0.20);
}
.eu-v3-thero__sla-card[data-state="ok"]{
  background:linear-gradient(135deg, rgba(46,128,96,0.10), rgba(46,128,96,0.04));
  border-color:rgba(46,128,96,0.20);
}
.eu-v3-thero__sla-l{
  font-size:10px; font-weight:700; letter-spacing:0.10em;
  text-transform:uppercase;
  color:var(--eu-v3-court-us);
  margin-bottom:3px;
}
.eu-v3-thero__sla-card[data-state="breach"] .eu-v3-thero__sla-l{ color:var(--eu-magenta); }
.eu-v3-thero__sla-card[data-state="warn"]   .eu-v3-thero__sla-l{ color:#a87f00; }
.eu-v3-thero__sla-card[data-state="ok"]     .eu-v3-thero__sla-l{ color:#2e7d62; }
.eu-v3-thero__sla-v{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:22px; font-weight:800;
  color:var(--eu-v3-court-us);
  letter-spacing:-0.02em; line-height:1;
}
.eu-v3-thero__sla-card[data-state="breach"] .eu-v3-thero__sla-v{ color:var(--eu-magenta); }
.eu-v3-thero__sla-card[data-state="warn"]   .eu-v3-thero__sla-v{ color:#a87f00; }
.eu-v3-thero__sla-card[data-state="ok"]     .eu-v3-thero__sla-v{ color:#2e7d62; }
/* "Awaiting Europeum" — operator just replied; SLA is back on us. */
.eu-v3-thero__sla-card[data-state="awaiting"]{
  background:linear-gradient(135deg, rgba(24,80,181,0.10), rgba(24,80,181,0.03));
  border-color:rgba(24,80,181,0.20);
  animation: eu-v3-sla-fade .5s ease;
}
.eu-v3-thero__sla-card[data-state="awaiting"] .eu-v3-thero__sla-l{ color:#1850b5; }
.eu-v3-thero__sla-card[data-state="awaiting"] .eu-v3-thero__sla-v{ color:#1850b5; font-size:14px; font-family:inherit; font-weight:700; }
@keyframes eu-v3-sla-fade { from { transform:scale(.98); opacity:.6 } to { transform:scale(1); opacity:1 } }
.eu-v3-thero__sla-d{ font-size:11px; color:var(--eu-text-muted); margin-top:4px; }

/* Timeline ribbon */
.eu-v3-thero__timeline{
  margin-top:18px; padding-top:16px;
  border-top:1px solid var(--eu-border);
  position:relative;
}
.eu-v3-thero__tl-l{
  font-size:10px; font-weight:700; letter-spacing:0.10em;
  text-transform:uppercase; color:var(--eu-text-muted);
  margin-bottom:10px;
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.eu-v3-thero__tl-rail{
  position:relative; height:8px;
  background:var(--eu-bg-secondary); border-radius:4px; overflow:visible;
}
.eu-v3-thero__tl-rail-f{
  position:absolute; left:0; top:0; bottom:0;
  background:linear-gradient(90deg, #2e7d62, #a87f00, var(--eu-magenta));
  border-radius:4px;
  transition:width 1s cubic-bezier(0.2,0.7,0.3,1);
}
.eu-v3-thero__tl-breach{
  position:absolute; top:-3px; bottom:-3px;
  width:2.5px; background:var(--eu-magenta); border-radius:2px;
  box-shadow:0 0 0 3px rgba(192,26,133,0.18);
}
.eu-v3-thero__tl-now{
  position:absolute; top:-6px;
  width:14px; height:14px; border-radius:50%;
  background:var(--eu-bg-card);
  border:3px solid var(--eu-v3-court-us);
  box-shadow:0 2px 6px rgba(24,80,181,0.30);
  transform:translateX(-50%);
  transition:left 1s cubic-bezier(0.2,0.7,0.3,1);
}
.eu-v3-thero[data-court="you"] .eu-v3-thero__tl-now{
  border-color:var(--eu-magenta);
  box-shadow:0 2px 6px rgba(192,26,133,0.40);
  animation:euV3NowPulse 2s ease-in-out infinite;
}
@keyframes euV3NowPulse{
  50%{ box-shadow:0 0 0 6px rgba(192,26,133,0.20); }
}

/* Conversation polish — pull court colours into avatar gradients */
.comment-list .comment{
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:10px;
  margin-bottom:10px;
  padding:14px 16px;
  box-shadow:var(--eu-shadow-sm,var(--eu-shadow));
}
.comment-list .comment-author{ align-items:center; }
.comment-list .icon-agent{ color:var(--eu-v3-court-us); }
.comment-list .comment .comment-author .icon-agent + .user-avatar{
  outline:2px solid var(--eu-v3-court-us-bg);
}

/* ── V3 inline Linked Node card ─────────────────────────────
 * Sits between the V3 hero and the conversation thread. Shows
 * the operator at a glance: which node is affected, what env,
 * status, SLA, and (for cert tickets) days-remaining mini-bar.
 * Data is derived from the ticket's own custom fields + the
 * SLA matrix — no extra API calls required. */
.eu-v3-nodecard{
  background:var(--eu-bg-card, #fff);
  border:1px solid var(--eu-border, #e8e2ec);
  border-radius:12px;
  padding:16px 18px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  align-items:center;
  margin:14px 0;
  box-shadow:var(--eu-shadow, 0 1px 2px rgba(32,12,54,.04));
}
.eu-v3-nodecard__l{ min-width:0; }
.eu-v3-nodecard__eb{
  display:inline-flex; align-items:center; gap:6px;
  font-size:10px; font-weight:700; letter-spacing:.10em;
  text-transform:uppercase; color:var(--eu-muted, #6b7280);
  margin-bottom:6px;
}
.eu-v3-nodecard__name{
  font-family:ui-monospace, "JetBrains Mono", SFMono-Regular, Menlo, monospace;
  font-size:16px; font-weight:700; letter-spacing:-0.01em;
  color:var(--eu-text-primary, #200c36);
  word-break:break-all;
}
.eu-v3-nodecard__chips{
  display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;
}
.eu-v3-nodecard__chip{
  display:inline-flex; align-items:center; gap:6px;
  height:22px; padding:0 9px;
  border:1px solid var(--eu-border, #e8e2ec);
  border-radius:11px;
  background:#fff;
  font-size:11px; font-weight:600;
  color:var(--eu-text-primary, #200c36);
}
.eu-v3-nodecard__chip-dot{
  width:6px; height:6px; border-radius:50%;
  background:#9ca3af; flex-shrink:0;
}
.eu-v3-nodecard__chip--prod{    background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
.eu-v3-nodecard__chip--prod .eu-v3-nodecard__chip-dot{ background:#10b981; }
.eu-v3-nodecard__chip--preprod{ background:#fffbeb; border-color:#fde68a; color:#854d0e; }
.eu-v3-nodecard__chip--preprod .eu-v3-nodecard__chip-dot{ background:#f59e0b; }
.eu-v3-nodecard__chip--pilot{   background:#eff6ff; border-color:#bfdbfe; color:#1e40af; }
.eu-v3-nodecard__chip--pilot .eu-v3-nodecard__chip-dot{ background:#3b82f6; }
.eu-v3-nodecard__chip--more{    background:#faf5ff; border-color:#e9d5ff; color:#6b21a8; cursor:help; }
.eu-v3-nodecard__chip--pri-urgent{ background:#fee2e2; border-color:#fecaca; color:#b91c1c; }
.eu-v3-nodecard__chip--pri-high{   background:#fef3c7; border-color:#fde68a; color:#92400e; }
.eu-v3-nodecard__chip--pri-normal{ background:#dcfce7; border-color:#bbf7d0; color:#15803d; }
.eu-v3-nodecard__chip--pri-low{    background:#f3f4f6; border-color:#e5e7eb; color:#6b7280; }
.eu-v3-nodecard__src{
  font-size:10px; color:var(--eu-muted, #6b7280); margin-top:8px;
  font-style:italic;
}
.eu-v3-nodecard__src strong{ color:var(--eu-text-primary, #200c36); font-weight:600; font-style:normal; }
.eu-v3-nodecard__r{
  display:flex; flex-direction:column; align-items:flex-end; gap:6px;
  min-width:170px;
}
.eu-v3-nodecard__cert{
  display:flex; align-items:center; gap:8px;
  font-size:11px; color:var(--eu-muted, #6b7280);
}
.eu-v3-nodecard__cert-d{
  font-family:ui-monospace, "JetBrains Mono", SFMono-Regular, Menlo, monospace;
  font-weight:700; font-size:13px;
}
.eu-v3-nodecard__cert-d.ok{   color:#059669; }
.eu-v3-nodecard__cert-d.warn{ color:#d97706; }
.eu-v3-nodecard__cert-d.crit{ color:#c01a85; }
.eu-v3-nodecard__cert-bar{
  position:relative; width:160px; height:6px;
  background:#f1eef4; border-radius:3px; overflow:hidden;
}
.eu-v3-nodecard__cert-bar-f{
  position:absolute; left:0; top:0; bottom:0;
  background:linear-gradient(90deg,#10b981 0%, #f59e0b 60%, #c01a85 100%);
  border-radius:3px;
  transition:width .4s ease;
}
.eu-v3-nodecard__cert-meta{
  font-size:10px; color:var(--eu-muted, #6b7280);
  font-family:ui-monospace, "JetBrains Mono", SFMono-Regular, Menlo, monospace;
}
@media (max-width: 720px){
  .eu-v3-nodecard{ grid-template-columns:1fr; }
  .eu-v3-nodecard__r{ align-items:flex-start; min-width:0; }
}

/* ── V3 reply composer wrapper ──────────────────────────────
 * Court-coloured pink header above the form, "QUICK REPLIES"
 * chip row, and "Your move" footer pill below the form.
 * Wraps Zendesk's server-rendered comment form without replacing
 * it. */
.eu-v3-comp{
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:12px;
  overflow:hidden;
  margin-top:14px;
  box-shadow:var(--eu-shadow);
}
.eu-v3-comp form{
  border:none !important;
  background:transparent !important;
  margin:0 !important;
}
.eu-v3-comp-head{
  display:flex; align-items:center; gap:10px;
  padding:12px 18px;
  border-bottom:1px solid var(--eu-border);
  background:linear-gradient(135deg, var(--eu-v3-court-you-bg), transparent);
}
.eu-v3-comp-head__i{
  width:24px; height:24px; border-radius:7px;
  background:var(--eu-v3-court-you); color:#fff;
  display:grid; place-items:center; flex-shrink:0;
}
.eu-v3-comp-head__t{
  font-size:13px; font-weight:700;
  color:var(--eu-v3-court-you);
  letter-spacing:-0.005em;
}
.eu-v3-comp-head__r{
  margin-left:auto;
  font-size:11px; color:var(--eu-text-muted);
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:0.04em;
}
.eu-v3-comp[data-court="us"] .eu-v3-comp-head{
  background:linear-gradient(135deg, var(--eu-v3-court-us-bg), transparent);
}
.eu-v3-comp[data-court="us"] .eu-v3-comp-head__i{ background:var(--eu-v3-court-us); }
.eu-v3-comp[data-court="us"] .eu-v3-comp-head__t{ color:var(--eu-v3-court-us); }

/* Quick-replies chip row */
.eu-v3-comp-quick{
  display:flex; align-items:center; gap:8px;
  padding:10px 16px;
  border-bottom:1px solid var(--eu-border);
  background:var(--eu-bg-secondary);
  flex-wrap:wrap;
}
.eu-v3-comp-quick__l{
  font-size:10px; font-weight:700;
  letter-spacing:0.10em; text-transform:uppercase;
  color:var(--eu-text-muted);
  margin-right:4px;
}
.eu-v3-comp-quick__btn{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 12px;
  font-size:11px; font-weight:600;
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:7px;
  color:var(--eu-text-secondary);
  cursor:pointer;
  font-family:inherit;
  transition:all var(--eu-dur) var(--eu-ease);
}
.eu-v3-comp-quick__btn:hover{
  border-color:var(--eu-accent);
  color:var(--eu-accent);
  background:rgba(24,80,181,0.04);
}
.eu-v3-comp-quick__btn svg{
  flex-shrink:0;
  color:var(--eu-text-muted);
  transition:color var(--eu-dur) var(--eu-ease);
}
.eu-v3-comp-quick__btn:hover svg{ color:var(--eu-accent); }
.eu-dark .eu-v3-comp-quick__btn:hover{ background:rgba(91,155,230,0.10); }
/* Flash green when a quick reply fires (text was injected into editor) */
.eu-v3-comp-quick__btn--just-fired{
  border-color:#2e7d62 !important;
  color:#2e7d62 !important;
  background:rgba(46,128,96,0.08) !important;
  animation:eu-v3-quick-flash 0.6s ease-out;
}
.eu-v3-comp-quick__btn--just-fired svg{ color:#2e7d62 !important; }
@keyframes eu-v3-quick-flash{
  0%   { transform:scale(1);    box-shadow:0 0 0 0 rgba(46,128,96,0.30); }
  40%  { transform:scale(1.04); box-shadow:0 0 0 6px rgba(46,128,96,0.18); }
  100% { transform:scale(1);    box-shadow:0 0 0 0 rgba(46,128,96,0); }
}

/* Footer with court pill + descriptive copy */
.eu-v3-comp-foot{
  display:flex; align-items:center; gap:10px;
  padding:12px 16px;
  border-top:1px solid var(--eu-border);
  background:var(--eu-bg-secondary);
  flex-wrap:wrap;
}
.eu-v3-comp-foot__pill{
  display:inline-flex; align-items:center; gap:5px;
  padding:3px 10px; border-radius:11px;
  font-size:11px; font-weight:700;
  letter-spacing:-0.005em;
}
.eu-v3-comp-foot__pill.you{
  background:var(--eu-v3-court-you-bg);
  color:var(--eu-v3-court-you);
}
.eu-v3-comp-foot__pill.us{
  background:var(--eu-v3-court-us-bg);
  color:var(--eu-v3-court-us);
}
.eu-v3-comp-foot__copy{
  font-size:12px; color:var(--eu-text-muted);
}

/* ── Reply form: gradient Submit button matching the design ──
 * Zendesk renders the new-comment form server-side. The submit
 * button is a plain <input type="submit"> or <button type="submit">
 * inside the request comment form. Restyle it as a brand-gradient
 * pill, with a leading paper-plane icon, to match V3 ticket-detail. */
.request-page form button[type="submit"],
.request-page form input[type="submit"],
#request-form button[type="submit"],
#new-comment-submit,
form#new_request button[type="submit"],
.comment-form button[type="submit"],
.request-form-submit-buttons button[type="submit"]{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:10px 22px !important;
  border-radius:9px !important;
  border:none !important;
  background:linear-gradient(120deg,#1850b5 0%,#5b3a8a 50%,#c01a85 100%) !important;
  color:#fff !important;
  font-weight:700 !important;
  font-size:13px !important;
  letter-spacing:-0.005em !important;
  box-shadow:0 4px 14px rgba(192,26,133,0.20) !important;
  cursor:pointer !important;
  transition:transform var(--eu-dur) var(--eu-ease), box-shadow var(--eu-dur) var(--eu-ease), filter var(--eu-dur) var(--eu-ease) !important;
}
.request-page form button[type="submit"]:hover,
#request-form button[type="submit"]:hover,
form#new_request button[type="submit"]:hover,
.comment-form button[type="submit"]:hover,
.request-form-submit-buttons button[type="submit"]:hover{
  transform:translateY(-1px);
  filter:brightness(1.05);
  box-shadow:0 6px 20px rgba(192,26,133,0.30) !important;
}
.request-page form button[type="submit"]:active,
#request-form button[type="submit"]:active,
form#new_request button[type="submit"]:active{
  transform:translateY(0);
}
/* Leading paper-plane icon, baked into the button via SVG mask so it
 * recolours with the text and doesn't depend on a CSS sprite. */
.request-page form button[type="submit"]::before,
#request-form button[type="submit"]::before,
form#new_request button[type="submit"]::before,
.comment-form button[type="submit"]::before{
  content:'';
  display:inline-block;
  width:14px; height:14px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linejoin='round' stroke-linecap='round'><path d='m22 2-7 20-4-9-9-4 20-7Z'/></svg>") no-repeat center / contain;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linejoin='round' stroke-linecap='round'><path d='m22 2-7 20-4-9-9-4 20-7Z'/></svg>") no-repeat center / contain;
  flex-shrink:0;
}

/* Save-draft / secondary buttons in the same form: ghost outlined */
.request-page form button[type="button"],
#request-form button[type="button"],
form#new_request button[type="button"]:not(.eu-v3-thero__court):not(.action__step-cta){
  background:var(--eu-bg-card) !important;
  color:var(--eu-text-secondary) !important;
  border:1px solid var(--eu-border) !important;
  border-radius:9px !important;
  padding:10px 18px !important;
  font-weight:600 !important;
  font-size:13px !important;
}
.request-page form button[type="button"]:hover,
#request-form button[type="button"]:hover,
form#new_request button[type="button"]:hover{
  background:var(--eu-bg-hover) !important;
  border-color:var(--eu-border-strong,var(--eu-border)) !important;
}

/* ============================================================
 * V3 — kill-switch for all legacy V2 surfaces.
 * The earlier V2 work used `display:flex !important` and similar,
 * which beat the `[hidden]` attribute on the legacy banners.
 * Force them down with matching specificity so V3 stands alone.
 * ============================================================ */
.eu-v2-banner[hidden],
.eu-v2-meter[hidden],
.eu-sla-matrix[hidden],
.eu-action-summary[hidden],
.eu-sla-widget[hidden],
.eu-node-card[hidden],
.eu-sla-compliance[hidden]{ display:none !important; }

/* Unconditional hide — these legacy elements have JS that strips the
 * `hidden` attribute on every refreshAll, so attribute-based hiding loses
 * the race. ID-based selector wins regardless of inline style.            */
#nop-node-status,
#nop-org-name,
#nop-node-meta,
#nop-status-icon,
#nop-node-card{ display:none !important; }
/* Belt-and-braces: every V2 surface that was meant to live below the
 * V3 layout. Using strong selectors so any inline style or !important
 * from earlier rounds still loses. */
#nop-v3-fleet ~ .eu-v2-banner,
#nop-v3-fleet ~ .eu-sla-matrix,
#nop-v3-fleet ~ .eu-sla-compliance,
#panel-node-ops > .eu-v2-banner,
#panel-node-ops > .eu-sla-matrix,
#panel-node-ops > .eu-sla-compliance,
#panel-node-ops > #nop-compliance{ display:none !important; }

/* ============================================================
 * V3 redesign — dark fleet hero + Whose Court + urgent banner
 * Mirrors node-ops-redesign.html. Sits above the V2 surfaces;
 * the V2 banner is hidden via [hidden] but kept in DOM for
 * legacy ID compatibility with the live _nopInit JS.
 *
 * Court colour system:
 *   --court-you   warm magenta, operator must act
 *   --court-us    cool blue,    Europeum is acting
 * ============================================================ */
:root,
html.eu-dark{
  --court-you: var(--eu-magenta);
  --court-you-bg: rgba(192,26,133,0.10);
  --court-us:  var(--eu-accent);
  --court-us-bg:  rgba(24,80,181,0.08);
}
html.eu-dark{
  --court-you-bg: rgba(232,74,173,0.14);
  --court-us-bg:  rgba(91,155,230,0.14);
}

/* ── Fleet hero ──────────────────────────────────────────────── */
.eu-v3-fleet{
  background:linear-gradient(135deg,#1a0f2e 0%, #2a1750 50%, #3a1a55 100%);
  color:#fff; border-radius:14px; padding:22px 24px 0;
  margin-bottom:14px; position:relative; overflow:hidden;
  box-shadow:0 1px 2px rgba(20,10,40,0.06), 0 8px 24px rgba(20,10,40,0.10);
}
.eu-v3-fleet::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 85% -10%, rgba(192,26,133,0.30), transparent 50%),
             radial-gradient(circle at 5% 110%, rgba(24,80,181,0.30), transparent 50%);
  pointer-events:none;
}
.eu-v3-fleet__inner{ position:relative; }
.eu-v3-fleet__top{
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:18px; gap:24px; flex-wrap:wrap;
}
.eu-v3-fleet__t-l{ display:flex; flex-direction:column; gap:4px; }
.eu-v3-fleet__eyebrow{
  font-size:11px; font-weight:700; letter-spacing:0.12em;
  text-transform:uppercase; color:rgba(255,255,255,0.55);
  display:flex; align-items:center; gap:8px;
}
.eu-v3-fleet__eyebrow-dot{
  width:7px; height:7px; border-radius:50%;
  background:#7eea9e; box-shadow:0 0 0 3px rgba(126,234,158,0.30);
  animation:euV3Pulse 2.4s ease-in-out infinite;
}
@keyframes euV3Pulse{ 50%{ box-shadow:0 0 0 8px rgba(126,234,158,0); } }
.eu-v3-fleet__title{
  font-size:28px; font-weight:800; letter-spacing:-0.02em;
  line-height:1.05; display:flex; align-items:baseline; gap:14px;
}
.eu-v3-fleet__title-num{
  font-size:64px; font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-weight:800; letter-spacing:-0.04em; line-height:0.9;
  background:linear-gradient(180deg,#fff 0%, rgba(255,255,255,0.78) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  display:inline-block;
}
.eu-v3-fleet__title-rest{ font-weight:600; color:rgba(255,255,255,0.85); }
.eu-v3-fleet__sub{ font-size:13px; color:rgba(255,255,255,0.65); margin-top:2px; }

.eu-v3-fleet__t-r{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.eu-v3-fleet__live{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border:1px solid rgba(126,234,158,0.40);
  background:rgba(126,234,158,0.08); border-radius:20px;
  font-size:12px; font-weight:600; color:#a8f5c2;
}
.eu-v3-fleet__live-i{
  width:6px; height:6px; border-radius:50%;
  background:#7eea9e; animation:euV3Pulse 2.4s ease-in-out infinite;
}
.eu-v3-fleet__cta{
  padding:9px 16px; background:#fff; color:#1a0f2e !important;
  border:none; border-radius:8px; font-size:13px; font-weight:700;
  display:inline-flex; align-items:center; gap:7px;
  box-shadow:0 4px 14px rgba(0,0,0,0.20);
  text-decoration:none !important;
  transition:transform var(--eu-dur) var(--eu-ease);
}
.eu-v3-fleet__cta:hover{ transform:translateY(-1px); color:#1a0f2e !important; }

.eu-v3-fleet__nodes{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:10px; padding-bottom:18px;
}
@media (max-width:900px){ .eu-v3-fleet__nodes{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .eu-v3-fleet__nodes{ grid-template-columns:1fr; } }

.eu-v3-node{
  background:rgba(255,255,255,0.06); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.12); border-radius:11px;
  padding:13px 14px; cursor:pointer;
  transition:all 0.18s cubic-bezier(0.2,0.7,0.3,1);
  position:relative; overflow:hidden;
}
.eu-v3-node:hover{
  background:rgba(255,255,255,0.10);
  transform:translateY(-2px);
  border-color:rgba(255,255,255,0.22);
}
.eu-v3-node__hd{ display:flex; align-items:center; gap:8px; margin-bottom:9px; }
.eu-v3-node__pill{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:9px; font-weight:700; letter-spacing:0.06em;
  text-transform:uppercase; padding:2px 7px; border-radius:4px;
}
.eu-v3-node__pill.prod{    background:rgba(126,234,158,0.18); color:#7eea9e; }
.eu-v3-node__pill.preprod{ background:rgba(242,180,30,0.18); color:#f2cd30; }
.eu-v3-node__pill.pilot{   background:rgba(168,197,232,0.18); color:#a8c5e8; }
.eu-v3-node__sync{
  margin-left:auto; display:inline-flex; align-items:center; gap:5px;
  font-size:10px; font-weight:600;
}
.eu-v3-node__sync-dot{ width:6px; height:6px; border-radius:50%; }
.eu-v3-node__sync.ok{ color:#a8f5c2; }
.eu-v3-node__sync.ok .eu-v3-node__sync-dot{ background:#7eea9e; box-shadow:0 0 6px rgba(126,234,158,0.6); }
.eu-v3-node__name{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13px; font-weight:600; color:#fff;
  margin-bottom:6px; letter-spacing:-0.01em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.eu-v3-node__meta{
  display:flex; align-items:center; gap:10px;
  font-size:11px; color:rgba(255,255,255,0.60);
}

/* Per-node SLA mini-strip — gives each node card its own "what SLA do I run under" answer */
.eu-v3-node__sla{
  margin-top:10px; padding-top:10px;
  border-top:1px solid rgba(255,255,255,0.10);
}
.eu-v3-node__sla-h{
  font-size:9.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase;
  color:rgba(255,255,255,0.55); margin-bottom:6px;
}
.eu-v3-node__sla-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:6px;
}
.eu-v3-node__sla-c{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:5px 2px; border-radius:6px;
  background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08);
  min-height:42px;
}
.eu-v3-node__sla-c.urgent{ border-left:2px solid #c01a85; }
.eu-v3-node__sla-c.high  { border-left:2px solid #e6b300; }
.eu-v3-node__sla-c.normal{ border-left:2px solid #4fc37a; }
.eu-v3-node__sla-c.low   { border-left:2px solid rgba(255,255,255,0.35); }
.eu-v3-node__sla-l{
  font-size:9px; font-weight:700; letter-spacing:0.06em;
  color:rgba(255,255,255,0.55); margin-bottom:1px;
}
.eu-v3-node__sla-v{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px; font-weight:700; color:#fff; letter-spacing:-0.01em;
}
.eu-v3-node[role="button"]:hover{
  background:rgba(255,255,255,0.04);
  border-color:rgba(255,255,255,0.22);
  transition:background 120ms ease, border-color 120ms ease;
}
.eu-v3-node[role="button"]:focus-visible{
  outline:2px solid #c01a85; outline-offset:2px;
}

.eu-v3-fleet__empty{
  grid-column:1 / -1;
  padding:24px; text-align:center;
  color:rgba(255,255,255,0.55); font-size:12px;
  border:1px dashed rgba(255,255,255,0.18); border-radius:11px;
}

/* ── Urgent banner (court=you breaching) ───────────────────── */
.eu-v3-urgent{
  display:flex; align-items:center; gap:12px;
  padding:12px 18px;
  background:linear-gradient(90deg, var(--court-you-bg) 0%, transparent 100%);
  border:1px solid rgba(192,26,133,0.20);
  border-radius:10px; margin-bottom:10px;
}
.eu-v3-urgent[hidden]{ display:none; }
.eu-v3-urgent__i{
  width:32px; height:32px; border-radius:8px;
  background:var(--court-you); color:#fff;
  display:grid; place-items:center; flex-shrink:0;
}
.eu-v3-urgent__t{
  font-size:13px; font-weight:700;
  color:var(--court-you); letter-spacing:-0.005em;
}
.eu-v3-urgent__d{
  font-size:12px; color:var(--eu-text-secondary); margin-top:1px;
}
.eu-v3-urgent__d strong{ color:var(--court-you); font-weight:700; }
.eu-v3-urgent__cta{
  margin-left:auto; padding:7px 14px;
  background:var(--court-you); color:#fff !important;
  border:none; border-radius:7px;
  font-size:12px; font-weight:600;
  display:inline-flex; align-items:center; gap:6px;
  text-decoration:none !important;
  transition:filter var(--eu-dur) var(--eu-ease);
}
.eu-v3-urgent__cta:hover{ filter:brightness(0.95); color:#fff !important; }

/* ── Whose Court panel ─────────────────────────────────────── */
.eu-v3-court{
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:14px; padding:0;
  margin-bottom:14px; overflow:hidden;
  box-shadow:var(--eu-shadow);
}
.eu-v3-court__hd{
  padding:14px 20px; display:flex; align-items:center; gap:12px;
  border-bottom:1px solid var(--eu-border);
}
.eu-v3-court__hd-t{ font-size:14px; font-weight:700; color:var(--eu-text-primary); letter-spacing:-0.005em; }
.eu-v3-court__hd-sub{ font-size:12px; color:var(--eu-text-muted); }

.eu-v3-court__body{ display:grid; grid-template-columns:1fr 1.2fr; gap:0; }
@media (max-width:900px){ .eu-v3-court__body{ grid-template-columns:1fr; } .eu-v3-court__viz{ border-right:none !important; border-bottom:1px solid var(--eu-border); } }

.eu-v3-court__viz{
  padding:22px; border-right:1px solid var(--eu-border);
  position:relative;
  background:linear-gradient(180deg, rgba(0,0,0,0.015), transparent);
}
.eu-dark .eu-v3-court__viz{ background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent); }
.eu-v3-court__bar-l{
  font-size:11px; font-weight:700; letter-spacing:0.10em;
  text-transform:uppercase; color:var(--eu-text-muted);
  margin-bottom:10px; display:flex; justify-content:space-between;
}
.eu-v3-court__bar-l .you-l{ color:var(--court-you); }
.eu-v3-court__bar-l .us-l{  color:var(--court-us);  }
.eu-v3-court__bar{
  height:64px; border-radius:14px; display:flex; overflow:hidden;
  border:1px solid var(--eu-border);
  box-shadow: 0 4px 14px rgba(32,12,54,.08);
}
.eu-v3-court__bar-seg{
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; letter-spacing:-0.015em;
  position:relative;
  transition:flex-basis 0.6s cubic-bezier(0.2,0.7,0.3,1), filter .15s ease;
}
.eu-v3-court__bar-seg:hover{ filter:brightness(1.07); }
.eu-v3-court__bar-seg.you{ background:linear-gradient(135deg, #ec1a8e 0%, #b1126a 60%, #7a0c4a 100%); }
.eu-v3-court__bar-seg.us{  background:linear-gradient(135deg, #2563eb 0%, #1e40af 60%, #1e3a8a 100%); }
/* Pulsing dot in the leading edge of each segment so the user sees
 * "active waiting state" not a static graphic. */
.eu-v3-court__bar-seg::before{
  content:''; position:absolute; top:10px; left:14px;
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,.95);
  box-shadow:0 0 0 0 rgba(255,255,255,.55);
  animation: eu-court-pulse 2.2s ease-out infinite;
}
.eu-v3-court__bar-seg.us::before{ animation-delay:1.1s; }
@keyframes eu-court-pulse{
  0%   { box-shadow:0 0 0 0   rgba(255,255,255,.55); }
  70%  { box-shadow:0 0 0 10px rgba(255,255,255,0); }
  100% { box-shadow:0 0 0 0   rgba(255,255,255,0); }
}
.eu-v3-court__bar-seg-num{
  font-size:24px;
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  line-height:1;
}
.eu-v3-court__bar-seg-l{
  font-size:10px; font-weight:700; letter-spacing:0.08em;
  text-transform:uppercase; opacity:0.82; margin-left:8px;
}
.eu-v3-court__bar-foot{
  display:flex; justify-content:space-between;
  font-size:11px; margin-top:10px;
}
.eu-v3-court__bar-foot .you{ color:var(--court-you); font-weight:600; }
.eu-v3-court__bar-foot .us{  color:var(--court-us);  font-weight:600; }
.eu-v3-court__bar-foot strong{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* CTA row beneath the court bar — left: triage your court, right: track us */
.eu-v3-court__cta-row{
  display:flex; gap:8px; margin-top:18px;
}
@media (max-width:560px){ .eu-v3-court__cta-row{ flex-direction:column; } }
.eu-v3-court__cta{
  flex:1; display:flex; align-items:center; gap:10px;
  padding:11px 12px; border-radius:9px;
  border:1px solid; font-size:12px; font-weight:600;
  letter-spacing:-0.005em;
  background:var(--eu-bg-card); cursor:pointer;
  text-decoration:none !important;
  transition:all var(--eu-dur) var(--eu-ease);
}
.eu-v3-court__cta.you{
  border-color:rgba(192,26,133,0.30);
  color:var(--court-you);
  background:rgba(192,26,133,0.04);
}
.eu-v3-court__cta.you:hover{
  background:rgba(192,26,133,0.10);
  transform:translateY(-1px);
  color:var(--court-you);
}
.eu-v3-court__cta.us{
  border-color:rgba(24,80,181,0.30);
  color:var(--court-us);
  background:rgba(24,80,181,0.04);
}
.eu-v3-court__cta.us:hover{
  background:rgba(24,80,181,0.10);
  transform:translateY(-1px);
  color:var(--court-us);
}
.eu-v3-court__cta-i{
  width:24px; height:24px; border-radius:6px;
  display:grid; place-items:center; flex-shrink:0;
  font-weight:700; color:#fff;
}
.eu-v3-court__cta.you .eu-v3-court__cta-i{ background:var(--court-you); }
.eu-v3-court__cta.us  .eu-v3-court__cta-i{ background:var(--court-us);  }
.eu-v3-court__cta-b{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.eu-v3-court__cta-t{ font-weight:600; }
.eu-v3-court__cta-d{
  font-weight:500; font-size:10.5px;
  color:var(--eu-text-muted); letter-spacing:0;
}

/* SLA targets sub-panel */
.eu-v3-court__sla{ padding:18px 22px; }
.eu-v3-court__sla-hd{
  display:flex; align-items:center; gap:10px;
  margin-bottom:12px; flex-wrap:wrap;
}
.eu-v3-court__sla-t{ font-size:13px; font-weight:700; color:var(--eu-text-primary); }
.eu-v3-court__sla-sub{ font-size:11px; color:var(--eu-text-muted); }
.eu-v3-court__sla-seg{
  margin-left:auto; display:inline-flex;
  background:var(--eu-bg-secondary); border-radius:7px; padding:3px; gap:2px;
}
.eu-v3-court__sla-seg button{
  padding:5px 11px; font-size:11px; font-weight:600;
  color:var(--eu-text-muted); background:transparent;
  border:none; border-radius:5px; cursor:pointer;
  font-family:inherit;
  transition:all var(--eu-dur) var(--eu-ease);
}
.eu-v3-court__sla-seg button.is-on{
  background:var(--eu-bg-card); color:var(--eu-text-primary);
  box-shadow:0 1px 3px rgba(0,0,0,0.08);
}
.eu-v3-court__sla-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:8px;
}
@media (max-width:720px){ .eu-v3-court__sla-grid{ grid-template-columns:repeat(2,1fr); } }
.eu-v3-sla-cell{
  padding:12px 12px 14px; border-radius:9px;
  border:1px solid var(--eu-border); background:var(--eu-bg-card);
  position:relative; overflow:hidden;
  transition:transform 0.18s, box-shadow 0.18s;
}
.eu-v3-sla-cell:hover{ transform:translateY(-2px); box-shadow:0 4px 12px rgba(20,10,40,0.08); }
.eu-v3-sla-cell::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:3px; }
.eu-v3-sla-cell.p1::before{ background:var(--eu-magenta); }
.eu-v3-sla-cell.p2::before{ background:#dba300; }
.eu-v3-sla-cell.p3::before{ background:#2e8060; }
.eu-v3-sla-cell.p4::before{ background:var(--eu-text-muted); }
.eu-v3-sla-cell__pri{
  font-size:10px; font-weight:700; letter-spacing:0.08em;
  text-transform:uppercase;
  display:flex; align-items:center; gap:6px;
}
.eu-v3-sla-cell__pri span{ display:inline-block; width:6px; height:6px; border-radius:50%; background:currentColor; }
.eu-v3-sla-cell.p1 .eu-v3-sla-cell__pri{ color:var(--eu-magenta); }
.eu-v3-sla-cell.p2 .eu-v3-sla-cell__pri{ color:#a87f00; }
.eu-v3-sla-cell.p3 .eu-v3-sla-cell__pri{ color:#2e8060; }
.eu-v3-sla-cell.p4 .eu-v3-sla-cell__pri{ color:var(--eu-text-muted); }
.eu-v3-sla-cell__v{
  font-size:24px;
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-weight:800; letter-spacing:-0.02em;
  margin-top:4px; color:var(--eu-text-primary);
}
.eu-v3-sla-cell__d{
  font-size:10.5px; color:var(--eu-text-muted); margin-top:3px;
}

/* Whose-court chip — prefixed to the "What's happening" cell so the
 * operator sees who has the ball at a glance, independent of status. */
.eu-court-chip{
  display:inline-flex; align-items:center;
  height:20px; padding:0 8px;
  border-radius:10px;
  font-size:10px; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase;
  margin-right:4px; vertical-align:middle;
}
.eu-court-chip--you  { background:#fde7f4; color:#b91367; }
.eu-court-chip--us   { background:#dceaff; color:#1850b5; }
.eu-court-chip--done { background:#dcfce7; color:#15803d; }

/* Whole row is clickable — see renderTable() handler. Visual cue:
 * cursor + hover + keyboard focus ring so the operator knows it works. */
.eu-nop-table tbody tr.eu-nop-row[data-href]{ cursor:pointer; }
.eu-nop-table tbody tr.eu-nop-row[data-href]:hover{ background:rgba(24,80,181,.04); }
.eu-nop-table tbody tr.eu-nop-row[data-href]:focus{ outline:2px solid rgba(24,80,181,.35); outline-offset:-2px; }

/* ── Court-aware ticket rows ───────────────────────────────── */
/* Vertical rail at the start of each row indicates court ownership.
 * Subject cell gets a subtle court-coloured prefix tag. */
.eu-nop-table tbody tr[data-court="you"]{
  box-shadow: inset 3px 0 0 var(--court-you);
}
.eu-nop-table tbody tr[data-court="us"]{
  box-shadow: inset 3px 0 0 var(--court-us);
}
.eu-nop-table tbody tr[data-court="you"] td:first-child::before,
.eu-nop-table tbody tr[data-court="us"] td:first-child::before{
  content:''; display:inline-block;
  width:6px; height:6px; border-radius:50%;
  margin-right:6px; vertical-align:middle;
}
.eu-nop-table tbody tr[data-court="you"] td:first-child::before{ background:var(--court-you); }
.eu-nop-table tbody tr[data-court="us"]  td:first-child::before{ background:var(--court-us);  }

/* ============================================================
 * V2 BANNER — service identity + inline stat pills + CTA
 * Replaces eu-node-card + eu-action-summary 3-card row.
 * ============================================================ */
.eu-v2-banner{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;
  background:linear-gradient(135deg,var(--eu-bg-card),var(--eu-bg-secondary));
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius);
  margin-bottom:14px;
  box-shadow:var(--eu-shadow);
  flex-wrap:wrap;
}
.eu-v2-banner__icon{
  width:40px;height:40px;border-radius:var(--eu-radius-sm);
  background:linear-gradient(135deg,#154996 0%,#5b3a8a 50%,#c01a85 100%);
  color:#fff;display:grid;place-items:center;flex-shrink:0;
}
.eu-v2-banner__info{ min-width:0; }
.eu-v2-banner__title{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:14px;color:var(--eu-text-primary);margin-bottom:2px;
}
.eu-v2-banner__title strong{ font-weight:700;letter-spacing:-0.005em; }
.eu-v2-banner__active{
  display:inline-flex;align-items:center;gap:5px;
  font-size:11px;font-weight:600;color:#2e7d62;
}
.eu-v2-active-dot{
  width:7px;height:7px;border-radius:50%;
  background:#2e7d62;box-shadow:0 0 0 3px rgba(46,125,98,0.18);
}
.eu-v2-banner__sub{
  font-size:11px;color:var(--eu-text-muted);
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:0.02em;
}
.eu-v2-banner__pills{
  display:flex;gap:8px;flex-wrap:wrap;
  margin-left:auto;
}
.eu-v2-pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px;border:1px solid;border-radius:999px;
  font-size:12px;font-weight:600;
  background:var(--eu-bg-card);
}
.eu-v2-pill[hidden]{ display:none; }
.eu-v2-pill strong{ font-weight:800;font-size:14px;font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-0.01em; }
.eu-v2-pill--crit{ background:rgba(192,26,133,0.06);border-color:rgba(192,26,133,0.25);color:var(--eu-magenta); }
.eu-v2-pill--warn{ background:rgba(242,180,30,0.10);border-color:rgba(176,123,0,0.30);color:#a87f00; }
.eu-v2-pill--info{ background:rgba(24,80,181,0.06);border-color:rgba(24,80,181,0.25);color:var(--eu-accent); }
.eu-dark .eu-v2-pill--crit{ background:rgba(232,74,173,0.10); }
.eu-dark .eu-v2-pill--warn{ background:rgba(242,205,48,0.12);color:#dba300; }
.eu-dark .eu-v2-pill--info{ background:rgba(91,155,230,0.12);color:#5b9be6; }
.eu-v2-cta{
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 16px;border-radius:var(--eu-radius-sm);
  background:#1a0f2e;color:#fff;border:none;
  font-weight:600;font-size:12px;text-decoration:none;
  white-space:nowrap;
  transition:transform var(--eu-dur) var(--eu-ease),box-shadow var(--eu-dur) var(--eu-ease);
}
.eu-v2-cta:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(26,15,46,0.30);
  color:#fff;text-decoration:none;
}
.eu-dark .eu-v2-cta{ background:#fff;color:#1a0f2e; }

/* ============================================================
 * V2 METER STRIP — counters + env progress bars in one row
 * Replaces compliance grid + env breakdown card stack.
 * ============================================================ */
.eu-v2-meter{
  display:flex;align-items:center;gap:24px;
  padding:18px 22px;
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius);
  margin-bottom:14px;
  box-shadow:var(--eu-shadow);
  flex-wrap:wrap;
}
.eu-v2-meter[style*="display:none"],
.eu-v2-meter[style*="display: none"]{ display:none !important; }
.eu-v2-meter__counts{
  display:grid;grid-template-columns:repeat(4,auto);gap:28px;
}
.eu-v2-meter-cell{ text-align:left; }
.eu-v2-meter-num{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:26px;font-weight:800;letter-spacing:-0.018em;line-height:1;
  color:var(--eu-text-primary);margin-bottom:3px;
}
.eu-v2-meter-num--open{    color:#a87f00; }
.eu-v2-meter-num--pending{ color:var(--eu-text-muted); }
.eu-v2-meter-num--solved{  color:#2e7d62; }
.eu-dark .eu-v2-meter-num--open{ color:#dba300; }
.eu-dark .eu-v2-meter-num--solved{ color:#5fb892; }
.eu-v2-meter-label{
  font-size:10px;font-weight:700;letter-spacing:0.10em;
  text-transform:uppercase;color:var(--eu-text-muted);
}
.eu-v2-meter__divider{
  width:1px;height:54px;background:var(--eu-border);flex-shrink:0;
}
.eu-v2-meter__envs{
  flex:1;min-width:280px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
}
@media (max-width:780px){
  .eu-v2-meter__envs{ grid-template-columns:1fr; }
  .eu-v2-meter__divider{ display:none; }
}

/* Restyle the JS-injected .eu-env-card to look like V2 meter bars.
 * The live JS in requests_page.hbs writes <div class="eu-env-card eu-env-card--{pilot|preprod|prod}">
 * with .eu-env-card-title, .eu-env-card-stats, .eu-env-card-bar, .eu-env-card-fill inside.
 * V2 turns each card into a compact stack: label · counts · slim bar. */
.eu-v2-meter__envs .eu-env-card{
  background:transparent !important;
  border:none !important;
  border-left:3px solid var(--eu-border) !important;
  border-radius:0 !important;
  padding:6px 12px !important;
  box-shadow:none !important;
  margin:0 !important;
  display:flex !important;flex-direction:column !important;gap:6px !important;
}
.eu-v2-meter__envs .eu-env-card--pilot{   border-left-color:var(--eu-accent) !important; }
.eu-v2-meter__envs .eu-env-card--preprod{ border-left-color:#dba300 !important; }
.eu-v2-meter__envs .eu-env-card--prod{    border-left-color:#2e7d62 !important; }
.eu-v2-meter__envs .eu-env-card-title{
  font-size:11px !important;font-weight:700 !important;
  color:var(--eu-text-primary) !important;
  margin:0 !important;letter-spacing:-0.005em !important;
}
.eu-v2-meter__envs .eu-env-card-stats{
  display:flex !important;gap:10px !important;flex-wrap:wrap !important;
  font-size:10px !important;color:var(--eu-text-muted) !important;
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace !important;
}
.eu-v2-meter__envs .eu-env-card-stat strong{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace !important;
  font-weight:700 !important;font-size:11px !important;
}
.eu-v2-meter__envs .eu-env-card-bar{
  height:4px !important;background:var(--eu-bg-secondary) !important;
  border-radius:999px !important;overflow:hidden !important;
}
.eu-v2-meter__envs .eu-env-card-fill{
  height:100% !important;border-radius:999px !important;
}
.eu-v2-meter__envs .eu-env-card-fill--good{ background:#2e7d62 !important; }
.eu-v2-meter__envs .eu-env-card-fill--warn{ background:#dba300 !important; }
.eu-v2-meter__envs .eu-env-card-fill--bad{  background:var(--eu-magenta) !important; }

/* Some live env-card injections used `width: 0%` style — guarantee a min visual width */
.eu-v2-meter__envs .eu-env-card-bar{ min-height:4px !important; display:block !important; }
.eu-v2-meter__envs .eu-env-card-fill{ min-width:2px !important; display:block !important; }

/* ============================================================
 * V2 FILTER TOOLBAR — compact pill chips, "FILTER" label,
 * matches counter, CSV button at end. Replaces the old
 * full-width 4-column .eu-nop-toolbar layout.
 * ============================================================ */
.eu-nop-toolbar{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:10px 14px !important;
  margin-bottom:10px !important;
  background:var(--eu-bg-card) !important;
  border:1px solid var(--eu-border) !important;
  border-radius:var(--eu-radius) !important;
  box-shadow:var(--eu-shadow-sm,var(--eu-shadow)) !important;
  flex-wrap:wrap !important;
}
.eu-nop-toolbar::before{
  content:'FILTER';
  font-size:10px;font-weight:700;letter-spacing:0.10em;
  color:var(--eu-text-muted);
  margin-right:4px;
}
.eu-nop-toolbar-selects{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  flex-wrap:wrap !important;
  flex:1 !important;
}
.eu-nop-sel{
  height:30px !important;
  padding:0 28px 0 10px !important;
  font-size:12px !important;
  border:1px solid var(--eu-border) !important;
  border-radius:var(--eu-radius-sm) !important;
  background:var(--eu-bg-card) !important;
  color:var(--eu-text-primary) !important;
  font-family:inherit !important;
  cursor:pointer;
  min-width:0 !important;
  max-width:160px !important;
}
.eu-nop-sel:focus{
  outline:none !important;
  border-color:var(--eu-accent) !important;
  box-shadow:0 0 0 3px rgba(21,73,150,0.12) !important;
}
.eu-nop-search-wrap{
  position:relative !important;
  flex:1 !important;
  min-width:160px !important;
  max-width:280px !important;
}
.eu-nop-search-icon{
  position:absolute !important;
  left:9px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  color:var(--eu-text-muted) !important;
  pointer-events:none !important;
}
.eu-nop-search-input{
  width:100% !important;
  height:30px !important;
  padding:0 10px 0 30px !important;
  max-width:none !important;
  font-size:12px !important;
}
.eu-nop-toolbar-btn{
  height:30px !important;
  width:30px !important;
  padding:0 !important;
  border:1px solid var(--eu-border) !important;
  background:var(--eu-bg-card) !important;
  border-radius:var(--eu-radius-sm) !important;
  display:grid !important;
  place-items:center !important;
  color:var(--eu-text-muted) !important;
  cursor:pointer;
}
.eu-nop-toolbar-btn:hover{
  background:var(--eu-bg-hover) !important;
  color:var(--eu-text-primary) !important;
}
.eu-nop-toolbar-counts{
  margin-left:auto !important;
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace !important;
  font-size:11px !important;
  color:var(--eu-text-muted) !important;
  white-space:nowrap !important;
}

/* ============================================================
 * V2 TICKET TABLE — collapse 11 dense columns into a tighter
 * IA: Ticket # · Subject (with node + type meta below) ·
 * Environment · Urgency · Response window. Hide redundant
 * columns visually (still in DOM so JS keeps writing to them).
 * ============================================================ */
.eu-nop-table-wrap{
  background:var(--eu-bg-card) !important;
  border:1px solid var(--eu-border) !important;
  border-radius:var(--eu-radius) !important;
  overflow:auto !important;
  box-shadow:var(--eu-shadow) !important;
}
.eu-nop-table{
  width:100% !important;
  border-collapse:collapse !important;
  font-size:12px !important;
}
.eu-nop-th{
  padding:10px 14px !important;
  text-align:left !important;
  font-size:10px !important;
  font-weight:700 !important;
  letter-spacing:0.06em !important;
  text-transform:uppercase !important;
  color:var(--eu-text-muted) !important;
  background:var(--eu-bg-secondary) !important;
  border-bottom:1px solid var(--eu-border) !important;
  white-space:nowrap !important;
}
.eu-nop-table tbody td{
  padding:11px 14px !important;
  border-bottom:1px solid var(--eu-border) !important;
  vertical-align:middle !important;
}
.eu-nop-table tbody tr:hover{
  background:rgba(24,80,181,0.04) !important;
  cursor:pointer;
}

/* Hide redundant columns (Type of work, What's happening, Time left,
 * Last update, What to do) — IA-overload from V1; V2 surfaces these
 * inside the Subject cell as meta or via the SLA matrix above.
 * Status (What's happening) → already implied by filter "Open"
 * Time left + Last update → still in Response window cell
 * What to do → CTA button in row */
.eu-nop-table th:nth-child(5),  /* Type of work     */
.eu-nop-table td:nth-child(5),
.eu-nop-table th:nth-child(6),  /* What's happening */
.eu-nop-table td:nth-child(6),
.eu-nop-table th:nth-child(10), /* Last update      */
.eu-nop-table td:nth-child(10),
.eu-nop-table th:nth-child(11), /* What to do       */
.eu-nop-table td:nth-child(11){
  display:none !important;
}

/* Accent cells: subject in primary, node monospace muted */
.eu-nop-table td:nth-child(2){ font-weight:600 !important; color:var(--eu-text-primary) !important; }
.eu-nop-table td:nth-child(3){ font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace !important; font-size:11px !important; color:var(--eu-text-muted) !important; }

/* ============================================================
 * V2 — Empty pills: when count is 0, the JS hides them entirely.
 * Show a quiet "All clear" sentinel pill when *all* are zero, so
 * the banner doesn't look broken on a healthy day.
 * ============================================================ */
.eu-v2-banner__pills:has(.eu-v2-pill[hidden]:nth-child(1)):has(.eu-v2-pill[hidden]:nth-child(2)):has(.eu-v2-pill[hidden]:nth-child(3))::after{
  content:'\2713  All clear · 0 alerts';
  display:inline-flex;align-items:center;
  padding:6px 14px;border-radius:999px;
  background:rgba(46,128,96,0.08);
  border:1px solid rgba(46,128,96,0.20);
  color:#2e7d62;
  font-size:12px;font-weight:600;letter-spacing:0.01em;
}

/* ============================================================
 * V2 port — EBSI SLA Resolution Matrix (Node Operations tab)
 * Sourced from EBSI Service Level Agreement §1.3 Item 7.
 * Lives between the existing SLA Targets widget and the
 * compliance grid; purely additive — no JS-binding overlap.
 * ============================================================ */
.eu-sla-matrix{
  background:var(--eu-bg-card);
  border:1px solid var(--eu-border);
  border-radius:var(--eu-radius);
  margin:var(--eu-s-3) 0 var(--eu-s-4);
  overflow:hidden;
  box-shadow:var(--eu-shadow);
}
.eu-sla-matrix__hd{
  display:flex;align-items:center;gap:var(--eu-s-3);
  padding:var(--eu-s-3) var(--eu-s-4);
  border-bottom:1px solid var(--eu-border);
  flex-wrap:wrap;
}
.eu-sla-matrix__t{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:700;color:var(--eu-text-primary);margin:0;
}
.eu-sla-matrix__sub{
  font-size:11px;color:var(--eu-text-muted);
}
.eu-sla-seg{
  display:inline-flex;gap:2px;padding:3px;
  background:var(--eu-bg-secondary);
  border-radius:var(--eu-radius-sm);
}
.eu-sla-seg__btn{
  padding:5px 12px;font-size:11px;font-weight:600;
  color:var(--eu-text-muted);
  background:transparent;border:none;border-radius:5px;
  cursor:pointer;font-family:inherit;
  transition:background var(--eu-dur) var(--eu-ease),color var(--eu-dur) var(--eu-ease);
}
.eu-sla-seg__btn:hover{ color:var(--eu-text-primary); }
.eu-sla-seg__btn.is-on{
  background:var(--eu-bg-card);
  color:var(--eu-text-primary);
  box-shadow:0 1px 2px rgba(20,10,40,0.08);
}
.eu-sla-matrix__grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--eu-border);gap:1px;
}
@media (max-width:720px){
  .eu-sla-matrix__grid{ grid-template-columns:repeat(2,1fr); }
}
.eu-sla-cell{
  padding:14px 16px;
  background:var(--eu-bg-card);
  display:flex;flex-direction:column;gap:4px;
  transition:background var(--eu-dur) var(--eu-ease);
}
.eu-sla-cell__l{
  font-size:10px;font-weight:700;
  letter-spacing:0.10em;text-transform:uppercase;
  color:var(--eu-text-muted);
}
.eu-sla-cell__t{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:24px;font-weight:800;letter-spacing:-0.018em;line-height:1;
  margin-top:2px;
  color:var(--eu-text-primary);
}
.eu-sla-cell__pct{
  font-size:11px;color:var(--eu-text-muted);
}
.eu-sla-cell.is-crit{ background:rgba(192,26,133,0.04); }
.eu-sla-cell.is-crit .eu-sla-cell__t{ color:var(--eu-magenta); }
.eu-sla-cell.is-warn{ background:rgba(242,180,30,0.06); }
.eu-sla-cell.is-warn .eu-sla-cell__t{ color:#a87f00; }
.eu-sla-cell.is-ok{ background:rgba(46,128,96,0.04); }
.eu-sla-cell.is-ok .eu-sla-cell__t{ color:#2e7d62; }
.eu-sla-cell.is-low .eu-sla-cell__t{ color:var(--eu-text-secondary); }
.eu-sla-cell.is-na{
  background:var(--eu-bg-secondary);
  opacity:0.65;
}
.eu-sla-cell.is-na .eu-sla-cell__t{ color:var(--eu-text-muted); }

/* Dark mode */
.eu-dark .eu-sla-cell.is-crit{ background:rgba(232,74,173,0.08); }
.eu-dark .eu-sla-cell.is-warn{ background:rgba(242,205,48,0.08); }
.eu-dark .eu-sla-cell.is-ok{   background:rgba(94,200,158,0.08); }

/* ============================================================
 * #10611 — Follow + Subscribe to newsletter alignment.
 * Live-class fix for the article-hero meta row. Forces both
 * buttons to share height, padding, border-radius, and vertical
 * baseline — they are siblings inside .eu-art-hero__follow but
 * Zendesk renders one and we render the other, so without an
 * explicit reset they pick up two different sets of base styles.
 * ============================================================ */
.eu-art-hero__follow{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  flex-wrap:wrap;
  vertical-align:middle;
}
.eu-art-hero__follow > button,
.eu-art-hero__follow > a,
.eu-art-hero__follow .eu-newsletter-sub{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:30px !important;
  padding:0 14px !important;
  font-size:12px !important;
  font-weight:600 !important;
  border-radius:999px !important;
  line-height:1 !important;
  margin:0 !important;
  box-sizing:border-box !important;
  white-space:nowrap;
}
/* Keep the gradient on the newsletter primary, but match the pill height */
.eu-art-hero__follow .eu-newsletter-sub{
  background:var(--eu-gradient-accent) !important;
  color:#fff !important;
  border:1px solid transparent !important;
  box-shadow:0 2px 8px rgba(21,73,150,.25) !important;
}
.eu-art-hero__follow .eu-newsletter-sub.is-subscribed{
  background:transparent !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.85) !important;
  box-shadow:none !important;
}
/* Submit-block toast */
.eu-form-toast{
  position:fixed;left:50%;bottom:32px;transform:translateX(-50%);
  background:var(--eu-bg-card);color:var(--eu-text-primary);
  border:1px solid var(--eu-border);
  padding:12px 18px;border-radius:10px;
  box-shadow:0 12px 30px rgba(32,12,54,.18);
  font-size:13px;font-weight:600;z-index:9999;
  display:flex;align-items:center;gap:10px;
  transition:opacity .25s ease, transform .25s ease;
}
.eu-form-toast--err{
  border-left:3px solid var(--eu-magenta);
  color:var(--eu-magenta);
}
.eu-form-toast.is-hide{opacity:0;transform:translateX(-50%) translateY(8px)}

/* ============================================================
 * Submit a request — Variant B layout adapted from user
 * design hand-off (Zendesk.zip / submit-request-variants.html)
 * ============================================================ */

/* Hero v2 */
.eu-req-hero--v2{padding:32px 32px 24px !important;background:linear-gradient(135deg,#154996 0%,#5b3a8a 50%,#c01a85 100%) !important;border-radius:0 !important;color:#fff;position:relative;overflow:hidden}
.eu-req-hero--v2::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 25% 20%,rgba(255,255,255,.10) 0%,transparent 60%);pointer-events:none}
.eu-req-hero--v2 .eu-req-hero-inner{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:0}
.eu-req-hero--v2 .eu-req-hero__title{font-size:34px !important;font-weight:800 !important;letter-spacing:-.022em;line-height:1.1;margin:0 0 8px !important;color:#fff !important}
.eu-req-hero--v2 .eu-req-hero__sub{font-size:14px;color:rgba(255,255,255,.85);max-width:62ch;line-height:1.55;margin:0}
.eu-req-hero--v2 .eu-req-hero__row{display:flex;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}
.eu-req-hero__pill{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:20px;background:rgba(255,255,255,.12);font-size:11px;font-weight:600;color:#fff;font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;letter-spacing:.04em}
.eu-req-hero__sla{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:rgba(255,255,255,.85)}
.eu-req-hero__sla-dot{width:7px;height:7px;border-radius:50%;background:#9dc6b8;box-shadow:0 0 0 3px rgba(157,198,184,.3)}

/* Service card grid (replaces eu-cat-card layout) */
.eu-form-categories{max-width:1180px;margin:24px auto;padding:0 32px}
.eu-category-cards{display:grid !important;grid-template-columns:repeat(2,1fr) !important;gap:10px !important}
@media (max-width:780px){.eu-category-cards{grid-template-columns:1fr !important}}

.eu-svc-card{position:relative;display:grid;grid-template-columns:42px 1fr auto;gap:14px;padding:16px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:11px;color:inherit !important;text-decoration:none !important;cursor:pointer;align-items:start;transition:all var(--eu-dur,180ms) var(--eu-ease,cubic-bezier(.4,0,.2,1))}
.eu-svc-card:hover{border-color:var(--eu-border-accent);box-shadow:var(--eu-shadow-hover,0 8px 24px rgba(21,73,150,.12));transform:translateY(-1px)}
.eu-svc-card.is-urgent{box-shadow:inset 3px 0 0 var(--eu-magenta)}
.eu-svc-card.is-urgent:hover{box-shadow:inset 3px 0 0 var(--eu-magenta), var(--eu-shadow-hover,0 8px 24px rgba(21,73,150,.12))}
.eu-svc-card__icon{width:40px;height:40px;border-radius:10px;background:rgba(21,73,150,.08);color:var(--eu-accent);display:grid;place-items:center;flex-shrink:0;align-self:start}
.eu-svc-card.is-urgent .eu-svc-card__icon{background:rgba(192,26,133,.10);color:var(--eu-magenta)}
.eu-svc-card.is-ops .eu-svc-card__icon{background:rgba(46,125,98,.10);color:#2e7d62}
.eu-svc-card__body{min-width:0}
.eu-svc-card__title{font-size:14px !important;font-weight:700 !important;letter-spacing:-.005em;line-height:1.25 !important;color:var(--eu-text-primary) !important;margin:0 0 4px !important}
.eu-svc-card__desc{font-size:12px;color:var(--eu-text-muted);line-height:1.45;margin:0 0 8px}
.eu-svc-card__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.eu-svc-card__sla{display:inline-flex;align-items:center;gap:4px;font-weight:700;font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:4px;font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace}
.eu-svc-card__sla--p1{background:rgba(192,26,133,.10);color:var(--eu-magenta)}
.eu-svc-card__sla--p2{background:rgba(242,205,48,.18);color:#a87f00}
.eu-svc-card__sla--p3{background:rgba(21,73,150,.10);color:var(--eu-accent)}
.eu-svc-card__owner{font-size:11px;color:var(--eu-text-muted)}
.eu-svc-card__owner::before{content:"·";margin-right:6px;color:var(--eu-text-muted);opacity:.5}
.eu-svc-card__arrow{color:var(--eu-text-muted);align-self:center;transition:transform var(--eu-dur,180ms) var(--eu-ease,cubic-bezier(.4,0,.2,1)),color var(--eu-dur,180ms)}
.eu-svc-card:hover .eu-svc-card__arrow{color:var(--eu-accent);transform:translateX(2px)}

/* Group header tightened to match Variant B */
.eu-form-categories .eu-category-group{margin-bottom:24px}
.eu-form-categories .eu-category-group-header{padding-bottom:10px;margin-bottom:14px;border-bottom:1px solid var(--eu-border)}

/* Dark mode */
.eu-dark .eu-svc-card{background:var(--eu-bg-card);border-color:var(--eu-border)}
.eu-dark .eu-svc-card__icon{background:rgba(91,155,230,.14);color:var(--eu-accent-light,var(--eu-accent))}
.eu-dark .eu-svc-card.is-urgent .eu-svc-card__icon{background:rgba(232,74,173,.18);color:var(--eu-magenta)}
.eu-dark .eu-svc-card.is-ops .eu-svc-card__icon{background:rgba(94,200,158,.18);color:#5ec89e}

/* "Check the KB first" footer card under form categories */
.eu-kb-footer{display:flex;align-items:center;gap:14px;max-width:1180px;margin:24px auto;padding:18px 22px;background:var(--eu-bg-card);border:1px solid var(--eu-border);border-radius:12px;box-shadow:0 1px 2px rgba(32,12,54,.04)}
.eu-kb-footer__icon{flex-shrink:0;width:40px;height:40px;border-radius:9px;background:rgba(46,125,98,.10);color:#2e7d62;display:grid;place-items:center}
.eu-kb-footer__body{flex:1;min-width:0}
.eu-kb-footer__title{font-size:13px;font-weight:700;color:var(--eu-text-primary);margin-bottom:2px}
.eu-kb-footer__desc{font-size:12px;color:var(--eu-text-muted);line-height:1.45}
.eu-kb-footer__cta{padding:8px 14px;border-radius:8px;background:transparent;border:1px solid var(--eu-border);color:var(--eu-text-primary);font-size:12px;font-weight:600;text-decoration:none;transition:all var(--eu-dur,180ms) var(--eu-ease,cubic-bezier(.4,0,.2,1))}
.eu-kb-footer__cta:hover{background:var(--eu-bg-hover);border-color:var(--eu-border-accent)}
.eu-dark .eu-kb-footer__icon{background:rgba(94,200,158,.18);color:#5ec89e}

/* ============================================================
 * Form-detail page (when ?ticket_form_id is set):
 * compact header + 2-col layout (form on left, sidebar right).
 * ============================================================ */

.eu-req-detail-header{
  max-width:1320px;margin:24px auto 0;padding:0 32px;
}
.eu-req-detail-header__back{
  display:inline-flex;align-items:center;gap:6px;
  font-size:12px;font-weight:600;color:var(--eu-text-muted);
  text-decoration:none;margin-bottom:12px;
  transition:color var(--eu-dur,180ms) var(--eu-ease,cubic-bezier(.4,0,.2,1));
}
.eu-req-detail-header__back:hover{color:var(--eu-accent);text-decoration:none}

.eu-req-detail-header__row{
  display:flex;align-items:center;gap:16px;
  padding:18px 20px;
  background:var(--eu-bg-card);border:1px solid var(--eu-border);
  border-radius:14px;
  box-shadow:0 1px 2px rgba(32,12,54,.04),0 4px 14px rgba(32,12,54,.04);
}
.eu-req-detail-header__icon{
  flex-shrink:0;width:48px;height:48px;border-radius:12px;
  background:rgba(21,73,150,.08);color:var(--eu-accent);
  display:grid;place-items:center;
}
.eu-req-detail-header__icon svg{width:24px;height:24px}
.eu-req-detail-header__copy{flex:1;min-width:0}
.eu-req-detail-header__title{
  font-size:22px;font-weight:800;letter-spacing:-.018em;line-height:1.2;
  margin:0 0 2px;color:var(--eu-text-primary);
}
.eu-req-detail-header__sub{
  font-size:13px;color:var(--eu-text-muted);margin:0;line-height:1.5;
}
.eu-req-detail-header__sub strong{color:var(--eu-text-primary);font-weight:600}
.eu-req-detail-header__dot{opacity:.5}
.eu-req-detail-header__sla{
  flex-shrink:0;display:inline-flex;align-items:center;gap:5px;
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  padding:4px 10px;border-radius:6px;
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
.eu-req-detail-header__sla--p1{background:rgba(192,26,133,.10);color:var(--eu-magenta)}
.eu-req-detail-header__sla--p2{background:rgba(242,205,48,.18);color:#a87f00}
.eu-req-detail-header__sla--p3{background:rgba(21,73,150,.10);color:var(--eu-accent)}
.eu-dark .eu-req-detail-header__icon{background:rgba(91,155,230,.14);color:var(--eu-accent-light,var(--eu-accent))}

/* Two-column grid (only kicks in when sidebar is visible) */
.eu-req-grid{
  max-width:1320px;margin:18px auto 48px;padding:0 24px;
  display:grid;grid-template-columns:1fr;gap:24px;align-items:start;
}
.eu-req-grid:has(#eu-req-sidebar:not([style*="display: none"])){
  grid-template-columns:minmax(0,1fr) 300px;
}
@media (max-width:900px){
  .eu-req-grid:has(#eu-req-sidebar:not([style*="display: none"])){
    grid-template-columns:1fr;
  }
}

.eu-req-sidebar{
  display:flex;flex-direction:column;gap:14px;
  position:sticky;top:24px;
  align-self:start;
}
@media (max-width:900px){.eu-req-sidebar{position:static}}

.eu-req-sidebar__card{
  background:var(--eu-bg-card);border:1px solid var(--eu-border);
  border-radius:12px;padding:16px 18px;
  box-shadow:0 1px 2px rgba(32,12,54,.04);
}
.eu-req-sidebar__card--alt{
  background:linear-gradient(135deg,rgba(21,73,150,.04),rgba(192,26,133,.04));
  border-color:var(--eu-border-accent);
}
.eu-req-sidebar__eyebrow{
  display:block;font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:.10em;
  color:var(--eu-text-muted);margin-bottom:10px;
}
.eu-req-sidebar__list{
  margin:0;padding-left:0;list-style:none;
  font-size:13px;line-height:1.55;color:var(--eu-text-secondary);
}
.eu-req-sidebar__list li{
  position:relative;padding:5px 0 5px 20px;
}
.eu-req-sidebar__list li::before{
  content:"";position:absolute;left:0;top:13px;
  width:6px;height:6px;border-radius:50%;
  background:var(--eu-accent);opacity:.7;
}
ol.eu-req-sidebar__list{counter-reset:eu-step}
ol.eu-req-sidebar__list li{padding-left:28px}
ol.eu-req-sidebar__list li::before{
  counter-increment:eu-step;
  content:counter(eu-step);
  width:18px;height:18px;border-radius:50%;
  background:var(--eu-accent);color:#fff;
  font-size:10px;font-weight:700;
  display:grid;place-items:center;top:8px;opacity:1;
}
.eu-req-sidebar__card--alt p{font-size:13px;line-height:1.55;color:var(--eu-text-secondary);margin:0}
.eu-req-sidebar__card--alt a{color:var(--eu-accent);font-weight:600}
.eu-req-sidebar__card--alt a:hover{color:var(--eu-accent-hover,var(--eu-accent))}

/* Form polish — better field rhythm + larger submit on the form-detail page */
.eu-req-grid .eu-form-container{
  background:var(--eu-bg-card);border:1px solid var(--eu-border);
  border-radius:14px;padding:28px 36px;
  box-shadow:0 1px 2px rgba(32,12,54,.04),0 4px 14px rgba(32,12,54,.04);
}
.eu-req-grid .eu-form-container .form-field{margin-bottom:16px}
.eu-req-grid .eu-form-container label{
  font-size:13px;font-weight:700;
  color:var(--eu-text-primary);
  margin-bottom:4px;display:block;
}
.eu-req-grid .eu-form-container .form-field-description,
.eu-req-grid .eu-form-container [class*="description"]{
  font-size:12px;color:var(--eu-text-muted);
  margin:0 0 8px;line-height:1.5;
}
.eu-req-grid .eu-form-container input[type=text],
.eu-req-grid .eu-form-container input[type=email],
.eu-req-grid .eu-form-container input[type=tel],
.eu-req-grid .eu-form-container input[type=number],
.eu-req-grid .eu-form-container input[type=url],
.eu-req-grid .eu-form-container select,
.eu-req-grid .eu-form-container textarea{
  width:100%;padding:10px 14px;
  border:1px solid var(--eu-border);border-radius:8px;
  background:var(--eu-input-bg);color:var(--eu-text-primary);
  font-family:inherit;font-size:14px;line-height:1.5;
  transition:border-color var(--eu-dur,180ms),box-shadow var(--eu-dur,180ms);
}
.eu-req-grid .eu-form-container input:focus,
.eu-req-grid .eu-form-container select:focus,
.eu-req-grid .eu-form-container textarea:focus{
  outline:none;border-color:var(--eu-accent);
  box-shadow:0 0 0 3px rgba(21,73,150,.12);
}

/* Submit button: gradient pill with shadow, larger, full-width on mobile */
.eu-req-grid .eu-form-container button[type=submit],
.eu-req-grid .eu-form-container input[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 28px !important;border-radius:10px !important;
  background:linear-gradient(135deg,#154996 0%,#5b3a8a 50%,#c01a85 100%) !important;
  color:#fff !important;border:none !important;
  font-size:14px !important;font-weight:700 !important;
  letter-spacing:.01em;
  box-shadow:0 4px 14px rgba(21,73,150,.22) !important;
  cursor:pointer;
  transition:transform var(--eu-dur,180ms),box-shadow var(--eu-dur,180ms),filter var(--eu-dur,180ms);
}
.eu-req-grid .eu-form-container button[type=submit]:hover,
.eu-req-grid .eu-form-container input[type=submit]:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(21,73,150,.30) !important;
  filter:brightness(1.05);
}
.eu-req-grid .eu-form-container button[type=submit]:active,
.eu-req-grid .eu-form-container input[type=submit]:active{transform:translateY(0)}
@media (max-width:600px){
  .eu-req-grid .eu-form-container button[type=submit],
  .eu-req-grid .eu-form-container input[type=submit]{width:100%}
}

/* Section header injected by JS */
.eu-form-section-header{
  font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.10em;
  color:var(--eu-text-muted);
  margin:24px 0 8px;padding-bottom:6px;
  border-bottom:1px solid var(--eu-border);
}
.eu-form-section-header:first-child{margin-top:0}

/* Form-detail page: roomier on large viewports */
@media (min-width:1480px){
  .eu-req-detail-header,
  .eu-req-grid{ max-width:1440px }
}
@media (min-width:1700px){
  .eu-req-detail-header,
  .eu-req-grid{ max-width:1560px }
}

/* ============================================================
 * Form-detail page: break out of the Copenhagen .container cap
 * (1160px / 5% padding) so the new 2-col grid can actually use
 * the full width on wide viewports.
 * ============================================================ */
.container:has(.eu-request-page){
  max-width:none !important;
  padding:0 !important;
}
.container:has(.eu-request-page) > .sub-nav{
  max-width:1320px;margin:0 auto;padding:18px 24px;
}
@media (min-width:1480px){
  .container:has(.eu-request-page) > .sub-nav{ max-width:1440px }
}
@media (min-width:1700px){
  .container:has(.eu-request-page) > .sub-nav{ max-width:1560px }
}

/* ============================================================
 * Final width override for form-detail grid:
 * Copenhagen .form{max-width:650px} and our own
 * .eu-request-page{max-width:820px} were both clamping the
 * form column long before the grid ever applied. Untie them.
 * ============================================================ */
.eu-request-page{ max-width:none !important; padding:0 0 32px !important }
.eu-req-grid .eu-form-container.form,
.eu-req-grid .eu-form-container .form,
.eu-req-grid #new-request-form,
.eu-req-grid #new-request-form > form{
  max-width:none !important;
  width:100% !important;
}

/* ============================================================
 * 2026-05 Open-issue closure batch
 * Closes: #10583 #10584 #10585 #10589 #10590 #10597 #10602
 *         #10603 #10605 #10607 #10608 #10610 (covered earlier)
 *         (#10596 is a content-side article fix, see notes)
 * Live-class mirror of the v2 .t-* patches so the live header
 * / footer / article / search surfaces actually pick them up.
 * ============================================================ */

/* #10597 — reinforce header "Submit a request" CTA contrast in light mode.
 * Live class is .eu-btn-submit. Earlier rule already gradient — this
 * adds explicit text-shadow + min-contrast border so the pill never
 * blends into a tinted hero background. */
.eu-btn-submit,
a.eu-btn-submit,
.user-nav-list .eu-btn-submit{
  background:linear-gradient(120deg,#1850b5 0%,#5b3a8a 50%,#c01a85 100%) !important;
  color:#fff !important;
  text-shadow:0 1px 1px rgba(0,0,0,0.18);
  border:1px solid rgba(255,255,255,0.10) !important;
}
.eu-btn-submit:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* #10589 / #10590 — search bar containment.
 * Mirror the .t-search padding/icon-position fix onto the live
 * .search / .eu-search-input pair so placeholder text and the
 * magnifier never overlap the container border. */
.search,
.search-full,
.search-container{position:relative}
.search input[type=search],
.search-full input[type=search],
.search-container input[type=search],
.eu-search-input,
input.eu-search-input{
  padding-left:52px !important;
  padding-right:14px !important;
  box-sizing:border-box !important;
}
/* #10589 — also target .search-icon (used in new_request_page.hbs) — the
   prior fix only listed .eu-search-icon, so the Submit-a-request search
   icon kept overlapping placeholder text on the live theme. */
.search .eu-search-icon,
.search-full .eu-search-icon,
.search-container .search-icon,
.eu-search-icon,
.search-icon{
  position:absolute !important;
  left:18px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  pointer-events:none;
}
/* Stop the hero search shadow from bleeding past the rounded container */
.eu-hero-search,
.search-full,
.search{overflow:visible;clip-path:none}
.eu-hero-search input[type=search]:focus,
.eu-search-input:focus{
  box-shadow:0 0 0 3px rgba(21,73,150,0.18) !important;
}

/* Search Results page: contained input — no negative margins */
.search-results-list .search,
#search-results .search,
.eu-sr-search{
  margin:0 !important;
  width:100% !important;
}

/* #10584 — Article "Follow" outlined ghost button reinforced for the
 * live class names used by article_page.hbs. */
.eu-art-hero__follow,
.button-follow,
[data-action="follow"]{
  border:1.5px solid var(--eu-text-primary) !important;
  background:transparent !important;
  color:var(--eu-text-primary) !important;
  font-weight:600;
  border-radius:var(--eu-radius);
  padding:6px 14px;
}
.eu-art-hero__follow:hover,
.button-follow:hover,
[data-action="follow"]:hover{
  background:var(--eu-text-primary) !important;
  color:var(--eu-bg-primary) !important;
  border-color:var(--eu-text-primary) !important;
}

/* #10585 / #10595 — article callouts readable in dark mode against
 * the live .article-body wrapper. */
.article-body blockquote,
.article-body .is-tip,
.article-body .is-warning,
.article-body .is-info,
.article-body .callout{
  color:var(--eu-text-primary) !important;
}
.eu-dark .article-body blockquote,
.eu-dark .article-body .is-tip,
.eu-dark .article-body .is-info{
  background:rgba(91,155,230,0.10) !important;
  border-left:3px solid var(--eu-accent) !important;
  color:var(--eu-text-primary) !important;
}
.eu-dark .article-body .is-warning{
  background:rgba(232,74,173,0.12) !important;
  border-left:3px solid var(--eu-magenta) !important;
  color:var(--eu-text-primary) !important;
}

/* #10595 — additional coverage for INLINE-styled disclaimer/info blocks.
   QA confirmed the affected articles (Privacy Statement, MSA Terms, "What
   is the MSA?") wrap their notices in <div style="background:#fff3cd; …">
   (cream warning) and <div style="background:#dbeafe; …"> (light blue
   info). The previous rule only matched class-based markup (.is-warning
   / .is-info) so it missed these. In dark mode, the global text colour
   flips to near-white but the div retains its hardcoded light bg → white
   text on cream → unreadable. We override the inline color via attribute
   selector + !important. The cascade also forces nested text nodes
   (<p>, <strong>, <span>) to inherit. */
.eu-dark .article-body div[style*="background:#fff3cd"],
.eu-dark .article-body div[style*="background: #fff3cd"],
.eu-dark .article-body div[style*="background-color:#fff3cd"],
.eu-dark .article-body div[style*="background-color: #fff3cd"]{
  color:#2a1a00 !important;
}
.eu-dark .article-body div[style*="background:#dbeafe"],
.eu-dark .article-body div[style*="background: #dbeafe"],
.eu-dark .article-body div[style*="background-color:#dbeafe"],
.eu-dark .article-body div[style*="background-color: #dbeafe"]{
  color:#0a2540 !important;
}
/* Belt-and-braces: any inline-styled block with a light bg in the
   #fef…/#fff…/#fed…/#dbe…/#e0f… range — force nested text to inherit
   so it picks up the colour overrides above. */
.eu-dark .article-body div[style*="background:#fff3cd"] *,
.eu-dark .article-body div[style*="background:#dbeafe"] *,
.eu-dark .article-body div[style*="background:#fff8e1"] *,
.eu-dark .article-body div[style*="background:#fef3c7"] *,
.eu-dark .article-body div[style*="background:#e0f2fe"] *{
  color:inherit !important;
}

/* #10583 — Footer dark/light parity. Theme toggle reloads the page,
 * but during initial paint the inline styles in footer.hbs were
 * being computed before the .eu-dark class landed. Add a hard
 * fallback: footer surface tied directly to vars, and rule out
 * stale link colours from Copenhagen base. */
.footer,
.footer .footer-inner,
.footer a:link,
.footer a:visited{
  color:var(--eu-text-muted) !important;
}
.footer a:hover{color:var(--eu-accent) !important;text-decoration:none}
.eu-dark .footer{background:transparent;color:var(--eu-text-muted)}
.eu-dark .footer strong{color:var(--eu-text-primary) !important}
.eu-dark .footer .dropdown-toggle{color:var(--eu-text-primary) !important;background:transparent}

/* #10602 — unwanted arrow on form-picker hover. The Copenhagen
 * .dropdown-toggle::after pseudo-element was rendering on top of
 * the form picker tile on hover. Suppress it for the form-picker
 * tiles specifically. */
.eu-svc-card::after,
.eu-svc-card .dropdown-toggle::after,
.eu-form-categories .dropdown-toggle::after,
.eu-cat-card .dropdown-toggle::after{ content:none !important; display:none !important; }
/* Keep .eu-svc-card__arrow (intentional chevron) but make sure no
 * stray ::before/::after from base styles double it up on hover */
.eu-svc-card:hover::before,
.eu-svc-card:hover::after{ display:none !important; content:none !important; }

/* #10603 — Sign-in page sometimes renders two recover-password
 * links (Zendesk modal duplicate). Hide all but the first. */
.recover-password ~ .recover-password,
.password-recovery ~ .password-recovery,
[data-test="recover-password"] ~ [data-test="recover-password"],
.signin-form a[href*="password"] ~ a[href*="password"]{
  display:none !important;
}

/* #10605 — Components that didn't repaint cleanly when toggling
 * light/dark. The toggle does a full page reload, but the
 * following surfaces had hard-coded colors from inline base
 * styles that overrode our vars. Force them to inherit. */
.eu-dark .nesty-input,
.eu-dark .nesty-panel,
.eu-dark .Select-control,
.eu-dark .Select-menu-outer,
.eu-dark .ck-editor__main > .ck-editor__editable,
.eu-dark .ck.ck-toolbar{
  background:var(--eu-input-bg) !important;
  color:var(--eu-text-primary) !important;
  border-color:var(--eu-border) !important;
}
.eu-dark .nesty-panel li{color:var(--eu-text-primary) !important}
.eu-dark .nesty-panel li.selected,
.eu-dark .nesty-panel li:hover{background:var(--eu-bg-hover) !important;color:var(--eu-accent-light,var(--eu-accent)) !important}
/* Light-mode path: clear any stale dark inline color the runtime
 * theme switcher may have left on body before reload. */
html:not(.eu-dark) body[style*="background-color: rgb(13, 6, 24)"]{
  background-color:#f5f7fa !important;
  color:#200c36 !important;
}

/* #10607 — Reinforce: every option/link in the user-info dropdown
 * uses the same colour regardless of :visited state, AND on tinted
 * hover backgrounds. Earlier block at 4140 covered colour; this
 * adds an opaque background so a 'visited' purple doesn't bleed
 * through translucent hover. */
.user-info .dropdown-menu,
.user-info .dropdown-menu [role="menuitem"]{
  background-color:var(--eu-bg-secondary) !important;
}
.user-info .dropdown-menu a,
.user-info .dropdown-menu a:visited,
.user-info .dropdown-menu [role="menuitem"]{
  color:var(--eu-text-primary) !important;
}

/* #10608 — Old SLA / required-fields progress widget was deprecated
 * by the new submit-guard. Hide any residual instance the live
 * theme may still inject via legacy templates. */
.eu-sla-progress-bar,
.eu-progress-bar,
.eu-required-progress,
.eu-form-progress{
  display:none !important;
}

/* #10596 — Article content-side fix.
 * The stale link in "How to Request a Feature or Enhancement"
 * lives inside the article body (HTML fragment, not theme code).
 * Theme-side: ensure any explicitly-broken Zendesk article link
 * doesn't render as silent dead-text. Surface them as clearly
 * styled so editors notice when proofing. Editors must update the
 * article in Help Center → Articles → #10596 source. */
.article-body a[href="#"],
.article-body a:not([href]),
.article-body a[href=""]{
  color:var(--eu-magenta) !important;
  text-decoration:underline wavy !important;
  cursor:not-allowed;
}

/* ============================================================
 * NOCS-MOCKUP-REFRESH — bring the community landing closer to
 * the spec mockup: 90deg hero gradient with side margin + rounded
 * bottom, per-category eyebrow palette on doc cards, softer
 * sidebar accent on the Help-Desk card, larger welcome panel.
 * Overrides earlier .nocs-* styles where they conflict.
 * ============================================================ */
.nocs-hero{
  background:linear-gradient(90deg, #1e3a8a 0%, #3b0764 50%, #831843 100%);
  border-radius: 0 0 24px 24px;
  margin: 8px 8px 0;
  padding: 56px 32px;
  box-shadow: 0 10px 30px rgba(32,12,54,.12);
  color:#fff !important;
  /* Hero is large enough to need its own min-height — avoids the
   * "thin banner" collapse when content is short. */
  min-height:200px;
  display:flex; align-items:center;
}
.nocs-hero__inner{ max-width:1180px; width:100%; margin:0 auto; }
/* Override the global h1/h2/etc colour rule (forced !important earlier
 * in the stylesheet) so the hero title actually reads white on the
 * gradient. Same for the supporting copy and eyebrow. */
.nocs-hero__title,
.nocs-hero h1{ font-size:44px; line-height:1.05; color:#fff !important; }
.nocs-hero__sub{ font-size:18px; opacity:.92; max-width:48ch; color:rgba(255,255,255,.92) !important; }
.nocs-hero__eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:700; letter-spacing:.10em;
  text-transform:uppercase; color:rgba(255,255,255,.78);
  margin-bottom:12px;
}
.nocs-hero__badge{ color:#fff !important; }
/* Hero logo wraps the official gradient brand mark. The image's own
 * gradient stays vivid on the dark hero gradient — no recolour. */
.nocs-hero__logo{ flex-shrink:0; width:96px; height:96px; }
.nocs-hero__logo img,
.nocs-hero__logo svg{ width:100%; height:100%; object-fit:contain; }

/* Welcome — larger card, more breathing room. */
.nocs-welcome{ max-width:1180px; margin:36px auto 0; }
.nocs-welcome__inner{
  padding: 32px 36px;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(32,12,54,.04);
}
.nocs-welcome__title{ font-size:24px; font-weight:800; margin-bottom:10px; }
.nocs-welcome__sub{ font-size:15px; line-height:1.65; max-width:62ch; }

/* Quick row — tightens search field + 2 CTAs to mirror the mockup */
.nocs-quick{
  max-width:1180px;
  grid-template-columns: minmax(0,1fr) auto auto;
  gap:16px;
  margin-top:24px;
}
.nocs-quick__search{
  background:#f8fafc;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.04);
  border-radius:10px;
}
.nocs-quick__cta{ border-radius:10px; }
.nocs-quick__cta-icon{ border-radius:8px; }
.nocs-quick__cta--primary .nocs-quick__cta-icon{
  background: rgba(99,102,241,.12); color:#4f46e5;
}
@media (max-width:900px){
  .nocs-quick{ grid-template-columns: 1fr; }
}

/* Doc library — broader 4-up grid + per-category eyebrow palette
 * matching the mockup's Tailwind palette so each card is its own
 * recognisable colour token without repainting the whole brand. */
.nocs-lib{ max-width:1180px; margin:48px auto 0; padding:0 24px; }
.nocs-lib__head{ margin-bottom:20px; }
.nocs-lib__head h2{ font-size:24px; font-weight:800; margin:0 0 4px; }
.nocs-lib__head p{ font-size:14px; color:var(--eu-text-muted); margin:0; }
.nocs-lib__grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:20px;
}
@media (max-width:1100px){ .nocs-lib__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width:600px){  .nocs-lib__grid{ grid-template-columns: 1fr; } }

/* Per-card eyebrow + icon colour tokens — mirror the mockup's
 * categorisation: each card carries a distinct accent so the whole
 * library reads as a colour-coded shelf. */
.nocs-block--start    .nocs-block__eyebrow{ color:#4f46e5; }
.nocs-block--start    .nocs-block__icon{ background:#eef2ff; color:#4f46e5; }
.nocs-block--ops      .nocs-block__eyebrow{ color:#059669; }
.nocs-block--ops      .nocs-block__icon{ background:#ecfdf5; color:#059669; }
.nocs-block--proc     .nocs-block__eyebrow{ color:#e11d48; }
.nocs-block--proc     .nocs-block__icon{ background:#fff1f2; color:#e11d48; }
.nocs-block--legal    .nocs-block__eyebrow{ color:#2563eb; }
.nocs-block--legal    .nocs-block__icon{ background:#eff6ff; color:#2563eb; }
.nocs-block--sla      .nocs-block__eyebrow{ color:#d97706; }
.nocs-block--sla      .nocs-block__icon{ background:#fffbeb; color:#d97706; }
.nocs-block--privacy  .nocs-block__eyebrow{ color:#0d9488; }
.nocs-block--privacy  .nocs-block__icon{ background:#f0fdfa; color:#0d9488; }
.nocs-block--sod      .nocs-block__eyebrow{ color:#0891b2; }
.nocs-block--sod      .nocs-block__icon{ background:#ecfeff; color:#0891b2; }
.nocs-block--wallet   .nocs-block__eyebrow{ color:#9333ea; }
.nocs-block--wallet   .nocs-block__icon{ background:#faf5ff; color:#9333ea; }

/* Hover-accent line tinted to the card's category instead of the
 * uniform brand gradient, so each card's identity is consistent. */
.nocs-block--start::before    { background:linear-gradient(90deg,#4f46e5,#a78bfa); }
.nocs-block--ops::before      { background:linear-gradient(90deg,#059669,#34d399); }
.nocs-block--proc::before     { background:linear-gradient(90deg,#e11d48,#fb7185); }
.nocs-block--legal::before    { background:linear-gradient(90deg,#2563eb,#60a5fa); }
.nocs-block--sla::before      { background:linear-gradient(90deg,#d97706,#fbbf24); }
.nocs-block--privacy::before  { background:linear-gradient(90deg,#0d9488,#5eead4); }
.nocs-block--sod::before      { background:linear-gradient(90deg,#0891b2,#67e8f9); }
.nocs-block--wallet::before   { background:linear-gradient(90deg,#9333ea,#c084fc); }
.nocs-block__more{ color:inherit; }
.nocs-block--start    .nocs-block__more{ color:#4f46e5; }
.nocs-block--ops      .nocs-block__more{ color:#059669; }
.nocs-block--proc     .nocs-block__more{ color:#e11d48; }
.nocs-block--legal    .nocs-block__more{ color:#2563eb; }
.nocs-block--sla      .nocs-block__more{ color:#d97706; }
.nocs-block--privacy  .nocs-block__more{ color:#0d9488; }
.nocs-block--sod      .nocs-block__more{ color:#0891b2; }
.nocs-block--wallet   .nocs-block__more{ color:#9333ea; }

/* Activity row — split into 2/3 + 1/3, sidebar cards mirror the
 * mockup's grey + indigo-tinted "need help" panel. */
.nocs-activity{
  max-width:1180px; margin:48px auto 64px; padding:0 24px;
  display:grid; grid-template-columns: 2fr 1fr; gap:32px;
}
@media (max-width:900px){ .nocs-activity{ grid-template-columns: 1fr; } }
.nocs-activity__head{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:14px; padding-bottom:10px;
  border-bottom:1px solid var(--eu-border);
}
.nocs-activity__head h2{ font-size:20px; font-weight:800; margin:0; }
.nocs-activity__new{ font-size:13px; font-weight:600; color:#4f46e5; text-decoration:none; }
.nocs-recent__list{ background:var(--eu-bg-card); border:1px solid var(--eu-border); border-radius:14px; overflow:hidden; }
.nocs-recent__item{
  border:none; border-bottom:1px solid #f1eef4;
  border-radius:0; padding:14px 18px;
}
.nocs-recent__item:last-child{ border-bottom:none; }
.nocs-recent__item:hover{ background:#f8fafc; }
.nocs-recent__item a{ color:#4f46e5; font-weight:500; font-size:14px; }
.nocs-side-card{
  background:#f8fafc;
  border:1px solid var(--eu-border);
  border-radius:14px;
  padding:24px;
}
.nocs-side-card__label{
  display:inline-block; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.08em;
  color:var(--eu-text-muted); margin-bottom:8px;
}
.nocs-side-card__title{ font-size:16px; font-weight:800; margin:0 0 8px; }
.nocs-side-card__meta{ font-size:14px; color:var(--eu-text-muted); margin:0 0 16px; line-height:1.55; }
.nocs-side-card__cta{
  display:inline-block; padding:9px 16px;
  border:1px solid var(--eu-border); border-radius:8px;
  font-size:13px; font-weight:600; text-decoration:none;
  background:#fff; color:var(--eu-text-primary);
  box-shadow:0 1px 2px rgba(32,12,54,.04);
}
.nocs-side-card--accent{
  background:#eef2ff; border-color:#e0e7ff;
}
.nocs-side-card--accent .nocs-side-card__label{ color:#4f46e5; }
.nocs-side-card--accent .nocs-side-card__cta{
  background:#4f46e5; border-color:#4f46e5; color:#fff;
}
.nocs-side-card--accent .nocs-side-card__cta:hover{ background:#4338ca; }

/* ============================================================
 * NOCS-MOCKUP-REFRESH (DARK) — Material 3-style dark palette
 * for the community landing. Mirrors the dark mockup exactly:
 *   surface         #0b1326   (page bg)
 *   surface-container       #171f33   (card bg)
 *   surface-container-high  #222a3d   (input/hover bg)
 *   surface-container-lowest#060e20   (Help Desk bg)
 *   surface-variant         #2d3449   (borders)
 *   outline-variant         #494454
 *   on-surface              #dae2fd   (text)
 *   on-surface-variant      #cbc3d7
 *   outline                 #958ea0   (muted text)
 *   primary                 #d0bcff   (light purple)
 *   secondary               #adc6ff   (light blue)
 *   tertiary                #4cd7f6   (cyan)
 * Tailwind-* dark accents (emerald-400/rose-400/amber-400/teal-400)
 * are kept as fixed hex tokens so the cards stay categorisable.
 * ============================================================ */
html.eu-dark .nocs-hero{
  background:linear-gradient(90deg, #1e3a8a 0%, #3b0764 50%, #831843 100%);
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}
html.eu-dark .nocs-hero__sub{ color:#cbc3d7; opacity:.92; }
html.eu-dark .nocs-hero__eyebrow{ color:#adc6ff; }

html.eu-dark .nocs-welcome__inner{
  background:#171f33; border-color:#2d3449;
  box-shadow:0 1px 3px rgba(0,0,0,.35);
}
html.eu-dark .nocs-welcome__title{ color:#dae2fd; }
html.eu-dark .nocs-welcome__sub{ color:#cbc3d7; }

html.eu-dark .nocs-quick__search{
  background:#222a3d; border-color:#2d3449;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.25);
}
html.eu-dark .nocs-quick__search .nocs-search__input{
  background:transparent; color:#dae2fd;
}
html.eu-dark .nocs-quick__search .nocs-search__input::placeholder{ color:#958ea0; }
html.eu-dark .nocs-quick__cta{
  background:#0b1326; border-color:#2d3449; color:#dae2fd;
}
html.eu-dark .nocs-quick__cta:hover{
  background:#222a3d; border-color:#494454; color:#dae2fd;
}
html.eu-dark .nocs-quick__cta-icon{ background:rgba(208,188,255,.12); color:#d0bcff; }
html.eu-dark .nocs-quick__cta--primary .nocs-quick__cta-icon{
  background:rgba(173,198,255,.15); color:#adc6ff;
}
html.eu-dark .nocs-quick__cta-text strong{ color:#dae2fd; }
html.eu-dark .nocs-quick__cta-text small{ color:#cbc3d7; }

/* Doc library — dark cards using surface-container, with the per-
 * category accent colours bumped to their *-400 dark-mode variants
 * so they stay legible on a navy field. */
html.eu-dark .nocs-lib__head h2{ color:#dae2fd; }
html.eu-dark .nocs-lib__head p{ color:#cbc3d7; }
html.eu-dark .nocs-block{
  background:#171f33; border-color:#2d3449;
  color:#dae2fd;
}
html.eu-dark .nocs-block:hover{
  border-color:#494454;
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}
html.eu-dark .nocs-block__title,
html.eu-dark .nocs-block h3{ color:#dae2fd; }
html.eu-dark .nocs-block > p{ color:#cbc3d7; }
html.eu-dark .nocs-block__links{ border-top-color:#2d3449; }
html.eu-dark .nocs-block__links a{ color:#958ea0; }
html.eu-dark .nocs-block__links a::before{ color:#494454; }

/* Per-card accent colours for dark mode — Tailwind *-400 hex. */
html.eu-dark .nocs-block--start    .nocs-block__eyebrow,
html.eu-dark .nocs-block--start    .nocs-block__more,
html.eu-dark .nocs-block--start    .nocs-block__links a:hover{ color:#d0bcff; }
html.eu-dark .nocs-block--start    .nocs-block__icon{ background:rgba(208,188,255,.12); color:#d0bcff; }

html.eu-dark .nocs-block--ops      .nocs-block__eyebrow,
html.eu-dark .nocs-block--ops      .nocs-block__more,
html.eu-dark .nocs-block--ops      .nocs-block__links a:hover{ color:#34d399; }
html.eu-dark .nocs-block--ops      .nocs-block__icon{ background:rgba(52,211,153,.12); color:#34d399; }

html.eu-dark .nocs-block--proc     .nocs-block__eyebrow,
html.eu-dark .nocs-block--proc     .nocs-block__more,
html.eu-dark .nocs-block--proc     .nocs-block__links a:hover{ color:#fb7185; }
html.eu-dark .nocs-block--proc     .nocs-block__icon{ background:rgba(251,113,133,.12); color:#fb7185; }

html.eu-dark .nocs-block--legal    .nocs-block__eyebrow,
html.eu-dark .nocs-block--legal    .nocs-block__more,
html.eu-dark .nocs-block--legal    .nocs-block__links a:hover{ color:#adc6ff; }
html.eu-dark .nocs-block--legal    .nocs-block__icon{ background:rgba(173,198,255,.14); color:#adc6ff; }

html.eu-dark .nocs-block--sla      .nocs-block__eyebrow,
html.eu-dark .nocs-block--sla      .nocs-block__more,
html.eu-dark .nocs-block--sla      .nocs-block__links a:hover{ color:#fbbf24; }
html.eu-dark .nocs-block--sla      .nocs-block__icon{ background:rgba(251,191,36,.12); color:#fbbf24; }

html.eu-dark .nocs-block--privacy  .nocs-block__eyebrow,
html.eu-dark .nocs-block--privacy  .nocs-block__more,
html.eu-dark .nocs-block--privacy  .nocs-block__links a:hover{ color:#5eead4; }
html.eu-dark .nocs-block--privacy  .nocs-block__icon{ background:rgba(94,234,212,.12); color:#5eead4; }

html.eu-dark .nocs-block--sod      .nocs-block__eyebrow,
html.eu-dark .nocs-block--sod      .nocs-block__more,
html.eu-dark .nocs-block--sod      .nocs-block__links a:hover{ color:#4cd7f6; }
html.eu-dark .nocs-block--sod      .nocs-block__icon{ background:rgba(76,215,246,.12); color:#4cd7f6; }

html.eu-dark .nocs-block--wallet   .nocs-block__eyebrow,
html.eu-dark .nocs-block--wallet   .nocs-block__more,
html.eu-dark .nocs-block--wallet   .nocs-block__links a:hover{ color:#a078ff; }
html.eu-dark .nocs-block--wallet   .nocs-block__icon{ background:rgba(160,120,255,.14); color:#a078ff; }

/* Activity row — recent posts in surface-container with subtle row
 * separators and primary-tinted titles, matching the dark mockup. */
html.eu-dark .nocs-activity__head{ border-bottom-color:#2d3449; }
html.eu-dark .nocs-activity__head h2{ color:#dae2fd; }
html.eu-dark .nocs-activity__new{ color:#d0bcff; }
html.eu-dark .nocs-recent__list{
  background:#171f33; border-color:#2d3449;
}
html.eu-dark .nocs-recent__item{
  background:transparent; border-bottom-color:#2d3449;
  color:#dae2fd;
}
html.eu-dark .nocs-recent__item:hover{ background:#222a3d; }
html.eu-dark .nocs-recent__item a{ color:#d0bcff; }
html.eu-dark .nocs-recent__item a:hover{ color:#e9ddff; }
html.eu-dark .nocs-recent__meta{ color:#958ea0; }

/* Sidebar cards — Pinned uses surface-container-high; Help Desk
 * uses surface-container-lowest with a primary-tinted label and
 * filled primary CTA. */
html.eu-dark .nocs-side-card{
  background:#222a3d; border-color:#2d3449;
}
html.eu-dark .nocs-side-card__label{ color:#958ea0; }
html.eu-dark .nocs-side-card__title{ color:#dae2fd; }
html.eu-dark .nocs-side-card__meta{ color:#cbc3d7; }
html.eu-dark .nocs-side-card__cta{
  background:#0b1326; border-color:#2d3449; color:#dae2fd;
  box-shadow:0 1px 2px rgba(0,0,0,.3);
}
html.eu-dark .nocs-side-card__cta:hover{ background:#2d3449; }
html.eu-dark .nocs-side-card--accent{
  background:#060e20; border-color:#494454;
}
html.eu-dark .nocs-side-card--accent .nocs-side-card__label{ color:#d0bcff; }
html.eu-dark .nocs-side-card--accent .nocs-side-card__cta{
  background:#d0bcff; border-color:#d0bcff; color:#3c0091;
}
html.eu-dark .nocs-side-card--accent .nocs-side-card__cta:hover{
  background:#a078ff; color:#23005c;
}

/* ============================================================
 * #10614 — CKEditor's "Rich Text Editor" voice-label was rendering
 * visibly (position:auto instead of absolute). This is a screen-
 * reader-only label; force the standard visually-hidden box so it
 * is announced to AT but never painted to the screen. Applies to
 * the new-request form, the community-post form, and ticket replies.
 * ============================================================ */
.ck-voice-label,
.ck.ck-voice-label,
.ck.ck-label.ck-voice-label{
  position:absolute !important;
  width:1px !important; height:1px !important;
  padding:0 !important; margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* ============================================================
 * #10615 — Follow button on the NOCS section page was rendering
 * with low contrast against the page background. Reuse the same
 * outlined-ghost treatment we already use for the article-level
 * follow button (#10584/#10611) so behaviour is consistent across
 * the help center.
 * ============================================================ */
/* The Zendesk-rendered Follow button has no class, only a random id
 * like `#follow-button-0.6084…`, so scope by the hero container. */
.eu-cat-hero button[id^="follow-button"],
.eu-cat-hero__sub button,
.section-tree + .section-info .follow-section,
.section-info .follow-section,
.section-page .follow-section,
.section-tree .follow-section{
  background:rgba(255,255,255,0.95) !important;
  border:1.5px solid rgba(255,255,255,0.95) !important;
  color:#1e3a8a !important;
  padding:6px 18px !important;
  border-radius:999px !important;
  font-weight:600 !important;
  font-size:13px !important;
  letter-spacing:0.01em !important;
  box-shadow:0 2px 8px rgba(0,0,0,0.18) !important;
  transition:background .15s ease, color .15s ease, transform .15s ease !important;
}
.eu-cat-hero button[id^="follow-button"]:hover,
.eu-cat-hero__sub button:hover,
.section-tree + .section-info .follow-section:hover,
.section-info .follow-section:hover,
.section-page .follow-section:hover,
.section-tree .follow-section:hover{
  background:#fff !important;
  color:#831843 !important;
  transform:translateY(-1px) !important;
}
html.eu-dark .section-info .follow-section,
html.eu-dark .section-page .follow-section,
html.eu-dark .section-tree .follow-section{
  border-color:#adc6ff !important;
  color:#adc6ff !important;
}
html.eu-dark .section-info .follow-section:hover,
html.eu-dark .section-page .follow-section:hover,
html.eu-dark .section-tree .follow-section:hover{
  background:#adc6ff !important;
  color:#001a42 !important;
}

/* ============================================================
 * #10589 / #10590 — Search bar overlap fix.
 * On the Submit-a-request and Search Results pages the search input
 * was rendering with its rounded background bleeding past the container
 * border, and the magnifier icon sat on top of the placeholder text.
 * Two issues:
 *   1. .search-container had no overflow guard, so the input's
 *      30px-radius pill could extend over the container's right edge.
 *   2. The search-icon's left:15px + width:18px (= 33px) was too close
 *      to the input's padding-left:40px on narrow widths, and on Edge
 *      the rendered icon glyph drifted into the placeholder zone.
 * Fix: tighten the icon position (10px left), increase input
 * padding-left to 38px so the icon clears the text under all rendering
 * paths, and clip overflow on the container so the pill never bleeds.
 * ============================================================ */
.sub-nav .search-container,
.search-results .search-container,
.search-results-column .search-container{
  overflow:hidden !important;
  border-radius:30px !important;
  isolation:isolate;
}
.sub-nav .search-container input[type=search],
.search-results .search-container input[type=search],
.search-results-column .search-container input[type=search]{
  padding-left:42px !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.sub-nav .search-container .search-icon,
.search-results .search-container .search-icon,
.search-results-column .search-container .search-icon{
  left:14px !important;
  width:16px !important; height:16px !important;
  z-index:2 !important;
}

/* ============================================================
 * #10589 follow-up — "the white border still looks strange"
 * ------------------------------------------------------------
 * The Submit-a-Request search bar was rendering TWO concentric
 * borders:
 *   1) the outer <form class="search"> — `border:1px solid #848F99`
 *      (line 210) with `border-radius:30px`.
 *   2) the inner <input type="search"> — the generic dark-mode
 *      override (line 1258) re-applies `border:1px solid var(--eu-border)`
 *      AND repaints `background:var(--eu-input-bg)` over the form.
 * The inner border doesn't align with the outer pill radius (the
 * input is rectangular by default), so the eye sees a faint white
 * line cutting across the rounded pill.
 *
 * Fix: inside `.sub-nav .search-container` (and the other affected
 * search surfaces), the INNER input becomes border-less + transparent;
 * the OUTER `.search` form keeps the single 1px pill border. One
 * visible ring, no nested-border mismatch in either light or dark mode.
 * ============================================================ */
.sub-nav .search-container .search,
.search-results .search-container .search,
.search-results-column .search-container .search{
  border:1px solid var(--eu-border, #d8dde6) !important;
  background:var(--eu-input-bg, #fff) !important;
  border-radius:30px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
.sub-nav .search-container .search:focus-within,
.search-results .search-container .search:focus-within,
.search-results-column .search-container .search:focus-within{
  border-color: var(--eu-accent, #154996) !important;
  box-shadow: 0 0 0 3px rgba(21,73,150,0.15) !important;
}
.sub-nav .search-container .search input[type=search],
.search-results .search-container .search input[type=search],
.search-results-column .search-container .search input[type=search]{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:30px !important;
  height:40px !important;
  min-height:40px !important;
  outline:none !important;
  color:var(--eu-text-primary, #1a0f2e) !important;
}
.sub-nav .search-container .search input[type=search]:focus,
.search-results .search-container .search input[type=search]:focus,
.search-results-column .search-container .search input[type=search]:focus{
  border:none !important;        /* fight the global "focus → 1px accent" rule */
  box-shadow:none !important;
}
.sub-nav .search-container .search input[type=search]::placeholder,
.search-results .search-container .search input[type=search]::placeholder,
.search-results-column .search-container .search input[type=search]::placeholder{
  color:var(--eu-text-muted, #87929d) !important;
}
.sub-nav .search-container .search-icon,
.search-results .search-container .search-icon,
.search-results-column .search-container .search-icon{
  color:var(--eu-text-muted, #87929d) !important;
}
/* Dark-mode token swap — the pill takes a darker surface, the icon
 * sits a touch brighter, and the focus ring keeps its accent. */
html.eu-dark .sub-nav .search-container .search,
html.eu-dark .search-results .search-container .search,
html.eu-dark .search-results-column .search-container .search{
  background:rgba(255,255,255,0.04) !important;
  border-color:rgba(255,255,255,0.12) !important;
}
html.eu-dark .sub-nav .search-container .search:focus-within,
html.eu-dark .search-results .search-container .search:focus-within,
html.eu-dark .search-results-column .search-container .search:focus-within{
  background:rgba(255,255,255,0.06) !important;
  border-color: #5b9be6 !important;
  box-shadow: 0 0 0 3px rgba(91,155,230,0.18) !important;
}
html.eu-dark .sub-nav .search-container .search input[type=search],
html.eu-dark .search-results .search-container .search input[type=search],
html.eu-dark .search-results-column .search-container .search input[type=search]{
  color:#eae4f4 !important;
}
html.eu-dark .sub-nav .search-container .search input[type=search]::placeholder,
html.eu-dark .search-results .search-container .search input[type=search]::placeholder,
html.eu-dark .search-results-column .search-container .search input[type=search]::placeholder{
  color:rgba(234,228,244,0.55) !important;
}
/* The Zendesk-rendered clear-button (×) shares the same input background.
 * Strip its inner background so we don't paint two pills on top of each
 * other when the user has typed something. */
.sub-nav .search-container .search .clear-button,
.search-results .search-container .search .clear-button,
.search-results-column .search-container .search .clear-button{
  background:transparent !important;
  border:none !important;
}

/* ============================================================
 * #10595 — Article disclaimer / info / callout blocks were rendering
 * with their inline-styled cream / pale-yellow backgrounds preserved
 * in dark mode, making the body text inside them nearly unreadable.
 * Zendesk articles use a mix of:
 *   • <table> with background-color: #ffe* / #fff8* / #fef*
 *   • <div> / <blockquote> with similar pale fills
 *   • <p style="background-color: ..."> for inline highlights
 * In dark mode invert these to a soft accent surface (deep navy with
 * a warm tint) so the text inherits the article's white body color.
 * Limited to .article-body so we don't repaint editor surfaces.
 * ============================================================ */
html.eu-dark .article-body table[style*="background-color: #ff"],
html.eu-dark .article-body table[style*="background:#ff"],
html.eu-dark .article-body table[style*="background: #ff"],
html.eu-dark .article-body td[style*="background-color: #ff"],
html.eu-dark .article-body td[style*="background-color: #fef"],
html.eu-dark .article-body td[style*="background-color: #fff"],
html.eu-dark .article-body td[style*="background-color: #ffe"],
html.eu-dark .article-body td[style*="background-color: #ffd"],
html.eu-dark .article-body div[style*="background-color: #ff"],
html.eu-dark .article-body div[style*="background: #ff"],
html.eu-dark .article-body blockquote[style*="background"],
html.eu-dark .article-body p[style*="background-color: #ff"],
html.eu-dark .article-body span[style*="background-color: #ff"]{
  background:rgba(251, 191, 36, 0.10) !important;
  background-color:rgba(251, 191, 36, 0.10) !important;
  border:1px solid rgba(251, 191, 36, 0.25) !important;
  color:#dae2fd !important;
}
/* Force any text-color inversions on inline-styled inner spans/strongs
 * inside disclaimer blocks — they're sometimes set to a dark colour
 * for the cream background and inherit poorly on dark navy. */
html.eu-dark .article-body table[style*="background"] *,
html.eu-dark .article-body td[style*="background-color: #ff"] *,
html.eu-dark .article-body div[style*="background-color: #ff"] *,
html.eu-dark .article-body blockquote[style*="background"] *,
html.eu-dark .article-body p[style*="background-color: #ff"] *{
  color:inherit !important;
}
/* Class-based callouts (Zendesk and authored variants). */
html.eu-dark .article-body .callout,
html.eu-dark .article-body .note,
html.eu-dark .article-body .disclaimer,
html.eu-dark .article-body .info-block,
html.eu-dark .article-body .alert{
  background:rgba(76, 215, 246, 0.08) !important;
  border:1px solid rgba(76, 215, 246, 0.25) !important;
  color:#dae2fd !important;
}

/* ============================================================
 * #10589 / #10590 (refined) — the actual search markup on
 * /requests/new and /search uses .eu-cat-hero__search rather than
 * .search-container. The pill background was bleeding past the
 * container's right edge and the clear-button (X) sat outside the
 * pill with its own white square. Wrap the input + clear button
 * inside a single pill, contain overflow, and float the magnifier
 * properly inside the input padding so it doesn't overlap text.
 * ============================================================ */
.eu-cat-hero__search{
  position:relative;
  max-width:520px; margin:14px auto 0;
}
.eu-cat-hero__search > div,
.eu-cat-hero__search > form,
.eu-cat-hero__search > form.search,
.eu-cat-hero__search-inner{
  position:relative;
  display:flex; align-items:center;
  background:rgba(255,255,255,0.96) !important;
  border-radius:999px !important;
  overflow:hidden !important;
  box-shadow:0 4px 14px rgba(0,0,0,0.18) !important;
}
.eu-cat-hero__search input[type="search"],
.eu-cat-hero__search input[type="text"],
.eu-cat-hero__search .search-input{
  background:transparent !important;
  border:none !important;
  border-radius:0 !important;
  color:#1e3a8a !important;
  padding:12px 14px 12px 44px !important;
  font-size:14px !important;
  width:100% !important;
  height:44px !important;
  box-sizing:border-box !important;
  outline:none !important;
}
.eu-cat-hero__search input::placeholder{
  color:rgba(30,58,138,0.55) !important;
}
.eu-cat-hero__search input:focus{
  outline:none !important;
  box-shadow:none !important;
}
/* Magnifier icon as an input background-image — survives any stacking
 * context shenanigans that ::before would have to fight. */
.eu-cat-hero__search input[type="search"],
.eu-cat-hero__search input[type="text"],
.eu-cat-hero__search .search-input{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231e3a8a' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>") !important;
  background-repeat:no-repeat !important;
  background-position:16px center !important;
  background-size:16px 16px !important;
}
/* Hide the inline .search-icon SVG (we paint via background-image). */
.eu-cat-hero__search .search-icon{ display:none !important; }
/* Clear (X) button — pull it inside the pill, simplify look. */
.eu-cat-hero__search button[aria-label*="Clear" i],
.eu-cat-hero__search button[aria-label*="clear" i],
.eu-cat-hero__search button[type="reset"],
.eu-cat-hero__search button[class*="clear" i]{
  background:transparent !important;
  border:none !important;
  color:rgba(30,58,138,0.6) !important;
  padding:0 14px 0 8px !important;
  height:44px !important;
  display:flex; align-items:center;
  cursor:pointer;
}
.eu-cat-hero__search button[aria-label*="Clear" i]:hover,
.eu-cat-hero__search button[type="reset"]:hover{
  color:#831843 !important;
}

/* ============================================================
 * #10612 — Description CKEditor was rendering with white background
 * in dark mode, making typed text barely visible. Force the editor's
 * editable area, the toolbar surface, and any UI siblings to dark
 * tokens that match the surrounding form. CKEditor 5's classes:
 *   .ck-editor__main > .ck-editor__editable_inline (textarea body)
 *   .ck.ck-toolbar                                  (top toolbar)
 *   .ck.ck-balloon-panel                            (popups)
 *   .ck-content                                     (rich-text body)
 * ============================================================ */
html.eu-dark .ck-editor,
html.eu-dark .ck.ck-editor,
html.eu-dark .ck.ck-editor__main,
html.eu-dark .ck.ck-editor__main > .ck-editor__editable,
html.eu-dark .ck-editor__editable_inline,
html.eu-dark .ck.ck-content,
html.eu-dark .ck.ck-toolbar,
html.eu-dark .ck.ck-toolbar__items,
html.eu-dark .ck.ck-list,
html.eu-dark .ck.ck-dropdown__panel,
html.eu-dark .ck.ck-balloon-panel{
  background:#171f33 !important;
  background-color:#171f33 !important;
  color:#dae2fd !important;
  border-color:#2d3449 !important;
}
html.eu-dark .ck.ck-toolbar{
  background:#222a3d !important;
  border-bottom:1px solid #2d3449 !important;
}
html.eu-dark .ck.ck-button,
html.eu-dark .ck.ck-list__item .ck-button{
  color:#dae2fd !important;
}
html.eu-dark .ck.ck-button:hover,
html.eu-dark .ck.ck-button.ck-on{
  background:#2d3449 !important;
  color:#fff !important;
}
html.eu-dark .ck-content p,
html.eu-dark .ck-content li,
html.eu-dark .ck-content blockquote,
html.eu-dark .ck-content h2,
html.eu-dark .ck-content h3,
html.eu-dark .ck-content h4,
html.eu-dark .ck-content strong,
html.eu-dark .ck-content em{
  color:#dae2fd !important;
}
html.eu-dark .ck-content a{ color:#adc6ff !important; }
html.eu-dark .ck.ck-input,
html.eu-dark .ck.ck-input-text{
  background:#0b1326 !important; color:#dae2fd !important;
  border-color:#2d3449 !important;
}

/* ============================================================
 * #10605 — Some parts of the Submit-a-request page didn't switch
 * to dark mode (mostly the renderer's React-bundled chrome that
 * uses inline white backgrounds). Cover the Zendesk-form renderer's
 * surfaces with explicit dark-mode rules so the colour transition
 * is uniform.
 * ============================================================ */
html.eu-dark #new-request-form,
html.eu-dark #new-request-form > div,
html.eu-dark .request-form,
html.eu-dark .form .form-field,
html.eu-dark .form select,
html.eu-dark .form input[type="text"],
html.eu-dark .form input[type="email"],
html.eu-dark .form textarea{
  background-color:#171f33 !important;
  color:#dae2fd !important;
  border-color:#2d3449 !important;
}
html.eu-dark .form select option{
  background:#171f33 !important;
  color:#dae2fd !important;
}
html.eu-dark .form input::placeholder,
html.eu-dark .form textarea::placeholder{
  color:#958ea0 !important;
}
html.eu-dark .form label,
html.eu-dark .form .form-field label{
  color:#cbc3d7 !important;
}

/* ============================================================
 * #10613 — Required-field warning icon clipped/cropped because
 * the form renderer's inline icon used a fixed pixel height and
 * a tight overflow on the surrounding error pill. Force a
 * minimum size and clear overflow so the icon is fully visible.
 * Zendesk renders the error inside a red pill with class names
 * like .form-field-error / [role="alert"].
 * ============================================================ */
.form-field-error,
.form .form-field [role="alert"],
[data-test-id*="error-message" i]{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  overflow:visible !important;
  padding:6px 10px !important;
  line-height:1.4 !important;
}
/* The bundled <svg> warning icon is cropped on first render — the React
 * tree sets width/height inline but the wrapping span clips it. Hide the
 * inline svg entirely and draw a CSS-painted triangle-warning glyph via
 * ::before. Self-contained, no asset dependencies, works at any zoom. */
.form-field-error svg,
.form .form-field [role="alert"] svg,
[data-test-id*="error-message" i] svg{
  display:none !important;
}
.form-field-error::before,
.form .form-field [role="alert"]::before,
[data-test-id*="error-message" i]::before{
  content:'';
  flex-shrink:0;
  width:16px; height:16px;
  background-color: currentColor;
  /* Triangle-exclamation glyph as a CSS mask. Source vector is hand-pathed
   * (16×16, single fill rule) so the mask works identically on Chromium /
   * WebKit / Firefox. */
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z'/><line x1='12' y1='9' x2='12' y2='13'/><line x1='12' y1='17' x2='12.01' y2='17'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z'/><line x1='12' y1='9' x2='12' y2='13'/><line x1='12' y1='17' x2='12.01' y2='17'/></svg>") center/contain no-repeat;
}

/* ============================================================
 * #10603 — Login page had two links that both go to the password
 * reset flow ("Forgot password?" and "Request password" inside
 * the help text). The second is configured via the Sign-in
 * Help message in Admin → Account → Sign-in. Until that's
 * cleaned up server-side, hide the duplicate "Request password"
 * link in the help message so end users see one path only.
 * Targets the "Emailed us for support? Request password" line.
 * ============================================================ */
/* The canonical "Forgot password?" link is the one Zendesk renders BELOW
 * the password field — that lives inside the form (.signin-form, or the
 * `.sign-in-form` legacy class) and stays visible. Everything else is the
 * admin-customisable help text below the Sign-in button, which on this
 * portal duplicates the same flow as "Request password". We hide every
 * password-reset link that lives OUTSIDE the form itself. */
.sign-in-help-text a[href*="forgot"],
.sign-in-help-text a[href*="reset"],
.sign-in-help-text a[href*="password"],
.help-text a[href*="reset"],
.help-text a[href*="forgot"],
.help-text a[href*="password"],
/* Zendesk auth v2: the help message renders inside .sign-in-help and the
 * sentence is split across siblings — drop the whole paragraph. */
.sign-in-help p:has(a[href*="password"]),
.sign-in-help p:has(a[href*="forgot"]),
.sign-in-help p:has(a[href*="reset"]),
/* Belt-and-braces: anywhere the link text reads "Request password" */
[class*="sign-in"] a[href*="password"]:not([data-test-id="forgot-password-link"]):not(.sign-in__forgot-password):not(.signin-form__forgot-password){
  display:none !important;
}
.sign-in-help-text:has(a[href*="reset"]),
.sign-in-help-text:has(a[href*="forgot"]),
.sign-in-help:has(a[href*="password"]){
  display:none !important;
}

/* Anonymous users hitting the NOCS topic page now see the inline deny
 * tree rendered by the template gate. Add a secondary "back to public
 * help center" link below the primary CTA. */
.nocs-deny__alt{
  display:inline-block;
  margin-top:14px; margin-left:14px;
  color:var(--eu-text-muted, #6b7280);
  font-size:13px; text-decoration:underline;
}
.nocs-deny__alt:hover{ color:var(--eu-accent, #154996); }
html.eu-dark .nocs-deny__alt{ color:#958ea0; }
html.eu-dark .nocs-deny__alt:hover{ color:#adc6ff; }

/* ============================================================
 * AUDIT-FIXES (2026-05-07) — A1, A2, A3, A4
 * ============================================================ */

/* A1 — Logo wordmark vanishes in dark mode (the embedded PNG glyphs
 * are deep-navy, invisible on the dark navy header). Replace the
 * positive wordmark with a CSS-painted EUROPEUM text in dark mode by
 * hiding the raster image and showing a styled span. The visually-
 * hidden screen-reader span (.eu-brand-name) is promoted to visible
 * in dark mode so we still paint a wordmark; the gradient hexagon
 * mark is shown via the existing europeum-symbol.svg as a small img. */
html.eu-dark .eu-header-logo{
  /* The embedded PNG glyphs in this SVG are deep-navy; an inversion
   * filter flips their colour to soft cream while leaving the
   * gradient hexagon mark almost untouched (it gets brightened, which
   * actually reads better on dark backgrounds). */
  filter: invert(0.92) hue-rotate(180deg) brightness(1.05) saturate(1.1) !important;
}
html.eu-dark .header .logo a{ gap:0 !important; }

/* A2 — Hero h1 text is dark navy on the gradient hero in light mode,
 * making it almost unreadable. Force white on every gradient-hero
 * heading + breadcrumb. */
.eu-cat-hero h1,
.eu-cat-hero__title,
.eu-cat-hero__inner h1,
.article-header.eu-cat-hero h1,
.section-info h1,
.section-page h1,
.eu-cat-hero .breadcrumbs,
.eu-cat-hero .breadcrumbs a,
.eu-cat-hero__sub,
.eu-cat-hero__inner p{
  color:#fff !important;
}
.eu-cat-hero .breadcrumbs a:hover{
  color:rgba(255,255,255,0.85) !important;
  text-decoration:underline !important;
}

/* A3 — Ticket detail right-sidebar values render as dark grey on dark
 * navy in dark mode. Lift the dd colour to the standard light text
 * so values are as readable as labels. */
html.eu-dark .request-details dd,
html.eu-dark .request-details dd a,
html.eu-dark .request-details dd .meta-data{
  color:#dae2fd !important;
}
html.eu-dark .request-details dt{
  color:#cbc3d7 !important;
}
/* Also fix the "Linked EBSI nodes" + "SLA" panel values in dark mode. */
html.eu-dark .eu-req-panel,
html.eu-dark .eu-req-panel__title{
  color:#cbc3d7 !important;
}
html.eu-dark .eu-req-node-host,
html.eu-dark .eu-req-sla dd,
html.eu-dark .eu-req-sla dt{
  color:#dae2fd !important;
}
html.eu-dark .eu-req-sla dt{ color:#958ea0 !important; }

/* A4 — Home action-cards row stays in 3 columns at narrow widths; on
 * phones it must stack so the "Submit a", "My", "Node" labels aren't
 * truncated. Wrap responsive at 720 / 480 px breakpoints. */
@media (max-width: 720px){
  .t-actions{
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (max-width: 480px){
  .t-actions{
    grid-template-columns: 1fr !important;
  }
  .t-action{ min-height:auto !important; }
}

/* A3 follow-up — request-sidebar container itself was rendering with
 * `background: rgb(247,247,247)` in dark mode, creating a light panel
 * floating over the dark page. Force the dark surface so the readable
 * values from the previous A3 rule actually sit on the right surface. */
html.eu-dark .request-sidebar,
html.eu-dark .collapsible-sidebar,
html.eu-dark aside.request-sidebar{
  background:#171f33 !important;
  color:#dae2fd !important;
  border:1px solid #2d3449 !important;
  border-radius:12px !important;
}
html.eu-dark .collapsible-sidebar-title{ color:#dae2fd !important; }
html.eu-dark .collapsible-sidebar-toggle{ color:#cbc3d7 !important; }

/* ============================================================
 * DARK-MODE SWEEP — surfaces that still rendered with their
 * Zendesk-default light backgrounds when the theme switched
 * to dark. Caught in the audit pass.
 * ============================================================ */

/* Requests-list page: search-input wrapper + table THEAD were both
 * shipping `rgb(255,255,255)` from the bundled requests bundle. */
html.eu-dark .requests-table thead,
html.eu-dark .requests-list thead,
html.eu-dark table[class*="request" i] thead,
html.eu-dark table thead{
  background:#222a3d !important;
  color:#cbc3d7 !important;
}
html.eu-dark .requests-table thead th,
html.eu-dark table thead th{
  background:#222a3d !important;
  color:#cbc3d7 !important;
  border-bottom-color:#2d3449 !important;
}
html.eu-dark .requests-table tbody tr,
html.eu-dark table tbody tr{
  background:transparent !important;
}
html.eu-dark .requests-table tbody tr:hover,
html.eu-dark table tbody tr:hover{
  background:rgba(255,255,255,0.03) !important;
}
/* Requests-list search input wrapper (the white box artifact). */
html.eu-dark form[action*="/requests"] input[type="search"],
html.eu-dark .requests-search input,
html.eu-dark .request-search-form input,
html.eu-dark form[role="search"] input[type="text"],
html.eu-dark form[role="search"] input[type="search"]{
  background:#222a3d !important;
  color:#dae2fd !important;
  border-color:#2d3449 !important;
}
html.eu-dark form[action*="/requests"] > div,
html.eu-dark form[role="search"] > div{
  background:transparent !important;
}

/* Search-results sidenav current/active item — was rgb(233,235,237). */
html.eu-dark .search-results-sidebar .sidenav-item,
html.eu-dark .sidenav-item{
  background:transparent !important;
  color:#cbc3d7 !important;
}
html.eu-dark .search-results-sidebar .sidenav-item.current,
html.eu-dark .search-results-sidebar .sidenav-item:hover,
html.eu-dark .sidenav-item.current,
html.eu-dark .sidenav-item:hover{
  background:#222a3d !important;
  color:#dae2fd !important;
}

/* Ticket-detail "Add to conversation" collapsed button — the bundled
 * Copenhagen `.comment-show-container` was light grey. */
html.eu-dark .comment-show-container,
html.eu-dark button.comment-show-container{
  background:#171f33 !important;
  color:#cbc3d7 !important;
  border:1px solid #2d3449 !important;
}
html.eu-dark .comment-show-container:hover{
  background:#222a3d !important;
  color:#dae2fd !important;
}

/* Defensive: any remaining bundled component that still ships a hard
 * `rgb(255,255,255)` inline style inside the request page. Limit scope
 * to .request-container so we don't repaint articles. */
html.eu-dark .request-container [style*="background-color: #fff"],
html.eu-dark .request-container [style*="background-color:#fff"],
html.eu-dark .request-container [style*="background: #fff"]{
  background:#171f33 !important;
  background-color:#171f33 !important;
  color:#dae2fd !important;
}

/* Zendesk Garden styled-components on the requests-list page —
 * StyledTextInput / StyledTextMediaInput wrappers + the bare div
 * around them ship inline white backgrounds. Match by partial
 * class name so we don't have to fork the bundle. */
html.eu-dark [class*="StyledTextInput"],
html.eu-dark [class*="StyledTextMediaInput"],
html.eu-dark [class*="StyledTextField"],
html.eu-dark .request-table-search,
html.eu-dark form[role="search"] [class*="Styled"]{
  background:#222a3d !important;
  background-color:#222a3d !important;
  color:#dae2fd !important;
  border-color:#2d3449 !important;
}
html.eu-dark [class*="StyledTextInput"]::placeholder,
html.eu-dark [class*="StyledTextMediaInput"]::placeholder{
  color:#958ea0 !important;
}
/* The styled wrapper around the input + magnifier icon. */
html.eu-dark form[role="search"] > [class*="Styled"],
html.eu-dark [class*="StyledFauxInput"]{
  background:#222a3d !important;
  border:1px solid #2d3449 !important;
}

/* ============================================================
 * AUDIT-FIXES (cont.) — A6, A7
 * ============================================================ */

/* A6 — Home action cards: the primary "Submit a request" had a
 * gradient-border ::before treatment that the other two cards
 * didn't share. Visually it read as one polished card next to two
 * unfinished ones. Drop the ::before pseudo so the three cards
 * use the same chrome (border + shadow + hover lift); the primary
 * stays distinguished by its tinted background and gradient icon. */
.t-action--primary::before{ display:none !important; }

/* Lift the primary tint slightly so it still reads as featured
 * without needing a border ring. */
.t-action--primary{
  background:linear-gradient(135deg, rgba(21,73,150,0.06), rgba(192,26,133,0.05)) !important;
  border-color:rgba(21,73,150,0.18) !important;
}
.eu-dark .t-action--primary{
  background:linear-gradient(135deg, rgba(91,155,230,0.10), rgba(232,74,173,0.08)) !important;
  border-color:rgba(91,155,230,0.30) !important;
}

/* Equalise the secondary (Node Operations) ops card too — the
 * inset magenta shadow gave it a third distinct treatment. Drop
 * it; let the icon colour do the differentiation. */
.t-action--ops{ box-shadow:var(--eu-shadow) !important; }

/* A7 — Hero brand-mark watermark on the right was almost invisible
 * (opacity 0.08 / 0.14). Bump to a level where it reads as a
 * deliberate background motif, not a missing image. */
.t-hero__cubes{ opacity:0.18 !important; }
.eu-dark .t-hero__cubes{ opacity:0.22 !important; }

/* A2 follow-up — article-page hero uses .eu-art-hero (not .eu-cat-hero).
 * The global `h1{color:var(--eu-text-primary)!important}` rule was
 * winning over the gradient-hero white text for article titles +
 * breadcrumbs. Extend the white-text override to all gradient-hero
 * classes used across the theme. */
.eu-art-hero h1,
.eu-art-hero__title,
.eu-art-hero__inner h1,
.eu-art-hero .breadcrumbs,
.eu-art-hero .breadcrumbs a,
.eu-art-hero__sub,
.eu-art-hero__inner p,
.eu-art-hero__meta,
.eu-art-hero__meta a{
  color:#fff !important;
}
.eu-art-hero .breadcrumbs a:hover{
  color:rgba(255,255,255,0.85) !important;
  text-decoration:underline !important;
}

/* ─── ENV-SUMMARY WIDGET ─────────────────────────────────────────
   Per-environment ticket breakdown shown on the Node Operations
   dashboard. Renders 3 env rows × 2 cells (NO + UC) so an operator
   can see at a glance how their tickets sit per environment and per
   source. Numbers come from renderEnvSummary() in requests_page.hbs.
   Click-to-filter routes through the same path as the court CTAs.
   ───────────────────────────────────────────────────────────────── */
.eu-v3-envsum{
  background:#fff;
  border:1px solid var(--eu-border);
  border-radius:14px;
  padding:18px 20px;
  margin:0 0 18px 0;
}
html.eu-dark .eu-v3-envsum{
  background:rgba(255,255,255,0.03);
  border-color:rgba(255,255,255,0.10);
}
.eu-v3-envsum__hd{ margin:0 0 14px 0; }
.eu-v3-envsum__hd-t{
  display:flex; align-items:center; gap:8px;
  font-size:13px; font-weight:700; letter-spacing:0.3px;
  color:var(--eu-text-primary);
}
.eu-v3-envsum__hd-i{ color:#154996; flex:0 0 auto; }
html.eu-dark .eu-v3-envsum__hd-i{ color:#c01a85; }
.eu-v3-envsum__hd-sub{
  margin-top:4px;
  font-size:11px; color:var(--eu-text-muted);
}
.eu-v3-envsum__grid{
  display:grid;
  grid-template-columns:140px 1fr 1fr;
  gap:8px 14px;
  align-items:stretch;
}
.eu-v3-envsum__row-label{
  display:flex; align-items:center; gap:8px;
  font-size:12px; font-weight:700;
  color:var(--eu-text-primary);
  padding:8px 0;
  border-right:1px dashed var(--eu-border);
}
html.eu-dark .eu-v3-envsum__row-label{ border-right-color:rgba(255,255,255,0.10); }
.eu-v3-envsum__row-dot{
  width:8px; height:8px; border-radius:999px; flex:0 0 auto;
}
.eu-v3-envsum__row-dot--prod{    background:#1850b5; }
.eu-v3-envsum__row-dot--preprod{ background:#7e3380; }
.eu-v3-envsum__row-dot--pilot{   background:#2e8060; }
.eu-v3-envsum__cell{
  display:flex; align-items:center; gap:10px;
  padding:8px 12px;
  border-radius:8px;
  background:#fbf9ff;
  cursor:pointer;
  transition:background-color .15s, transform .15s;
}
.eu-v3-envsum__cell:hover{ background:#f3eff8; transform:translateY(-1px); }
html.eu-dark .eu-v3-envsum__cell{ background:rgba(255,255,255,0.04); }
html.eu-dark .eu-v3-envsum__cell:hover{ background:rgba(255,255,255,0.08); }
.eu-v3-envsum__cell-src{
  font-size:10px; font-weight:700; letter-spacing:0.6px;
  text-transform:uppercase;
  padding:3px 8px; border-radius:6px;
  color:#fff; flex:0 0 auto;
}
.eu-v3-envsum__cell-src--no{ background:#154996; }
.eu-v3-envsum__cell-src--uc{ background:#c01a85; }
.eu-v3-envsum__cell-n{
  font-size:18px; font-weight:800; letter-spacing:-0.5px;
  color:var(--eu-text-primary); line-height:1;
}
.eu-v3-envsum__cell-d{
  font-size:11px; color:var(--eu-text-muted);
  margin-left:auto; text-align:right; line-height:1.3;
}
.eu-v3-envsum__cell-d strong{ color:var(--eu-text-primary); font-weight:700; }
.eu-v3-envsum__cell--empty{ opacity:0.55; cursor:default; }
.eu-v3-envsum__cell--empty:hover{ transform:none; background:#fbf9ff; }
html.eu-dark .eu-v3-envsum__cell--empty:hover{ background:rgba(255,255,255,0.04); }

@media (max-width:680px){
  .eu-v3-envsum__grid{ grid-template-columns:1fr; gap:6px; }
  .eu-v3-envsum__row-label{ border-right:none; border-bottom:1px dashed var(--eu-border); padding-bottom:6px; }
  html.eu-dark .eu-v3-envsum__row-label{ border-bottom-color:rgba(255,255,255,0.10); }
}

/* ════════════════════════════════════════════════════════════════
   FAQ CATEGORY + SECTION — branded layouts matching the EBSI FAQ.
   Lives at the bottom of style.css so it can override any earlier
   eu-cat-* rules safely. Scoped to .eu-faq-* so no collision.
   ════════════════════════════════════════════════════════════════ */

/* ── Category landing (FAQ home: 4-card grid) ──────────────────── */
.eu-faq-page{ font-family:Inter,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; color:#200c36; }

.eu-faq-hero{
  position:relative;
  background:
    radial-gradient(circle at 12% 30%, rgba(192,26,133,0.10), transparent 55%),
    radial-gradient(circle at 88% 70%, rgba(21,73,150,0.10), transparent 55%),
    linear-gradient(180deg, #f6f4fb 0%, #fbf9ff 100%);
  padding:48px 24px 56px;
  overflow:hidden;
  border-bottom:3px solid transparent;
  border-image:linear-gradient(90deg,#154996,#7e3380,#c01a85) 1;
}
html.eu-dark .eu-faq-hero{
  background:
    radial-gradient(circle at 12% 30%, rgba(192,26,133,0.20), transparent 55%),
    radial-gradient(circle at 88% 70%, rgba(21,73,150,0.20), transparent 55%),
    linear-gradient(180deg, #160828 0%, #200c36 100%);
}
.eu-faq-hero__inner{
  max-width:1100px; margin:0 auto;
  display:grid; grid-template-columns:auto 1fr auto;
  gap:32px; align-items:center;
}
.eu-faq-hero__copy{ text-align:center; }
.eu-faq-hero__title{
  margin:0 0 8px;
  font-size:36px; font-weight:800;
  letter-spacing:-0.5px;
  background:linear-gradient(90deg,#154996 0%, #7e3380 55%, #c01a85 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.eu-faq-hero__sub{
  margin:0 auto; max-width:540px;
  font-size:14px; line-height:1.6; color:#4a4361;
}
html.eu-dark .eu-faq-hero__sub{ color:#b3a8d0; }
.eu-faq-hero__art{ flex:0 0 auto; opacity:0.95; }
@media (max-width:780px){
  .eu-faq-hero__inner{ grid-template-columns:1fr; gap:16px; }
  .eu-faq-hero__art{ display:none; }
  .eu-faq-hero__art--left{ display:block; }
}

.eu-faq-grid{
  max-width:1100px; margin:36px auto 28px; padding:0 24px;
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
}
.eu-faq-card{
  display:flex; flex-direction:column; gap:10px;
  background:#fff;
  border:1px solid #ece7f6; border-radius:14px;
  padding:24px 22px;
  text-decoration:none; color:inherit;
  transition:transform .15s, box-shadow .15s, border-color .15s;
  position:relative; overflow:hidden;
}
html.eu-dark .eu-faq-card{ background:rgba(255,255,255,0.03); border-color:rgba(255,255,255,0.10); }
.eu-faq-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:linear-gradient(180deg,#154996,#c01a85);
  opacity:0; transition:opacity .15s;
}
.eu-faq-card:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 24px rgba(32,12,54,0.08);
  border-color:#c01a85;
}
.eu-faq-card:hover::before{ opacity:1; }
.eu-faq-card__icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg, rgba(21,73,150,0.10), rgba(192,26,133,0.10));
  color:#7e3380;
  margin-bottom:6px;
}
.eu-faq-card__title{
  margin:0; font-size:17px; font-weight:700; color:var(--eu-text-primary, #200c36);
}
.eu-faq-card__desc{
  margin:0; font-size:13px; line-height:1.6; color:#6b6480;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
html.eu-dark .eu-faq-card__desc{ color:#a89ec8; }
.eu-faq-card__cta{
  margin-top:auto;
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 16px; align-self:flex-start;
  background:linear-gradient(90deg,#c01a85,#7e3380);
  color:#fff; border-radius:999px;
  font-size:12px; font-weight:700; letter-spacing:0.4px;
}
.eu-faq-card:hover .eu-faq-card__cta{ background:linear-gradient(90deg,#154996,#c01a85); }

/* ── Help-CTA footer block ────────────────────────────────────── */
.eu-faq-help{
  max-width:1100px; margin:24px auto 56px; padding:24px 28px;
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
  background:#fff;
  border:1px solid #ece7f6; border-radius:14px;
  position:relative; overflow:hidden;
}
.eu-faq-help::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at -10% 50%, rgba(192,26,133,0.06), transparent 50%);
  pointer-events:none;
}
html.eu-dark .eu-faq-help{ background:rgba(255,255,255,0.03); border-color:rgba(255,255,255,0.10); }
.eu-faq-help__title{ margin:0 0 4px; font-size:18px; font-weight:700; }
.eu-faq-help__desc{ margin:0; font-size:13px; color:#6b6480; }
html.eu-dark .eu-faq-help__desc{ color:#a89ec8; }
.eu-faq-help__cta{
  display:inline-flex; align-items:center; gap:6px;
  padding:11px 20px;
  background:linear-gradient(90deg,#154996,#c01a85);
  color:#fff !important; text-decoration:none;
  border-radius:999px;
  font-size:13px; font-weight:700; letter-spacing:0.3px;
  white-space:nowrap;
  position:relative; z-index:1;
}
.eu-faq-help__cta:hover{ opacity:0.92; }

/* ── Section page (FAQ accordion) ─────────────────────────────── */
.eu-faq-section{ font-family:Inter,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; color:#200c36; }

/* Per-section hero accent colour */
.eu-faq-shero{
  padding:48px 24px; color:#fff;
  background:linear-gradient(135deg, #154996 0%, #7e3380 60%, #c01a85 100%);
  position:relative; overflow:hidden;
}
.eu-faq-section--27388121967900 .eu-faq-shero{ background:linear-gradient(135deg,#0e3a82 0%, #154996 55%, #3a6dc4 100%); } /* About EBSI: blues */
.eu-faq-section--27388145427996 .eu-faq-shero{ background:linear-gradient(135deg,#7e3380 0%, #a52488 50%, #c01a85 100%); } /* Node Operators: magentas */
.eu-faq-section--27388145521564 .eu-faq-shero{ background:linear-gradient(135deg,#0e3a82 0%, #1850b5 55%, #4a87ed 100%); } /* Integrations & APIs: royal */
.eu-faq-section--27388145617436 .eu-faq-shero{ background:linear-gradient(135deg,#1d6047 0%, #2e8060 55%, #4ea886 100%); } /* Wallet Conformance: forest */
.eu-faq-shero__inner{
  max-width:1100px; margin:0 auto;
  display:grid; grid-template-columns:1fr auto; gap:36px; align-items:center;
}
.eu-faq-shero__back{
  display:inline-flex; align-items:center; gap:6px;
  color:rgba(255,255,255,0.85); text-decoration:none;
  font-size:12px; font-weight:600; letter-spacing:0.4px;
  text-transform:uppercase; margin-bottom:14px;
}
.eu-faq-shero__back:hover{ color:#fff; }
.eu-faq-shero__title{ margin:0 0 8px; font-size:36px; font-weight:800; letter-spacing:-0.5px; line-height:1.1; }
.eu-faq-shero__sub{ margin:0; max-width:560px; font-size:15px; line-height:1.6; color:rgba(255,255,255,0.88); }
.eu-faq-shero__meta{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-top:16px;
}
.eu-faq-shero__count{
  display:inline-block; padding:5px 12px; border-radius:999px;
  background:rgba(255,255,255,0.18);
  font-size:12px; font-weight:700; letter-spacing:0.4px;
}
.eu-faq-shero__follow .follow-button,
.eu-faq-shero__follow button{
  background:#fff !important; color:#200c36 !important;
  border:none !important; border-radius:999px !important;
  padding:6px 14px !important; font-weight:700 !important;
}
@media (max-width:780px){
  .eu-faq-shero__inner{ grid-template-columns:1fr; }
  .eu-faq-shero__art{ display:none; }
}

/* Layout: main + right rail */
.eu-faq-layout{
  max-width:1100px; margin:28px auto 56px; padding:0 24px;
  display:grid; gap:28px;
  grid-template-columns:1fr 260px;
  align-items:start;
}
@media (max-width:880px){ .eu-faq-layout{ grid-template-columns:1fr; } }
.eu-faq-main{ min-width:0; }

.eu-faq-introbar{
  display:flex; align-items:flex-start; gap:10px;
  padding:14px 18px; margin-bottom:16px;
  background:#fbf9ff; border:1px solid #ece7f6; border-radius:12px;
  font-size:13px; line-height:1.55; color:#4a4361;
}
html.eu-dark .eu-faq-introbar{ background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.10); color:#cabad9; }
.eu-faq-introbar__icon{ color:#7e3380; flex:0 0 auto; margin-top:1px; }

/* Q-cards */
.eu-faq-qlist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.eu-faq-q{ padding:0; }
.eu-faq-q__det{
  background:#fff;
  border:1px solid #ece7f6; border-radius:12px;
  overflow:hidden;
  transition:border-color .15s, box-shadow .15s;
}
html.eu-dark .eu-faq-q__det{ background:rgba(255,255,255,0.03); border-color:rgba(255,255,255,0.10); }
.eu-faq-q__det[open]{
  border-color:#c01a85;
  box-shadow:0 4px 18px rgba(32,12,54,0.06);
}
.eu-faq-q__summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; gap:14px;
  padding:16px 20px;
  font-size:15px; font-weight:600; color:var(--eu-text-primary,#200c36);
  user-select:none;
}
.eu-faq-q__summary::-webkit-details-marker{ display:none; }
.eu-faq-q__num{
  flex:0 0 auto;
  width:28px; height:28px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#154996,#7e3380);
  color:#fff; font-size:12px; font-weight:800;
  font-family:Inter,Helvetica,Arial,sans-serif;
}
.eu-faq-q__title{ flex:1; line-height:1.4; }
.eu-faq-q__icon{
  color:#7e3380; flex:0 0 auto;
  transition:transform .2s;
}
.eu-faq-q__det[open] .eu-faq-q__icon{ transform:rotate(180deg); }
.eu-faq-q__body{
  padding:0 20px 8px 62px;
  font-size:14px; line-height:1.65; color:#2c2640;
}
html.eu-dark .eu-faq-q__body{ color:#d3c7e8; }
.eu-faq-q__body p:first-child{ margin-top:0; }
.eu-faq-q__skeleton{
  display:flex; flex-direction:column; gap:8px; padding:6px 0;
}
.eu-faq-q__skeleton span{
  display:block; height:10px; border-radius:4px;
  background:linear-gradient(90deg, #ece7f6 0%, #fbf9ff 50%, #ece7f6 100%);
  background-size:200% 100%;
  animation:eu-faq-skeleton 1.2s infinite;
}
.eu-faq-q__skeleton span:nth-child(2){ width:90%; }
.eu-faq-q__skeleton span:nth-child(3){ width:65%; }
@keyframes eu-faq-skeleton{ 0%{ background-position:200% 0; } 100%{ background-position:-200% 0; } }
.eu-faq-q__foot{
  padding:8px 20px 16px 62px;
  display:flex; justify-content:flex-end;
}
.eu-faq-q__det:not([open]) .eu-faq-q__foot{ display:none; }
.eu-faq-q__open{
  display:inline-flex; align-items:center; gap:5px;
  font-size:12px; font-weight:700; letter-spacing:0.3px;
  color:#c01a85; text-decoration:none;
}
.eu-faq-q__open:hover{ color:#7e3380; }

.eu-faq-empty{ padding:32px; text-align:center; color:#6b6480; }

/* Right rail */
.eu-faq-rail{ position:sticky; top:24px; align-self:start; }
.eu-faq-rail__card{
  padding:18px 18px 14px;
  background:#fff;
  border:1px solid #ece7f6; border-radius:14px;
}
html.eu-dark .eu-faq-rail__card{ background:rgba(255,255,255,0.03); border-color:rgba(255,255,255,0.10); }
.eu-faq-rail__eyebrow{
  display:block;
  font-size:10px; font-weight:700; letter-spacing:1.2px;
  text-transform:uppercase; color:#7e3380;
  margin-bottom:10px;
}
.eu-faq-rail__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.eu-faq-rail__link{
  display:flex; align-items:center; gap:10px;
  padding:9px 12px; border-radius:8px;
  font-size:13px; font-weight:500; color:var(--eu-text-primary,#200c36);
  text-decoration:none;
  transition:background-color .15s;
}
.eu-faq-rail__link:hover{ background:#fbf9ff; }
html.eu-dark .eu-faq-rail__link:hover{ background:rgba(255,255,255,0.05); }
.eu-faq-rail__link.is-active{
  background:#fbf9ff; font-weight:700; color:#7e3380;
}
html.eu-dark .eu-faq-rail__link.is-active{ background:rgba(192,26,133,0.18); color:#fff; }
.eu-faq-rail__dot{ width:8px; height:8px; border-radius:50%; flex:0 0 auto; }
.eu-faq-rail__dot--blue{    background:#154996; }
.eu-faq-rail__dot--magenta{ background:#c01a85; }
.eu-faq-rail__dot--royal{   background:#1850b5; }
.eu-faq-rail__dot--forest{  background:#2e8060; }
.eu-faq-rail__divider{ height:1px; background:#ece7f6; margin:12px 0; }
html.eu-dark .eu-faq-rail__divider{ background:rgba(255,255,255,0.10); }
.eu-faq-rail__cta{
  display:flex; align-items:center; justify-content:center; gap:6px;
  width:100%;
  padding:10px 14px;
  background:linear-gradient(90deg,#154996,#c01a85);
  color:#fff !important; text-decoration:none;
  border-radius:8px;
  font-size:12px; font-weight:700; letter-spacing:0.3px;
}
.eu-faq-rail__cta:hover{ opacity:0.92; }
@media (max-width:880px){
  .eu-faq-rail{ position:static; }
}

/* ════════════════════════════════════════════════════════════════
   EU FOOTER — 4-column grid replacing the old flex layout.
   ════════════════════════════════════════════════════════════════ */
.eu-footer{
  font-family:Inter,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  background:transparent;
  border-top:1px solid var(--eu-border, #ece7f6);
  margin-top:32px;
}
.eu-footer__inner{
  max-width:1120px; margin:0 auto;
  padding:32px 24px 18px;
}
.eu-footer__grid{
  display:grid; gap:28px;
  grid-template-columns:1.4fr 1fr 1.3fr 1fr;
  align-items:start;
}
@media (max-width:880px){ .eu-footer__grid{ grid-template-columns:1fr 1fr; gap:24px 18px; } }
@media (max-width:520px){ .eu-footer__grid{ grid-template-columns:1fr; } }

.eu-footer__col{ min-width:0; }

.eu-footer__brand{ display:flex; align-items:center; gap:10px; }
.eu-footer__brand-mark{ flex:0 0 auto; }
.eu-footer__logo{
  display:block;
  height:40px; width:auto; max-width:220px;
  object-fit:contain;
}
html.eu-dark .eu-footer__logo{ filter:saturate(1.05) brightness(1.05); }
.eu-footer__brand-name{
  display:block;
  font-size:14px; font-weight:800; letter-spacing:0.3px;
  color:var(--eu-text-primary, #200c36);
}
.eu-footer__brand-sub{
  margin-top:10px; font-size:12px; color:var(--eu-text-muted, #6b6480);
}
.eu-footer__brand-sub a{
  color:#7e3380; text-decoration:none; font-weight:600;
}
.eu-footer__tag{
  margin:14px 0 0; font-size:12px; line-height:1.55;
  color:var(--eu-text-muted, #6b6480);
  max-width:280px;
}

/* Projects lockup — surfaces EBSI as a project of Europeum EDIC in the footer.
   Same visual rhythm as the main brand block, with a smaller eyebrow caption. */
.eu-footer__projects{
  margin-top:18px; padding-top:14px;
  border-top:1px solid var(--eu-border, rgba(32,12,54,0.08));
  display:flex; flex-direction:column; gap:8px; max-width:280px;
}
.eu-footer__projects-eyebrow{
  font-size:10px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--eu-text-muted, #6b6480);
}
.eu-footer__projects-item{
  display:inline-flex; align-items:center;
  padding:6px 10px; border-radius:8px;
  background:rgba(255,255,255,0.65);
  border:1px solid var(--eu-border, rgba(32,12,54,0.08));
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
  width:max-content;
}
.eu-footer__projects-item:hover{
  border-color:var(--eu-accent, #154996);
  background:#fff; transform:translateY(-1px);
}
.eu-footer__projects-mark{ display:block; height:28px; width:auto; }
html.eu-dark .eu-footer__projects{ border-top-color:rgba(255,255,255,0.10); }
html.eu-dark .eu-footer__projects-item{
  background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.10);
}
html.eu-dark .eu-footer__projects-mark{ filter:invert(1) hue-rotate(180deg) brightness(1.05); }

.eu-footer__head{
  margin:0 0 12px;
  font-size:10px; font-weight:800; letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--eu-text-primary, #200c36);
}
html.eu-dark .eu-footer__head{ color:#e0d9f0; }

.eu-footer__list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:8px;
}
.eu-footer__list a{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; color:var(--eu-text-muted, #6b6480);
  text-decoration:none;
  transition:color .15s;
}
.eu-footer__list a:hover{ color:#c01a85; }
html.eu-dark .eu-footer__list a:hover{ color:#e84aad; }

.eu-footer__list--dotted a{ padding-left:0; }
.eu-footer__dot{
  display:inline-block;
  width:7px; height:7px; border-radius:50%;
  flex:0 0 auto;
}
.eu-footer__list-all{ margin-top:4px; }
.eu-footer__list-all a{
  font-weight:700; color:#c01a85;
}
.eu-footer__list-all a:hover{ color:#7e3380; }

.eu-footer__bottom{
  margin-top:24px; padding-top:16px;
  border-top:1px solid var(--eu-border, #ece7f6);
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:12px;
  font-size:11px; color:var(--eu-text-muted, #6b6480);
}
.eu-footer__copy{ font-weight:500; }
.eu-footer__bottom-meta{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.eu-footer__contact{
  color:var(--eu-text-muted, #9c95b5);
}
.eu-footer__lang .dropdown-toggle{
  background:transparent; border:1px solid var(--eu-border, #ece7f6);
  border-radius:999px; padding:5px 12px;
  font-size:11px; font-weight:500; color:var(--eu-text-muted, #6b6480);
  display:inline-flex; align-items:center; gap:6px;
  cursor:pointer;
}
.eu-footer__lang .dropdown-toggle:hover{
  border-color:#c01a85; color:#c01a85;
}

/* Dark-mode polish */
html.eu-dark .eu-footer{
  border-top-color:rgba(255,255,255,0.10);
}
html.eu-dark .eu-footer__bottom{
  border-top-color:rgba(255,255,255,0.10);
}

/* ── FAQ landing card preview list + count chip ───────────────── */
.eu-faq-card__top{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px;
}
.eu-faq-card__count{
  display:inline-flex; align-items:center;
  padding:4px 10px; border-radius:999px;
  background:#fbf9ff; border:1px solid #ece7f6;
  font-size:11px; font-weight:700; letter-spacing:0.3px;
  color:#7e3380;
}
html.eu-dark .eu-faq-card__count{ background:rgba(192,26,133,0.14); border-color:rgba(192,26,133,0.30); color:#e84aad; }

.eu-faq-card__preview{
  list-style:none; margin:8px 0 6px; padding:0;
  display:flex; flex-direction:column; gap:6px;
  border-top:1px dashed #ece7f6;
  padding-top:12px;
}
html.eu-dark .eu-faq-card__preview{ border-top-color:rgba(255,255,255,0.10); }
.eu-faq-card__preview-item{
  display:flex; align-items:flex-start; gap:8px;
  font-size:12.5px; line-height:1.45;
  color:#4a4361;
  position:relative;
}
html.eu-dark .eu-faq-card__preview-item{ color:#cabad9; }
.eu-faq-card__preview-item::before{
  content:""; flex:0 0 auto; margin-top:6px;
  width:5px; height:5px; border-radius:50%;
  background:linear-gradient(135deg,#154996,#c01a85);
}
.eu-faq-card__preview-skeleton{
  height:10px; border-radius:4px;
  background:linear-gradient(90deg, #ece7f6 0%, #fbf9ff 50%, #ece7f6 100%);
  background-size:200% 100%;
  animation:eu-faq-skeleton 1.2s infinite;
  list-style:none;
}
.eu-faq-card__preview-skeleton:nth-child(2){ width:88%; }
.eu-faq-card__preview-skeleton:nth-child(3){ width:62%; }
html.eu-dark .eu-faq-card__preview-skeleton{
  background:linear-gradient(90deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.12) 50%, rgba(255,255,255,0.06) 100%);
}

/* ── Doc library extensions: Secure Space, Policies, Templates ── */
.nocs-block--secure  .nocs-block__eyebrow{ color:#1d6047; }
.nocs-block--secure  .nocs-block__icon{ background:#ecfdf5; color:#1d6047; }
.nocs-block--policy  .nocs-block__eyebrow{ color:#7e3380; }
.nocs-block--policy  .nocs-block__icon{ background:#fbf3f9; color:#7e3380; }
.nocs-block--tpl     .nocs-block__eyebrow{ color:#1850b5; }
.nocs-block--tpl     .nocs-block__icon{ background:#eff4ff; color:#1850b5; }
.eu-dark .nocs-block--secure .nocs-block__icon{ background:rgba(46,128,96,.18); color:#5ec89e; }
.eu-dark .nocs-block--policy .nocs-block__icon{ background:rgba(192,26,133,.16); color:#e84aad; }
.eu-dark .nocs-block--tpl    .nocs-block__icon{ background:rgba(24,80,181,.18); color:#7a9fe7; }

/* ════════════════════════════════════════════════════════════════
   CSR — Community Space Redesign (v2 layout)
   Implements the community-space-redesign.html design.
   Token use:
     --eu-accent (#154996) for blue surfaces
     --eu-magenta (#c01a85) for accents
     --eu-text-* for body text
   New local tokens defined inline for surfaces unique to this view.
   ════════════════════════════════════════════════════════════════ */
.csr-page{
  --csr-bg:        #f4f5f9;
  --csr-bg-elev:   #ffffff;
  --csr-bg-sunk:   #eceef4;
  --csr-bg-hover:  #e5e8f0;
  --csr-ink:       #1a0f2e;
  --csr-ink-2:     #3a2e54;
  --csr-ink-3:     #6a6383;
  --csr-ink-4:     #9b95ad;
  --csr-line:      #e1e3eb;
  --csr-line-2:    #c8ccd9;
  --csr-blue:      #1850b5;
  --csr-blue-bg:   rgba(24,80,181,0.08);
  --csr-blue-soft: rgba(24,80,181,0.04);
  --csr-magenta:   #c01a85;
  --csr-magenta-bg:rgba(192,26,133,0.10);
  --csr-green:     #2e8060;
  --csr-green-bg:  rgba(46,128,96,0.10);
  --csr-amber:     #b07b00;
  --csr-amber-bg:  rgba(242,180,30,0.16);
  --csr-violet:    #5b3a8a;
  --csr-violet-bg: rgba(91,58,138,0.10);
  --csr-grad:      linear-gradient(120deg,#1850b5 0%,#5b3a8a 50%,#c01a85 100%);
  font-family:Inter,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  background:var(--csr-bg);
  color:var(--csr-ink);
  font-size:14px;
  line-height:1.55;
  /* Break out of .container — but clip horizontally on <html> so the
   * extreme negative margin doesn't produce a 2000px horizontal scrollbar.
   * (The browser would otherwise honour the full bleed width.) */
  margin:0 -1000px;
  padding:0;
}
html:has(.csr-page){ overflow-x:hidden; }

/* ─── Article: smart prev/next pager with article titles ─── */
.eu-doc-pager-wrap{
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  margin:28px 0 14px;
}
.eu-doc-pager{
  display:flex; flex-direction:column; gap:6px;
  padding:16px 18px;
  border:1px solid var(--eu-doc-line, #e1e3eb);
  border-radius:12px;
  background:var(--eu-doc-paper, #fff);
  color:var(--eu-doc-ink, #200c36);
  text-decoration:none;
  transition:border-color 140ms ease, transform 140ms ease, box-shadow 140ms ease;
  min-height:62px;
}
.eu-doc-pager:hover{
  border-color:#c01a85;
  transform:translateY(-1px);
  box-shadow:0 4px 16px rgba(32,12,54,0.06);
  text-decoration:none;
}
.eu-doc-pager--next{ text-align:right; align-items:flex-end; }
.eu-doc-pager__l{
  display:inline-flex; align-items:center; gap:6px;
  font-size:10.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase;
  color:var(--eu-doc-ink-3, #6a6383);
}
.eu-doc-pager--next .eu-doc-pager__l{ flex-direction:row-reverse; }
.eu-doc-pager__l svg{ flex-shrink:0; }
.eu-doc-pager__t{
  font-size:14px; font-weight:600; line-height:1.35;
  color:var(--eu-doc-ink, #200c36);
}
html.eu-dark .eu-doc-pager{
  background:rgba(255,255,255,0.04);
  border-color:rgba(255,255,255,0.10);
  color:#f1ecf8;
}
html.eu-dark .eu-doc-pager:hover{
  border-color:#c01a85;
  background:rgba(192,26,133,0.08);
}
html.eu-dark .eu-doc-pager__l{ color:rgba(255,255,255,0.55); }
html.eu-dark .eu-doc-pager__t{ color:#f1ecf8; }
@media (max-width:720px){
  .eu-doc-pager-wrap{ grid-template-columns:1fr; }
  .eu-doc-pager--next{ text-align:left; align-items:flex-start; }
  .eu-doc-pager--next .eu-doc-pager__l{ flex-direction:row; }
}

/* ─── Article attachments: typed icons + caption row ─── */
.eu-att-h{
  font-size:10.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase;
  color:var(--eu-doc-ink-3, #6a6383);
  margin:18px 0 10px;
}
.eu-doc-article__attachments ul.attachments,
.eu-doc-article__attachments .attachments{
  list-style:none; padding:0; margin:0;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:8px;
}
li.eu-att{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  border:1px solid var(--eu-doc-line, #e1e3eb);
  border-radius:10px;
  background:var(--eu-doc-paper, #fff);
  transition:border-color 120ms ease, background 120ms ease;
}
li.eu-att:hover{ border-color:#c01a85; background:rgba(192,26,133,0.04); }
li.eu-att .eu-att__icon{
  flex-shrink:0;
  width:18px; height:18px;
  color:var(--eu-doc-ink-2, #3a2e54);
}
li.eu-att--image .eu-att__icon{ color:#2e8060; }
li.eu-att--pdf   .eu-att__icon{ color:#c0291a; }
li.eu-att--doc   .eu-att__icon{ color:#1850b5; }
li.eu-att--xls   .eu-att__icon{ color:#2e8060; }
li.eu-att--ppt   .eu-att__icon{ color:#b07b00; }
li.eu-att--zip   .eu-att__icon{ color:#5b3a8a; }
li.eu-att--code  .eu-att__icon{ color:#3a2e54; }
li.eu-att > a:first-of-type{
  flex:1; min-width:0;
  font-size:13px; font-weight:600;
  color:var(--eu-doc-ink, #200c36);
  text-decoration:none;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
li.eu-att > a:first-of-type:hover{ color:#c01a85; }
li.eu-att .attachment-meta{
  display:flex; align-items:center; gap:8px;
  flex-shrink:0;
  font-size:11px; color:var(--eu-doc-ink-3, #6a6383);
}
li.eu-att .attachment-meta .meta-data:last-child{
  color:#1850b5; font-weight:600; text-decoration:none;
}
li.eu-att .attachment-meta .meta-data:last-child:hover{ text-decoration:underline; }
html.eu-dark li.eu-att{
  background:rgba(255,255,255,0.04);
  border-color:rgba(255,255,255,0.10);
}
html.eu-dark li.eu-att > a:first-of-type{ color:#f1ecf8; }
html.eu-dark li.eu-att .attachment-meta{ color:rgba(255,255,255,0.55); }
html.eu-dark li.eu-att .attachment-meta .meta-data:last-child{ color:#9bc1ff; }

/* ─── Comments: friendlier hint under the heading ─── */
.eu-comments-hint{
  margin:6px 0 16px;
  font-size:12.5px; line-height:1.55;
  color:var(--eu-doc-ink-3, #6a6383);
  padding:10px 12px;
  background:rgba(24,80,181,0.04);
  border-left:3px solid #1850b5;
  border-radius:6px;
}
html.eu-dark .eu-comments-hint{
  background:rgba(91,155,230,0.08);
  color:rgba(255,255,255,0.72);
  border-left-color:#5b9be6;
}
html.eu-dark .csr-page{
  --csr-bg:        #160826;
  --csr-bg-elev:   #200c36;
  --csr-bg-sunk:   #2a1142;
  --csr-bg-hover:  #341754;
  --csr-ink:       #f3eaff;
  --csr-ink-2:     #d6c8ec;
  --csr-ink-3:     #a89ec8;
  --csr-ink-4:     #7d7396;
  --csr-line:      rgba(255,255,255,0.10);
  --csr-line-2:    rgba(255,255,255,0.18);
  --csr-blue-bg:   rgba(91,155,230,0.16);
  --csr-blue-soft: rgba(91,155,230,0.06);
  --csr-magenta-bg:rgba(232,74,173,0.18);
  --csr-green-bg:  rgba(94,200,158,0.18);
  --csr-amber-bg:  rgba(242,205,48,0.20);
  --csr-violet-bg: rgba(155,124,200,0.18);
}

/* ── Hero ───────────────────────────────────────────────────────── */
.csr-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(135deg,#1a0f2e 0%,#2a1750 35%,#5b1f6e 70%,#8e1c70 100%);
  color:#fff;
  padding:32px 28px;
}
.csr-hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 92% 22%, rgba(192,26,133,0.45), transparent 42%),
    radial-gradient(circle at 5% 95%,  rgba(24,80,181,0.42),  transparent 50%);
  pointer-events:none;
}
.csr-hero__inner{
  position:relative; max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center;
}
.csr-hero__eb{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-size:10.5px; font-weight:700; letter-spacing:0.14em;
  text-transform:uppercase; color:rgba(255,255,255,0.62); margin-bottom:8px;
}
.csr-hero__pill{
  display:inline-flex; align-items:center; gap:5px;
  padding:3px 9px; border-radius:14px;
  background:rgba(126,234,158,0.14);
  border:1px solid rgba(126,234,158,0.35);
  color:#a8f5c2; font-size:10px; letter-spacing:0.06em; font-weight:700;
}
.csr-hero__pill-dot{
  width:5px; height:5px; border-radius:50%; background:#7eea9e;
  animation:csr-pulse 2.2s ease-in-out infinite;
}
@keyframes csr-pulse{ 50%{opacity:0.4} }
.csr-hero__title{
  display:flex; align-items:center; gap:14px;
  font-size:30px; font-weight:800; letter-spacing:-0.022em; line-height:1.05;
  margin:0 0 6px;
}
.csr-hero__title-mark{
  width:34px; height:34px; padding:6px; border-radius:8px;
  background:rgba(255,255,255,0.95);
  border:1px solid rgba(255,255,255,0.30);
  display:block; flex-shrink:0;
  object-fit:contain;
}
.csr-hero__sub{
  margin:0; font-size:13.5px; line-height:1.5;
  color:rgba(255,255,255,0.74); max-width:64ch;
}
.csr-hero__meta{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.csr-hero__meta-row{
  display:flex; align-items:center; gap:18px;
  font-size:11px; color:rgba(255,255,255,0.66);
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
}
.csr-hero__meta-row strong{ color:#fff; font-weight:700; font-size:13px; }
.csr-hero__meta-when{ font-size:10.5px; color:rgba(255,255,255,0.5); }

/* ── Workspace search bar (floats over hero/content junction) ───── */
.csr-searchbar{
  position:relative; z-index:5;
  max-width:1180px; margin:-22px auto 0; padding:0 28px;
}
.csr-searchbar__box{
  background:var(--csr-bg-elev);
  border:1px solid var(--csr-line);
  border-radius:14px;
  display:grid; grid-template-columns:auto 1fr auto auto;
  gap:14px; align-items:center;
  padding:12px 16px;
  box-shadow:
    0 2px 4px rgba(20,10,40,0.04),
    0 16px 40px rgba(20,10,40,0.10);
  position:relative;
}
.csr-searchbar__i{
  width:34px; height:34px; border-radius:8px;
  background:var(--csr-grad); color:#fff;
  display:grid; place-items:center; flex-shrink:0;
}
.csr-searchbar__input{
  width:100%; border:none; background:transparent; outline:none;
  font-family:inherit; font-size:15px; color:var(--csr-ink);
}
.csr-searchbar__input::placeholder{ color:var(--csr-ink-3); }
.csr-searchbar__chips{ display:flex; gap:5px; }
.csr-searchbar__chip{
  font-size:11px; font-weight:600; padding:5px 10px; border-radius:14px;
  background:var(--csr-bg-sunk); color:var(--csr-ink-2);
  border:none; cursor:pointer;
  transition:background-color .15s, color .15s;
}
.csr-searchbar__chip:hover{ background:var(--csr-bg-hover); }
.csr-searchbar__chip.is-on{ background:var(--csr-blue-bg); color:var(--csr-blue); }
.csr-searchbar__kbd{
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
  font-size:11px; color:var(--csr-ink-3);
  background:var(--csr-bg-sunk); padding:3px 8px;
  border-radius:5px; font-weight:600;
}
@media (max-width:780px){
  .csr-searchbar__box{ grid-template-columns:auto 1fr; }
  .csr-searchbar__chips, .csr-searchbar__kbd{ display:none; }
}

/* Search-results dropdown from existing script.js floats inside the box */
.csr-searchbar__box .nocs-search__results{
  position:absolute; top:calc(100% + 6px); left:0; right:0;
  background:var(--csr-bg-elev);
  border:1px solid var(--csr-line); border-radius:10px;
  box-shadow:0 8px 24px rgba(20,10,40,0.12);
  z-index:10;
}

/* ── Two-column shell ───────────────────────────────────────────── */
.csr-shell{
  max-width:1180px; margin:30px auto 0; padding:0 28px 56px;
  display:grid; grid-template-columns:220px 1fr; gap:32px;
  align-items:flex-start;
}
@media (max-width:980px){ .csr-shell{ grid-template-columns:1fr; } }

/* ── Side nav ───────────────────────────────────────────────────── */
.csr-sidenav{
  position:sticky; top:74px;
  display:flex; flex-direction:column; gap:24px;
}
@media (max-width:980px){ .csr-sidenav{ position:static; } }
.csr-sidenav__l{
  font-size:10px; font-weight:700; letter-spacing:0.10em;
  text-transform:uppercase; color:var(--csr-ink-4);
  margin:0 0 8px; padding-left:10px;
}
.csr-sidenav__list{ display:flex; flex-direction:column; gap:2px; }
.csr-sidenav__item{
  display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center;
  padding:9px 10px; border-radius:7px;
  font-size:13px; color:var(--csr-ink-2); font-weight:500;
  cursor:pointer; text-decoration:none;
  transition:background-color .12s, color .12s;
}
.csr-sidenav__item:hover{ background:var(--csr-bg-hover); color:var(--csr-ink); }
.csr-sidenav__item.is-on{
  background:var(--csr-blue-bg); color:var(--csr-blue); font-weight:600;
}
.csr-sidenav__i{
  width:14px; height:14px; color:currentColor; flex-shrink:0; opacity:0.7;
  display:inline-flex; align-items:center; justify-content:center;
}
.csr-sidenav__c{
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
  font-size:10px; color:var(--csr-ink-4); font-weight:600;
}
.csr-sidenav__item.is-on .csr-sidenav__c{ color:var(--csr-blue); }
.csr-sidenav__help{
  margin-top:8px;
  background:linear-gradient(135deg, var(--csr-bg-elev), var(--csr-blue-soft));
  border:1px solid var(--csr-line); border-radius:11px;
  padding:14px;
}
.csr-sidenav__help-i{
  width:30px; height:30px; border-radius:7px;
  background:var(--csr-blue); color:#fff;
  display:grid; place-items:center; margin-bottom:10px;
}
.csr-sidenav__help-t{
  font-size:13px; font-weight:700; margin-bottom:3px;
  letter-spacing:-0.005em; color:var(--csr-ink);
}
.csr-sidenav__help-d{
  font-size:11.5px; color:var(--csr-ink-3); line-height:1.5; margin-bottom:10px;
}
.csr-sidenav__help-cta{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11.5px; font-weight:700; color:var(--csr-blue);
  text-decoration:none;
}

/* ── Main column ────────────────────────────────────────────────── */
.csr-main{ min-width:0; display:flex; flex-direction:column; gap:32px; }

/* ── Quick-start callout ────────────────────────────────────────── */
.csr-callout{
  background:linear-gradient(135deg, var(--csr-bg-elev), var(--csr-green-bg));
  border:1px solid var(--csr-line);
  border-left:3px solid var(--csr-green);
  border-radius:11px;
  padding:16px 18px 16px 22px;
  display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center;
}
.csr-callout__i{
  width:34px; height:34px; border-radius:8px;
  background:var(--csr-green); color:#fff;
  display:grid; place-items:center; flex-shrink:0;
}
.csr-callout__t{
  font-size:14px; font-weight:700; letter-spacing:-0.005em;
  color:var(--csr-ink); margin-bottom:2px;
}
.csr-callout__d{ font-size:12px; color:var(--csr-ink-2); line-height:1.5; }
.csr-callout__d strong{ font-weight:700; }
.csr-callout__cta{
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 14px;
  background:var(--csr-green); color:#fff; text-decoration:none;
  border-radius:7px; font-size:12px; font-weight:700; white-space:nowrap;
}

/* ── Section header ─────────────────────────────────────────────── */
.csr-section__hd{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:14px; margin-bottom:14px; padding-bottom:10px;
  border-bottom:1px solid var(--csr-line);
}
.csr-section__hd-l{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.csr-section__num{
  display:inline-grid; place-items:center;
  width:24px; height:24px; border-radius:6px;
  background:var(--csr-ink); color:#fff;
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
  font-size:11px; font-weight:700; letter-spacing:-0.02em;
}
.csr-section__t{
  margin:0; font-size:18px; font-weight:800;
  letter-spacing:-0.015em; color:var(--csr-ink);
}
.csr-section__sub{ font-size:12px; color:var(--csr-ink-3); align-self:center; }
.csr-section__r{
  font-size:11px; color:var(--csr-ink-3);
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
  display:flex; align-items:center; gap:6px;
}
.csr-section__r strong{ color:var(--csr-ink-2); font-weight:700; }
.csr-section__cta{
  font-size:11.5px; color:var(--csr-blue); font-weight:600;
  text-decoration:none;
  display:inline-flex; align-items:center; gap:4px;
}

/* ── Doc grid ───────────────────────────────────────────────────── */
.csr-doc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.csr-doc-grid.cols-2{ grid-template-columns:repeat(2,1fr); }
.csr-doc-grid.cols-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:880px){
  .csr-doc-grid, .csr-doc-grid.cols-2, .csr-doc-grid.cols-4{ grid-template-columns:1fr; }
}

.csr-doc{
  background:var(--csr-bg-elev);
  border:1px solid var(--csr-line); border-radius:11px;
  padding:16px 16px 14px;
  display:flex; flex-direction:column; gap:8px;
  position:relative; overflow:hidden;
  text-align:left; text-decoration:none; color:inherit; cursor:pointer;
  transition:transform .16s, box-shadow .16s, border-color .16s;
}
.csr-doc::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  transform:translateX(-3px);
  transition:transform .18s;
}
.csr-doc.theme-start::before  { background:var(--csr-green); }
.csr-doc.theme-ops::before    { background:var(--csr-blue); }
.csr-doc.theme-proc::before   { background:var(--csr-magenta); }
.csr-doc.theme-legal::before  { background:var(--csr-violet); }
.csr-doc.theme-sla::before    { background:var(--csr-amber); }
.csr-doc.theme-priv::before   { background:#7c63a8; }
.csr-doc.theme-help::before   { background:var(--csr-blue); }
.csr-doc.theme-secure::before { background:#0f4396; }
.csr-doc.theme-policy::before { background:var(--csr-magenta); }
.csr-doc.theme-tmpl::before   { background:var(--csr-green); }
.csr-doc:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 6px rgba(20,10,40,0.04), 0 12px 28px rgba(20,10,40,0.08);
  border-color:var(--csr-line-2);
}
.csr-doc:hover::before{ transform:translateX(0); }

.csr-doc__hd{ display:flex; align-items:center; gap:8px; margin-bottom:2px; }
.csr-doc__icon{
  width:28px; height:28px; border-radius:7px;
  display:grid; place-items:center; flex-shrink:0;
}
.csr-doc__icon.theme-start  { background:var(--csr-green-bg);   color:var(--csr-green); }
.csr-doc__icon.theme-ops    { background:var(--csr-blue-bg);    color:var(--csr-blue); }
.csr-doc__icon.theme-proc   { background:var(--csr-magenta-bg); color:var(--csr-magenta); }
.csr-doc__icon.theme-legal  { background:var(--csr-violet-bg);  color:var(--csr-violet); }
.csr-doc__icon.theme-sla    { background:var(--csr-amber-bg);   color:var(--csr-amber); }
.csr-doc__icon.theme-priv   { background:rgba(124,99,168,0.12); color:#7c63a8; }
.csr-doc__icon.theme-help   { background:var(--csr-blue-bg);    color:var(--csr-blue); }
.csr-doc__icon.theme-secure { background:rgba(15,67,150,0.12);  color:#0f4396; }
.csr-doc__icon.theme-policy { background:var(--csr-magenta-bg); color:var(--csr-magenta); }
.csr-doc__icon.theme-tmpl   { background:var(--csr-green-bg);   color:var(--csr-green); }

.csr-doc__cat{
  font-size:9.5px; font-weight:700; letter-spacing:0.10em;
  text-transform:uppercase; color:var(--csr-ink-3);
}
.csr-doc__badge{
  margin-left:auto;
  font-size:9.5px; font-weight:700; letter-spacing:0.06em;
  text-transform:uppercase; padding:2px 7px; border-radius:4px;
  background:var(--csr-amber-bg); color:var(--csr-amber);
}
.csr-doc__badge.new  { background:var(--csr-green-bg); color:var(--csr-green); }
.csr-doc__badge.lock { background:var(--csr-bg-sunk);  color:var(--csr-ink-3);
  display:inline-flex; align-items:center; gap:3px; }
.csr-doc__t{
  margin:0; font-size:14px; font-weight:700;
  color:var(--csr-ink); letter-spacing:-0.005em; line-height:1.3;
}
.csr-doc.is-featured{ grid-column:span 2; padding:18px 20px; }
.csr-doc.is-featured .csr-doc__t{ font-size:17px; }
@media (max-width:880px){ .csr-doc.is-featured{ grid-column:span 1; } }
.csr-doc__d{
  margin:0; font-size:11.5px; color:var(--csr-ink-3); line-height:1.5;
}
.csr-doc.is-featured .csr-doc__d{ font-size:12.5px; }
.csr-doc__links{
  margin-top:auto; padding-top:8px;
  display:flex; flex-direction:column; gap:2px;
  border-top:1px dashed var(--csr-line);
}
.csr-doc__link{
  display:flex; align-items:center; gap:6px;
  font-size:11px; color:var(--csr-ink-2);
  padding:3px 0; font-weight:500;
}
.csr-doc__link::before{
  content:"›"; color:var(--csr-ink-4); font-weight:700;
  width:10px; text-align:center; flex-shrink:0;
}
.csr-doc:hover .csr-doc__link{ color:var(--csr-blue); }
.csr-doc__meta{
  display:flex; align-items:center; gap:10px;
  font-size:10.5px; color:var(--csr-ink-4);
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
  padding-top:8px; border-top:1px dashed var(--csr-line); margin-top:auto;
}
.csr-doc__cta{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11.5px; font-weight:700; color:var(--csr-blue);
  padding-top:8px;
}
.csr-doc__cta-arrow{
  display:inline-block; transition:transform .18s;
}
.csr-doc:hover .csr-doc__cta-arrow{ transform:translateX(3px); }

/* ── Secure-space side column (pinned cards) ────────────────────── */
.csr-side-col{ display:flex; flex-direction:column; gap:14px; }
.csr-pinned{
  background:linear-gradient(135deg, var(--csr-bg-elev), rgba(46,128,96,0.05));
  border:1px solid var(--csr-line);
  border-left:3px solid var(--csr-green);
  border-radius:11px; padding:14px 16px;
}
.csr-pinned__l{
  font-size:9px; font-weight:700; letter-spacing:0.10em;
  text-transform:uppercase; color:var(--csr-green);
  display:flex; align-items:center; gap:6px; margin-bottom:8px;
}
.csr-pinned__t{
  font-size:13px; font-weight:700; letter-spacing:-0.005em;
  line-height:1.3; color:var(--csr-ink);
}
.csr-pinned__d{
  font-size:11.5px; color:var(--csr-ink-3);
  line-height:1.5; margin-top:6px;
}
.csr-pinned__cta{
  display:inline-flex; align-items:center; gap:6px;
  margin-top:10px;
  padding:6px 11px;
  background:var(--csr-bg-elev);
  border:1px solid var(--csr-line); border-radius:6px;
  font-size:11px; font-weight:600; color:var(--csr-ink-2);
  text-decoration:none;
}
.csr-pinned--alt{
  border-left-color:var(--csr-magenta);
  background:linear-gradient(135deg, var(--csr-bg-elev), rgba(192,26,133,0.05));
}
.csr-pinned--alt .csr-pinned__l{ color:var(--csr-magenta); }
.csr-pinned__cta--alt{
  color:var(--csr-magenta); border-color:rgba(192,26,133,0.30);
}

/* ── Activity table ─────────────────────────────────────────────── */
.csr-activity{
  background:var(--csr-bg-elev);
  border:1px solid var(--csr-line); border-radius:11px;
  overflow:hidden;
}
.csr-activity__list{ list-style:none; margin:0; padding:0; }
.csr-activity__row{
  display:grid; grid-template-columns:auto 1fr auto auto;
  gap:12px; align-items:center;
  padding:11px 16px; border-bottom:1px solid var(--csr-line);
  font-size:13px; cursor:pointer;
  transition:background .15s;
}
.csr-activity__row:last-child{ border-bottom:none; }
.csr-activity__row:hover{ background:var(--csr-blue-soft); }
.csr-activity__kind{
  font-size:9px; font-weight:700; letter-spacing:0.08em;
  text-transform:uppercase; padding:2px 7px; border-radius:4px;
  background:var(--csr-bg-sunk); color:var(--csr-ink-3);
  display:inline-flex; align-items:center; gap:4px; white-space:nowrap;
}
.csr-activity__kind.pinned  { background:var(--csr-green-bg);   color:var(--csr-green); }
.csr-activity__kind.draft   { background:var(--csr-amber-bg);   color:var(--csr-amber); }
.csr-activity__kind.archive { background:var(--csr-bg-sunk);    color:var(--csr-ink-3); }
.csr-activity__kind-dot{
  width:4px; height:4px; border-radius:50%; background:currentColor;
}
.csr-activity__t{
  font-weight:600; color:var(--csr-ink); letter-spacing:-0.005em;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.csr-activity__when{
  font-size:11px; color:var(--csr-ink-3);
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
}
.csr-activity__cmt{
  font-size:11px; color:var(--csr-ink-4);
  font-family:'JetBrains Mono','SF Mono',Consolas,monospace;
  display:flex; align-items:center; gap:4px;
  min-width:32px; justify-content:flex-end;
}

/* Map script.js's existing recent-list items into the CSR style.
   It writes <li class="nocs-recent__item"> elements; restyle in place
   instead of rewriting the JS. */
.csr-activity__list .nocs-recent__item{
  display:grid; grid-template-columns:auto 1fr auto;
  gap:12px; align-items:center;
  padding:11px 16px; border-bottom:1px solid var(--csr-line);
  font-size:13px; color:var(--csr-ink);
}
.csr-activity__list .nocs-recent__item:last-child{ border-bottom:none; }
.csr-activity__list .nocs-recent__item a{ color:inherit; text-decoration:none; font-weight:600; }
.csr-activity__list .nocs-recent__item a:hover{ color:var(--csr-blue); }

/* ════════════════════════════════════════════════════════════════════
   DOC ARTICLE TEMPLATE (eu-doc-*)
   Adapted from Claude Design "doc-article-redesign.html".
   Applies to every article page: hero → 3-col shell → footer.
   ════════════════════════════════════════════════════════════════════ */

/* ── Local tokens, kept inside the article surface so they don't
   pollute the rest of the theme. Pull from the global eu-* tokens
   where one already exists; fall back otherwise. ── */
.eu-doc-page{
  --eu-doc-bg:        var(--eu-bg-secondary, #f4f5f9);
  --eu-doc-paper:     var(--eu-bg-card,      #fff);
  --eu-doc-sunk:      var(--eu-bg-tertiary,  #eceef4);
  --eu-doc-hover:     var(--eu-bg-hover,     #e5e8f0);
  --eu-doc-ink:       var(--eu-text-primary, #1a0f2e);
  --eu-doc-ink-2:     var(--eu-text-secondary, #3a2e54);
  --eu-doc-ink-3:     var(--eu-text-muted,   #6a6383);
  --eu-doc-ink-4:     #9b95ad;
  --eu-doc-line:      var(--eu-border,       #e1e3eb);
  --eu-doc-line-2:    #c8ccd9;
  --eu-doc-blue:      var(--eu-accent,       #1850b5);
  --eu-doc-blue-bg:   rgba(24,80,181,0.08);
  --eu-doc-blue-soft: rgba(24,80,181,0.04);
  --eu-doc-magenta:   #c01a85;
  --eu-doc-magenta-bg:rgba(192,26,133,0.10);
  --eu-doc-green:     #2e8060;
  --eu-doc-green-bg:  rgba(46,128,96,0.10);
  --eu-doc-grad:      linear-gradient(120deg,#1850b5 0%,#5b3a8a 50%,#c01a85 100%);
  --eu-doc-serif:     'Source Serif 4', Georgia, serif;
  background: var(--eu-doc-bg);
  color: var(--eu-doc-ink);
}
html.eu-dark .eu-doc-page{
  --eu-doc-bg:#0e0a1c; --eu-doc-paper:#171028; --eu-doc-sunk:#1f1733; --eu-doc-hover:#26203b;
  --eu-doc-ink:#f1ecf8; --eu-doc-ink-2:#cfc6e0; --eu-doc-ink-3:#9b95ad; --eu-doc-ink-4:#7e7794;
  --eu-doc-line:rgba(255,255,255,0.10); --eu-doc-line-2:rgba(255,255,255,0.18);
  --eu-doc-blue:#5b9be6; --eu-doc-blue-bg:rgba(91,155,230,0.16); --eu-doc-blue-soft:rgba(91,155,230,0.06);
  --eu-doc-magenta-bg:rgba(192,26,133,0.18); --eu-doc-green-bg:rgba(46,128,96,0.20);
}

/* Reset some inherited theme rules that fight the new layout */
.eu-doc-page *{ box-sizing: border-box; }
.eu-doc-page a{ text-decoration: none; }

/* ── Reading progress bar ── */
.eu-doc-progress{
  position: fixed; top: 0; left: 0; right: 0; height: 3px;
  background: transparent; z-index: 60; pointer-events: none;
}
.eu-doc-progress__bar{
  height: 100%; width: 0%;
  background: var(--eu-doc-grad);
  transition: width 0.2s ease-out;
}

/* ── Hero ── */
.eu-doc-hero{
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, #1a0f2e 0%, #2a1750 30%, #5b1f6e 65%, #8e1c70 100%);
  color: #fff;
  padding: 34px 32px 80px;
}
.eu-doc-hero::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(circle at 88% 18%, rgba(192,26,133,0.40), transparent 40%),
    radial-gradient(circle at  5% 95%, rgba( 24, 80,181,0.40), transparent 50%);
}
.eu-doc-hero__inner{ position:relative; max-width:1440px; margin:0 auto; }

/* Zendesk-rendered breadcrumbs inside the hero — recolor links */
.eu-doc-hero__crumbs{ margin-bottom:14px; font-size:11.5px; color:rgba(255,255,255,0.70); }
.eu-doc-hero__crumbs a,
.eu-doc-hero__crumbs .breadcrumbs a{ color:rgba(255,255,255,0.70); }
.eu-doc-hero__crumbs a:hover{ color:#fff; }
.eu-doc-hero__crumbs .breadcrumbs{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; padding:0; margin:0; list-style:none; }
.eu-doc-hero__crumbs .breadcrumbs li{ display:inline-flex; align-items:center; gap:6px; }
.eu-doc-hero__crumbs .breadcrumbs li + li::before{ content:'›'; color:rgba(255,255,255,0.40); margin-right:2px; }
.eu-doc-hero__crumbs .breadcrumbs li:last-child{ color:#fff; font-weight:600; }

.eu-doc-hero__chips{ display:flex; align-items:center; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
.eu-doc-hero__chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 10px; border-radius:14px;
  font-size:11px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase;
}
.eu-doc-hero__chip--id{ background:rgba(255,255,255,0.14); color:#fff; font-family:'JetBrains Mono', ui-monospace, monospace; letter-spacing:0.08em; }
.eu-doc-hero__chip--cat{ background:rgba(126,234,158,0.16); border:1px solid rgba(126,234,158,0.35); color:#a8f5c2; }
.eu-doc-hero__chip--access{ background:rgba(192,26,133,0.18); border:1px solid rgba(192,26,133,0.40); color:#ffb1de; }
.eu-doc-hero__chip-dot{ width:5px; height:5px; border-radius:50%; background:currentColor; }

.eu-doc-hero__title{
  font-size:36px; font-weight:800; letter-spacing:-0.022em; line-height:1.08;
  margin:0 0 14px; max-width:64ch; color:#fff;
}
.eu-doc-hero__sub{
  margin:0; font-family:var(--eu-doc-serif);
  font-size:15.5px; line-height:1.55; max-width:68ch;
  color:rgba(255,255,255,0.78);
}
.eu-doc-hero__meta{
  display:flex; align-items:center; gap:18px; margin-top:18px;
  font-size:12px; color:rgba(255,255,255,0.70); flex-wrap:wrap;
}
.eu-doc-hero__meta-item{ display:inline-flex; align-items:center; gap:6px; }
.eu-doc-hero__meta-item strong{ color:#fff; font-weight:600; }
.eu-doc-hero__avatar{
  width:20px; height:20px; border-radius:50%;
  background:linear-gradient(135deg,#a8c5e8,#d8a4cf); display:inline-block;
}

.eu-doc-hero__actions{
  position:absolute; right:0; top:14px;
  display:flex; gap:6px; flex-wrap:wrap;
}
.eu-doc-hero__action{
  display:inline-flex; align-items:center; gap:5px;
  padding:6px 10px; font-size:11.5px; font-weight:600;
  background:rgba(255,255,255,0.10); border:1px solid rgba(255,255,255,0.18);
  border-radius:7px; color:#fff; cursor:pointer;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.eu-doc-hero__action:hover{ background:rgba(255,255,255,0.18); }
/* #10646 — primary Print/PDF button was white-on-hero-gradient and
   blended into the lighter (magenta) portion of the hero. Switch to a
   solid brand-violet fill with white text for unambiguous contrast on
   any portion of the hero gradient. */
.eu-doc-hero__action--pri{
  background:#200c36; color:#fff;
  border-color:rgba(255,255,255,0.35);
  box-shadow:0 1px 2px rgba(0,0,0,0.25);
}
.eu-doc-hero__action--pri:hover{ background:#3a1d5c; color:#fff; }
/* Zendesk-rendered subscribe button inside .eu-doc-hero__action--follow wrapper */
.eu-doc-hero__action--follow{ padding:0; background:transparent; border:none; }
.eu-doc-hero__action--follow .article-subscribe,
.eu-doc-hero__action--follow > *{
  display:inline-flex; align-items:center; gap:5px;
  padding:6px 10px; font-size:11.5px; font-weight:600;
  background:rgba(255,255,255,0.10); border:1px solid rgba(255,255,255,0.18);
  border-radius:7px; color:#fff;
}

/* ── 3-column shell ──
   Intentionally NOT wrapped in `.container` (which caps at 1160px / 5% pad).
   Reading column ~700–800px at the widest breakpoint — the sweet spot for
   long-form serif reading (~70–90ch). */
.eu-doc-shell-wrap{
  padding:0 32px 56px;
  background: var(--eu-doc-bg);
}
.eu-doc-shell{
  /* Widened to 1600px from 1440 so the centre article column gets ~1040px
     instead of ~880px on wide monitors. Side rails kept the same width.
     Matches the layout that Confluence/Notion/GitBook converged on for
     reference-doc reading columns: prose stays comfortable at ~75 chars
     while tables/diagrams get enough room. */
  max-width:1600px; margin:-50px auto 0;
  display:grid;
  grid-template-columns: 240px minmax(0, 1fr) 260px;
  gap:32px;
  align-items:flex-start;
  position:relative; z-index:5;
}
@media (max-width:1400px){
  .eu-doc-shell{ grid-template-columns: 220px minmax(0, 1fr) 240px; gap:28px; }
}
@media (max-width:1200px){
  /* Below 1200px screen, hide the right TOC rail entirely to give the
     article body the full remaining width. */
  .eu-doc-shell{ grid-template-columns: 220px minmax(0, 1fr); gap:24px; }
  .eu-doc-toc{ display:none; }
}
@media (max-width:760px){
  .eu-doc-shell-wrap{ padding:0 16px 40px; }
  .eu-doc-shell{ grid-template-columns:1fr; gap:18px; }
  .eu-doc-snav{ position:static !important; }
  .eu-doc-hero__actions{ position:static; margin:14px 0 0; }
}

/* ── Wide-content handling inside the article body ──
   Tables exported from Confluence are frequently wider than any
   reasonable reading column (7-column matrices, 12-column metric
   tables, etc). Industry pattern (Confluence, GitBook, Stripe Docs):
   wrap them in a scroll container that lives INSIDE the column, with
   a visible scrollbar when content overflows.

   IMPORTANT: Confluence exports tables with INLINE `style="width:79.5%"`
   and <colgroup>/<col> elements with explicit widths that override
   external CSS. We use !important to defeat the inline styles, and we
   reset all <col> widths so the auto layout can decide cell sizing. */
.eu-doc-article__body table,
.article-body table{
  display:block !important;
  width:max-content !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:hidden;
  border-collapse:collapse;
  /* CSS scrollbar styling on macOS+Edge — visible only when overflowing */
  scrollbar-width:thin;
}
/* Reset Confluence's <colgroup>/<col width="..."> so the auto layout
   can decide per-cell width instead of being forced by the export. */
.eu-doc-article__body table col,
.article-body table col,
.eu-doc-article__body table colgroup,
.article-body table colgroup{
  width:auto !important;
  min-width:0 !important;
}
.eu-doc-article__body table th,
.eu-doc-article__body table td,
.article-body table th,
.article-body table td{
  min-width:110px !important;       /* prevent ridiculous 1-word-per-line wrap */
  max-width:380px;                  /* cap so one massive cell can't blow the layout */
  vertical-align:top;
  padding:10px 14px;
  white-space:normal !important;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
/* Wrap any Confluence-classed table in a horizontal scroller. The
   class is exported on most tables — gives us a second hook in case
   browser-specific quirks ignore the display:block trick. */
.eu-doc-article__body .confluenceTable,
.article-body .confluenceTable{
  display:block !important;
  overflow-x:auto !important;
  max-width:100% !important;
  width:max-content !important;
}
/* Visual cue when a table is scrollable: fade the right edge */
.eu-doc-article__body table::-webkit-scrollbar,
.article-body table::-webkit-scrollbar{ height:8px; }
.eu-doc-article__body table::-webkit-scrollbar-thumb,
.article-body table::-webkit-scrollbar-thumb{ background:var(--eu-border,#c5cdd8); border-radius:4px; }
.eu-doc-article__body table::-webkit-scrollbar-thumb:hover,
.article-body table::-webkit-scrollbar-thumb:hover{ background:var(--eu-text-muted,#6a6383); }

/* Wide images inside the article body — clamp to column width but
   allow the user to click through to the source for the full size. */
.eu-doc-article__body img,
.article-body img{ max-width:100%; height:auto; }

/* <pre> blocks already had overflow-x but reinforce — and tighten the
   font size in the doc body for code so 80-char lines fit. */
.eu-doc-article__body pre,
.article-body pre{
  overflow-x:auto; max-width:100%;
  font-size:13px; line-height:1.55;
}

/* Break-out class: if an article author wants a table or figure to use
   the full shell width (including the right rail's space), give the
   wrapper `<div class="eu-breakout">` and the inner content will extend
   220px right. Use sparingly — only for genuinely-wide reference data. */
.eu-doc-article__body .eu-breakout,
.article-body .eu-breakout{
  margin-right:-260px;
}
@media (max-width:1200px){
  .eu-doc-article__body .eu-breakout,
  .article-body .eu-breakout{ margin-right:0; }
}

/* ── Left rail: in-this-section nav ── */
.eu-doc-snav{
  position:sticky; top:74px;
  background:var(--eu-doc-paper);
  border:1px solid var(--eu-doc-line); border-radius:11px; padding:14px;
  box-shadow:0 1px 2px rgba(20,10,40,0.04), 0 8px 24px rgba(20,10,40,0.04);
}
.eu-doc-snav__hd{
  display:flex; align-items:center; gap:7px;
  padding:0 4px 10px; border-bottom:1px solid var(--eu-doc-line); margin-bottom:8px;
}
.eu-doc-snav__hd-i{
  width:18px; height:18px; border-radius:5px;
  background:var(--eu-doc-blue-bg); color:var(--eu-doc-blue);
  display:grid; place-items:center;
}
.eu-doc-snav__l{
  font-size:9.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase;
  color:var(--eu-doc-ink-3);
}
.eu-doc-snav__c{
  margin-left:auto; font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:10px; color:var(--eu-doc-ink-4);
}
.eu-doc-snav__item{
  display:grid; grid-template-columns:24px 1fr auto; gap:8px; align-items:center;
  padding:8px 6px; border-radius:6px;
  font-size:12.5px; line-height:1.35; font-weight:500;
  color:var(--eu-doc-ink-2);
  text-decoration:none;
}
.eu-doc-snav__item + .eu-doc-snav__item{ margin-top:1px; }
.eu-doc-snav__item:hover{ background:var(--eu-doc-hover); color:var(--eu-doc-ink); }
.eu-doc-snav__item.is-on{ background:var(--eu-doc-blue-bg); color:var(--eu-doc-blue); font-weight:600; }
.eu-doc-snav__item-n{
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:10px; font-weight:600; color:var(--eu-doc-ink-4);
  text-align:center;
}
.eu-doc-snav__item.is-on .eu-doc-snav__item-n{ color:var(--eu-doc-blue); }
.eu-doc-snav__item-t{ min-width:0; overflow:hidden; text-overflow:ellipsis; }
.eu-doc-snav__item-c{
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:9.5px; font-weight:600; color:var(--eu-doc-ink-4);
}
.eu-doc-snav__divider{ height:1px; background:var(--eu-doc-line); margin:8px 0; }
.eu-doc-snav__back{
  display:flex; align-items:center; gap:6px;
  padding:7px 0; font-size:12px; font-weight:500; color:var(--eu-doc-ink-3);
  border-top:1px dashed var(--eu-doc-line); margin-top:6px;
}
.eu-doc-snav__back:hover{ color:var(--eu-doc-blue); }

/* ── Center: article card ──
   Legacy theme CSS sets `.article { max-width:66%; min-width:640px; padding:0 30px }`
   at min-width:1024px. The double-classed `<article class="eu-doc-article article">`
   inherits that, which collapses the grid track. Reset all of those here. */
.eu-doc-shell .article,
.eu-doc-article{
  flex: initial !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: auto;
}
.eu-doc-article{
  background:var(--eu-doc-paper);
  border:1px solid var(--eu-doc-line); border-radius:14px; overflow:hidden;
  box-shadow:0 1px 2px rgba(20,10,40,0.04);
}
.eu-doc-article__top{
  padding:18px 32px 0;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  border-bottom:1px solid var(--eu-doc-line);
}
.eu-doc-article__chip{
  display:inline-flex; align-items:center; gap:6px;
  font-size:11px; font-weight:600;
  padding:4px 9px; border-radius:14px;
  background:var(--eu-doc-sunk); color:var(--eu-doc-ink-3);
}
/* Honour the hidden attribute — the doc-id chip starts hidden until JS
 * detects a "[NOOB 3PS04]"-style marker in the title. */
.eu-doc-article__chip[hidden]{ display:none !important; }
.eu-doc-article__chip-dot{ width:6px; height:6px; border-radius:50%; background:var(--eu-doc-green); }
.eu-doc-article__chip--blue{ background:var(--eu-doc-blue-bg); color:var(--eu-doc-blue); font-family:'JetBrains Mono', ui-monospace, monospace; letter-spacing:0.05em; }
.eu-doc-article__top-r{
  margin-left:auto; display:flex; gap:6px; padding-bottom:14px;
}
.eu-doc-article__top-btn{
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 10px; font-size:11.5px; font-weight:600;
  border:1px solid var(--eu-doc-line); border-radius:6px;
  background:var(--eu-doc-paper); color:var(--eu-doc-ink-2);
  cursor:pointer;
}
.eu-doc-article__top-btn:hover{ background:var(--eu-doc-sunk); color:var(--eu-doc-ink); }
.eu-doc-article__top-btn--ghost{ background:transparent; }

/* Body — serif reading column */
.eu-doc-article__body{
  padding:30px 32px 18px;
  font-family:var(--eu-doc-serif);
  font-size:16.5px; line-height:1.72;
  color:var(--eu-doc-ink-2);
  max-width:none;
}
.eu-doc-article__body p{ margin:0 0 16px; color:var(--eu-doc-ink-2); }
.eu-doc-article__body p strong{ color:var(--eu-doc-ink); font-weight:600; }
.eu-doc-article__body p:first-child{ font-size:17.5px; color:var(--eu-doc-ink); line-height:1.6; }
.eu-doc-article__body p.eu-doc-article__lede-source{ display:none; }  /* hide once lifted into hero */

.eu-doc-article__body h2{
  font-family:'Inter', system-ui, sans-serif;
  font-size:21px; font-weight:800; letter-spacing:-0.012em;
  margin:34px 0 10px; padding-left:14px;
  color:var(--eu-doc-ink); position:relative; scroll-margin-top:84px;
}
.eu-doc-article__body h2::before{
  content:''; position:absolute; left:0; top:5px; bottom:5px; width:4px;
  border-radius:3px; background:var(--eu-doc-grad);
}
.eu-doc-article__body h3{
  font-family:'Inter', system-ui, sans-serif;
  font-size:16px; font-weight:700; letter-spacing:-0.005em;
  margin:24px 0 8px; color:var(--eu-doc-ink); scroll-margin-top:84px;
}
.eu-doc-article__body h4{
  font-family:'Inter', system-ui, sans-serif;
  font-size:14px; font-weight:700; letter-spacing:-0.005em;
  margin:20px 0 6px; color:var(--eu-doc-ink); scroll-margin-top:84px;
}

.eu-doc-article__body ul,
.eu-doc-article__body ol{ margin:0 0 18px; padding-left:0; list-style:none; }
.eu-doc-article__body ul li,
.eu-doc-article__body ol li{
  position:relative; padding:7px 0 7px 28px;
  border-bottom:1px solid rgba(225,227,235,0.5);
  font-family:var(--eu-doc-serif);
}
html.eu-dark .eu-doc-article__body ul li,
html.eu-dark .eu-doc-article__body ol li{ border-bottom-color:rgba(255,255,255,0.06); }
.eu-doc-article__body ul li:last-child,
.eu-doc-article__body ol li:last-child{ border-bottom:none; }
.eu-doc-article__body ul li::before{
  content:''; position:absolute; left:8px; top:18px;
  width:6px; height:6px; border-radius:50%; background:var(--eu-doc-blue);
}
.eu-doc-article__body ol{ counter-reset:item; }
.eu-doc-article__body ol li{ counter-increment:item; }
.eu-doc-article__body ol li::before{
  content:counter(item);
  position:absolute; left:0; top:7px;
  width:20px; height:20px; border-radius:50%;
  background:var(--eu-doc-blue-bg); color:var(--eu-doc-blue);
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:10px; font-weight:700; line-height:1;
  display:grid; place-items:center;
}

.eu-doc-article__body code{
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:0.86em;
  background:var(--eu-doc-sunk); color:var(--eu-doc-ink);
  padding:1px 6px; border-radius:4px; font-weight:500;
  border:1px solid var(--eu-doc-line);
}
.eu-doc-article__body pre{
  background:#1a0f2e; color:#e8e0f5;
  border-radius:10px; overflow:auto;
  margin:18px 0; padding:14px 16px;
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:13px; line-height:1.65;
}
.eu-doc-article__body pre code{ background:transparent; border:none; color:inherit; padding:0; }

.eu-doc-article__body blockquote{
  margin:18px 0; padding:14px 16px 14px 18px;
  border-left:4px solid var(--eu-doc-blue);
  background:var(--eu-doc-blue-soft);
  border-radius:0 10px 10px 0;
  color:var(--eu-doc-ink-2);
  font-family:var(--eu-doc-serif);
}
.eu-doc-article__body blockquote.is-tip,
.eu-doc-article__body blockquote.is-success{
  border-left-color:var(--eu-doc-green); background:var(--eu-doc-green-bg);
}
.eu-doc-article__body blockquote.is-warning,
.eu-doc-article__body blockquote.is-important{
  border-left-color:var(--eu-doc-magenta); background:var(--eu-doc-magenta-bg);
}

.eu-doc-article__body img{
  max-width:100%; height:auto;
  border-radius:10px; border:1px solid var(--eu-doc-line);
  margin:14px 0;
}

.eu-doc-article__body table{
  width:100%; border-collapse:collapse; margin:18px 0;
  font-family:'Inter', system-ui, sans-serif; font-size:13.5px;
  border:1px solid var(--eu-doc-line); border-radius:10px; overflow:hidden;
}
.eu-doc-article__body th{
  background:var(--eu-doc-ink); color:#fff;
  padding:10px 14px; text-align:left;
  font-size:10.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;
}
.eu-doc-article__body td{
  padding:12px 14px;
  border-top:1px solid var(--eu-doc-line);
  color:var(--eu-doc-ink-2);
}
.eu-doc-article__body tr:hover td{ background:var(--eu-doc-blue-soft); }

.eu-doc-article__body hr{
  border:0; height:1px; background:var(--eu-doc-line); margin:24px 0;
}

/* ── Article footer ── */
.eu-doc-article__foot{
  padding:24px 32px 28px;
  border-top:1px solid var(--eu-doc-line);
  background:linear-gradient(180deg, var(--eu-doc-paper), var(--eu-doc-bg));
}

.eu-doc-feedback{
  display:flex; align-items:center; gap:14px;
  padding:16px 18px; margin-bottom:18px;
  background:var(--eu-doc-paper);
  border:1px solid var(--eu-doc-line); border-radius:11px;
}
.eu-doc-feedback__i{
  width:32px; height:32px; border-radius:8px;
  background:var(--eu-doc-blue-bg); color:var(--eu-doc-blue);
  display:grid; place-items:center; flex-shrink:0;
}
.eu-doc-feedback__t{ font-size:13.5px; font-weight:700; color:var(--eu-doc-ink); letter-spacing:-0.005em; }
.eu-doc-feedback__d{ font-size:12px; color:var(--eu-doc-ink-3); margin-top:1px; }
.eu-doc-feedback__r{ margin-left:auto; display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.eu-doc-feedback__btn{
  display:inline-flex; align-items:center; gap:5px;
  padding:7px 12px; font-size:12px; font-weight:600;
  border:1px solid var(--eu-doc-line); border-radius:7px;
  background:var(--eu-doc-paper); color:var(--eu-doc-ink-2); cursor:pointer;
}
.eu-doc-feedback__btn:hover{ background:var(--eu-doc-hover); }
.eu-doc-feedback__btn.is-selected,
.eu-doc-feedback__btn--yes.is-selected{
  background:var(--eu-doc-green-bg); color:var(--eu-doc-green);
  border-color:rgba(46,128,96,0.30);
}
.eu-doc-feedback__btn--no.is-selected{
  background:rgba(192,41,26,0.08); color:#c0291a; border-color:rgba(192,41,26,0.30);
}
.eu-doc-feedback__count{ font-size:11.5px; color:var(--eu-doc-ink-3); margin-left:6px; }

.eu-doc-nextprev{
  display:grid; grid-template-columns:1fr 1fr; gap:10px;
}
@media (max-width:560px){ .eu-doc-nextprev{ grid-template-columns:1fr; } }
.eu-doc-nextprev__a{
  display:flex; flex-direction:column; gap:3px;
  padding:14px 16px;
  background:var(--eu-doc-paper);
  border:1px solid var(--eu-doc-line); border-radius:10px;
  color:var(--eu-doc-ink);
  transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}
.eu-doc-nextprev__a:hover{
  border-color:var(--eu-doc-line-2); transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(20,10,40,0.06);
}
.eu-doc-nextprev__a--next{ text-align:right; align-items:flex-end; }
.eu-doc-nextprev__l{
  display:flex; align-items:center; gap:5px;
  font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--eu-doc-ink-3);
}
.eu-doc-nextprev__t{
  font-size:13.5px; font-weight:700; color:var(--eu-doc-ink);
  letter-spacing:-0.005em; line-height:1.35;
}

.eu-doc-article__share-row{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-top:16px;
}
.eu-doc-article__share-row .article-share{ display:inline-flex; gap:6px; }
.eu-doc-article__comment-count{
  display:inline-flex; align-items:center; gap:5px;
  font-size:12px; color:var(--eu-doc-ink-3); font-weight:600;
}
.eu-doc-article__more{ margin-top:16px; }
.eu-doc-article__relatives,
.eu-doc-article__comments{
  padding:24px 32px;
  border-top:1px solid var(--eu-doc-line);
  background:var(--eu-doc-paper);
}

/* Hide content-tags chrome inside the doc body — they're shown elsewhere */
.eu-doc-article__tags{ padding:0 32px 18px; }

/* ── Right rail: TOC + related + reading tip ── */
.eu-doc-toc{
  position:sticky; top:74px;
  display:flex; flex-direction:column; gap:14px;
}
.eu-doc-toc__card{
  background:var(--eu-doc-paper);
  border:1px solid var(--eu-doc-line); border-radius:11px; padding:14px;
  box-shadow:0 1px 2px rgba(20,10,40,0.04);
}
.eu-doc-toc__l{
  display:flex; align-items:center; gap:6px;
  margin-bottom:10px; padding:0 2px;
  font-size:9.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase;
  color:var(--eu-doc-ink-3);
}
.eu-doc-toc__l-i{
  width:14px; height:14px; border-radius:4px;
  background:var(--eu-doc-blue-bg); color:var(--eu-doc-blue);
  display:grid; place-items:center;
}
.eu-doc-toc__items{
  display:flex; flex-direction:column; gap:1px;
  font-family:'Inter', system-ui, sans-serif;
}
.eu-doc-toc__item{
  display:block; padding:6px 8px;
  font-size:12px; line-height:1.4; font-weight:500;
  color:var(--eu-doc-ink-3);
  border-left:2px solid transparent;
  text-decoration:none;
}
.eu-doc-toc__item:hover{ color:var(--eu-doc-ink); background:var(--eu-doc-hover); border-radius:0 5px 5px 0; }
.eu-doc-toc__item.is-on{ color:var(--eu-doc-blue); font-weight:700; border-left-color:var(--eu-doc-blue); }
.eu-doc-toc__item.is-h3{ padding-left:18px; font-size:11.5px; }

.eu-doc-toc__related{ padding:0; display:flex; flex-direction:column; }
.eu-doc-toc__related-item{
  display:flex; align-items:center; gap:8px;
  padding:8px 2px;
  border-bottom:1px solid var(--eu-doc-line);
  font-size:11.5px; font-weight:500; line-height:1.4;
  color:var(--eu-doc-ink-2);
}
.eu-doc-toc__related-item:last-child{ border-bottom:none; }
.eu-doc-toc__related-item:hover{ color:var(--eu-doc-blue); }
.eu-doc-toc__related-i{
  width:14px; height:14px; border-radius:4px;
  background:var(--eu-doc-sunk); color:var(--eu-doc-ink-3);
  display:grid; place-items:center; flex-shrink:0;
}

.eu-doc-toc__hint{
  background:linear-gradient(135deg, var(--eu-doc-paper), var(--eu-doc-green-bg));
  border:1px solid var(--eu-doc-line); border-left:3px solid var(--eu-doc-green);
  border-radius:10px; padding:12px 14px;
}
.eu-doc-toc__hint-l{
  display:flex; align-items:center; gap:5px; margin-bottom:6px;
  font-size:9.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase;
  color:var(--eu-doc-green);
}
.eu-doc-toc__hint-t{ font-size:12px; line-height:1.5; font-weight:500; color:var(--eu-doc-ink-2); }
.eu-doc-toc__hint-t strong{ color:var(--eu-doc-ink); font-weight:700; }

/* Print: hide the chrome, keep the article body clean */
@media print{
  .eu-doc-progress, .eu-doc-hero__actions,
  .eu-doc-snav, .eu-doc-toc, .eu-doc-article__top-r,
  .eu-doc-feedback__r, .eu-doc-nextprev,
  .eu-doc-article__share-row, .eu-doc-article__more,
  .eu-doc-article__relatives, .eu-doc-article__comments{ display:none !important; }
  .eu-doc-shell{ grid-template-columns:1fr; margin-top:0; }
  .eu-doc-article{ border:none; box-shadow:none; }
  .eu-doc-hero{ background:#fff !important; color:var(--eu-doc-ink) !important; padding:24px 0; }
  .eu-doc-hero__title, .eu-doc-hero__meta strong{ color:#000 !important; }
  .eu-doc-hero__sub, .eu-doc-hero__meta{ color:#333 !important; }
}

/* ============================================================
 * #10595 — Disclaimer / info blocks unreadable in dark mode
 * ------------------------------------------------------------
 * Articles use inline-styled coloured panels for disclaimers
 *   <div style="background:#fff3cd;border-left:4px solid #d97706;..">
 *     <strong>The EBSI website is not meant to store…</strong>
 *   </div>
 * The inline background wins specificity, but the surrounding
 * article body uses `--eu-text-primary` for text colour. In
 * dark mode that's light cream → light-on-light-yellow = invisible.
 *
 * Use attribute selectors to match the inline background values
 * the editor produces (the user's CMS emits `#fff3cd`, `#dbeafe`,
 * `#fefce8`, `#fef3c7`, `#fff8e1`, `#fffbe6` and their RGB equivalents).
 * Override the inline background with a dark, contrasted equivalent
 * and force a readable text colour on every descendant.
 * ============================================================ */
html.eu-dark .article-body [style*="#fff3cd" i],
html.eu-dark .article-body [style*="#fffbe6" i],
html.eu-dark .article-body [style*="#fef3c7" i],
html.eu-dark .article-body [style*="#fff8e1" i],
html.eu-dark .article-body [style*="#fefce8" i],
html.eu-dark .article-body [style*="rgb(255,243,205)"],
html.eu-dark .article-body [style*="rgba(255,243,205"]{
  background-color: rgba(245, 158, 11, 0.14) !important;   /* dark amber tint */
  border-left-color: #f59e0b !important;
  color: #fef3c7 !important;
}
/* Info / blue */
html.eu-dark .article-body [style*="#dbeafe" i],
html.eu-dark .article-body [style*="#e0f2fe" i],
html.eu-dark .article-body [style*="#eff6ff" i],
html.eu-dark .article-body [style*="#cfe2ff" i],
html.eu-dark .article-body [style*="rgb(219,234,254)"]{
  background-color: rgba(91, 155, 230, 0.16) !important;   /* dark blue tint */
  border-left-color: #5b9be6 !important;
  color: #dbeafe !important;
}
/* Success / green */
html.eu-dark .article-body [style*="#d1fae5" i],
html.eu-dark .article-body [style*="#dcfce7" i],
html.eu-dark .article-body [style*="#bbf7d0" i]{
  background-color: rgba(46, 128, 96, 0.20) !important;
  border-left-color: #34d399 !important;
  color: #d1fae5 !important;
}
/* Danger / red */
html.eu-dark .article-body [style*="#fee2e2" i],
html.eu-dark .article-body [style*="#fecaca" i],
html.eu-dark .article-body [style*="#fef2f2" i]{
  background-color: rgba(192, 41, 26, 0.20) !important;
  border-left-color: #f87171 !important;
  color: #fee2e2 !important;
}
/* Propagate the new text colour into every inline-styled descendant
 * that doesn't itself set color (covers <strong>, <em>, <span>, <p>). */
html.eu-dark .article-body [style*="#fff3cd" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#fffbe6" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#fef3c7" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#fff8e1" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#dbeafe" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#e0f2fe" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#d1fae5" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#fee2e2" i] *:not([style*="color"]),
html.eu-dark .article-body [style*="#fef2f2" i] *:not([style*="color"]){
  color: inherit !important;
}
/* And anchor links inside disclaimers — keep them legible. */
html.eu-dark .article-body [style*="#fff3cd" i] a,
html.eu-dark .article-body [style*="#fef3c7" i] a,
html.eu-dark .article-body [style*="#dbeafe" i] a{
  color: #ffd6a5 !important;
  text-decoration: underline;
}

/* ════════════════════════════════════════════════════════════════
 * Blockchain Internal landing — search + curated hub + tree sidebar
 * ════════════════════════════════════════════════════════════════ */
.eu-bci-hero{position:relative;padding:32px 24px 28px;background:linear-gradient(135deg,#1a0f2e 0%,#2a1750 35%,#5b1f6e 70%,#8e1c70 100%);color:#fff}
.eu-bci-hero::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 90% 0%,rgba(192,26,133,.35),transparent 45%),radial-gradient(circle at 0% 100%,rgba(24,80,181,.30),transparent 50%)}
.eu-bci-hero__inner{position:relative;max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 460px;gap:32px;align-items:end}
@media(max-width:900px){.eu-bci-hero__inner{grid-template-columns:1fr}}
.eu-bci-hero__chip{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;background:rgba(126,234,158,.10);border:1px solid rgba(126,234,158,.32);color:#a8f5c2;border-radius:14px}
.eu-bci-hero__chip-dot{width:5px;height:5px;border-radius:50%;background:#7eea9e;animation:bciPulse 2s ease-in-out infinite}
@keyframes bciPulse{50%{opacity:.4}}
.eu-bci-hero__title{font-size:34px;font-weight:800;letter-spacing:-.02em;margin:12px 0 8px;color:#fff}
.eu-bci-hero__desc{font-size:14px;line-height:1.55;color:rgba(255,255,255,.78);max-width:60ch;margin:0 0 12px}
.eu-bci-hero__stat{font-size:12px;color:rgba(255,255,255,.65);font-family:'JetBrains Mono',ui-monospace,monospace}
.eu-bci-hero__stat span{color:#fff;font-weight:700}
.eu-bci-hero__search{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:14px;backdrop-filter:blur(8px)}
.eu-bci-search__label{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:8px}
.eu-bci-search__wrap{position:relative}
.eu-bci-search__icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.6);pointer-events:none}
.eu-bci-search__wrap input{width:100%;padding:10px 60px 10px 40px;height:42px;background:rgba(0,0,0,.20);border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;font-size:14px;font-family:inherit;outline:none}
.eu-bci-search__wrap input::placeholder{color:rgba(255,255,255,.5)}
.eu-bci-search__wrap input:focus{border-color:rgba(255,255,255,.4);background:rgba(0,0,0,.30)}
.eu-bci-search__kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;color:rgba(255,255,255,.6);padding:2px 7px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:5px}
.eu-bci-shell{padding:24px 16px 48px;max-width:1280px;margin:0 auto}
.eu-bci-grid{display:grid;grid-template-columns:280px 1fr;gap:28px;align-items:flex-start}
@media(max-width:900px){.eu-bci-grid{grid-template-columns:1fr}.eu-bci-sidebar{position:static !important;max-height:none !important}}
.eu-bci-sidebar{position:sticky;top:80px;background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#e1e3eb);border-radius:12px;padding:14px;max-height:calc(100vh - 110px);overflow:auto}
.eu-bci-sidebar__hd{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.eu-bci-sidebar__l{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--eu-text-muted,#6a6383)}
.eu-bci-sidebar__collapse{margin-left:auto;background:none;border:none;cursor:pointer;font-size:11px;color:var(--eu-accent,#1850b5);font-weight:600;padding:2px 6px;border-radius:5px}
.eu-bci-sidebar__collapse:hover{background:var(--eu-bg-sunk,#f6f7fa)}
.eu-bci-tree-filter{width:100%;padding:7px 11px;font-size:12.5px;border:1px solid var(--eu-border,#e1e3eb);border-radius:7px;margin-bottom:10px;font-family:inherit;outline:none}
.eu-bci-tree-filter:focus{border-color:var(--eu-accent,#1850b5)}
.eu-bci-tree__loading{font-size:12px;color:var(--eu-text-muted,#6a6383);padding:8px 0}
.eu-bci-tree__g+.eu-bci-tree__g{border-top:1px solid var(--eu-line-soft,#eef0f6);margin-top:6px;padding-top:6px}
.eu-bci-tree__g-h{cursor:pointer;padding:6px 4px;list-style:none;display:flex;align-items:center;gap:8px;user-select:none}
.eu-bci-tree__g-h::-webkit-details-marker{display:none}
.eu-bci-tree__g-h::before{content:'▸';font-size:10px;color:var(--eu-text-muted,#6a6383);transition:transform .15s}
.eu-bci-tree__g[open]>.eu-bci-tree__g-h::before{transform:rotate(90deg)}
.eu-bci-tree__g-l{flex:1;font-size:12.5px;font-weight:700;color:var(--eu-text-primary,#1a0f2e)}
.eu-bci-tree__g-c{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;color:var(--eu-text-muted,#6a6383);padding:1px 6px;background:var(--eu-bg-sunk,#f6f7fa);border-radius:8px}
.eu-bci-tree__list{list-style:none;padding:4px 0 4px 14px;margin:0}
.eu-bci-tree__a{display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:5px;font-size:12px;color:var(--eu-text-secondary,#3a2e54);text-decoration:none;line-height:1.35}
.eu-bci-tree__a:hover{background:var(--eu-bg-sunk,#f6f7fa);color:var(--eu-accent,#1850b5)}
.eu-bci-tree__a-c{margin-left:auto;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;color:var(--eu-text-muted,#6a6383)}
.eu-bci-main{min-width:0}
.eu-bci-section-h{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--eu-text-muted,#6a6383);margin:0 0 12px}
.eu-bci-results{background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#e1e3eb);border-radius:12px;padding:14px 18px;margin-bottom:20px}
.eu-bci-results__hd{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.eu-bci-results__t{flex:1;font-size:15px;font-weight:700;color:var(--eu-text-primary,#1a0f2e);margin:0}
.eu-bci-results__c{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:var(--eu-text-muted,#6a6383);font-weight:500}
.eu-bci-results__close{background:none;border:1px solid var(--eu-border,#e1e3eb);border-radius:6px;padding:5px 10px;font-size:11.5px;font-weight:600;color:var(--eu-text-muted,#6a6383);cursor:pointer}
.eu-bci-results__close:hover{background:var(--eu-bg-sunk,#f6f7fa);color:var(--eu-text-primary,#1a0f2e)}
.eu-bci-results__list{list-style:none;padding:0;margin:0;max-height:480px;overflow:auto}
.eu-bci-results__list li{border-bottom:1px solid var(--eu-line-soft,#eef0f6)}
.eu-bci-results__list li:last-child{border-bottom:none}
.eu-bci-results__list a{display:block;padding:10px 4px;text-decoration:none;color:inherit}
.eu-bci-results__list a:hover{background:var(--eu-bg-sunk,#f6f7fa)}
.eu-bci-result__t{display:block;font-size:13.5px;font-weight:600;color:var(--eu-text-primary,#1a0f2e);margin-bottom:2px}
.eu-bci-result__t mark{background:rgba(192,26,133,.18);color:inherit;padding:0 2px;border-radius:2px}
.eu-bci-result__m{display:block;font-size:11px;color:var(--eu-text-muted,#6a6383);font-family:'JetBrains Mono',ui-monospace,monospace}
.eu-bci-tiles{margin-bottom:24px}
.eu-bci-tiles__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.eu-bci-tile{display:block;background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#e1e3eb);border-radius:12px;padding:16px;color:inherit;text-decoration:none;transition:transform .15s,box-shadow .15s,border-color .15s}
.eu-bci-tile:hover{transform:translateY(-2px);box-shadow:0 4px 18px rgba(20,10,40,.08);border-color:var(--eu-border-strong,#c5cdd8)}
.eu-bci-tile__icon{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;font-size:18px;color:#fff;margin-bottom:10px}
.eu-bci-tile--gov  .eu-bci-tile__icon{background:linear-gradient(135deg,#5b3a8a,#7a3aa0)}
.eu-bci-tile--tech .eu-bci-tile__icon{background:linear-gradient(135deg,#1850b5,#3a85d8)}
.eu-bci-tile--ops  .eu-bci-tile__icon{background:linear-gradient(135deg,#2e8060,#3aa080)}
.eu-bci-tile--know .eu-bci-tile__icon{background:linear-gradient(135deg,#b07b00,#dba300)}
.eu-bci-tile--archive .eu-bci-tile__icon{background:linear-gradient(135deg,#6a6383,#9b95ad)}
.eu-bci-tile__t{font-size:14px;font-weight:700;color:var(--eu-text-primary,#1a0f2e);margin-bottom:4px;letter-spacing:-.01em}
.eu-bci-tile__d{font-size:12px;color:var(--eu-text-muted,#6a6383);line-height:1.5;margin-bottom:8px}
.eu-bci-tile__c{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:700;color:var(--eu-accent,#1850b5);padding:2px 8px;background:rgba(24,80,181,.08);border-radius:8px;display:inline-block}
.eu-bci-recent{background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#e1e3eb);border-radius:12px;padding:14px 18px;margin-bottom:24px}
.eu-bci-recent__list{list-style:none;padding:0;margin:0}
.eu-bci-recent__list li{border-bottom:1px solid var(--eu-line-soft,#eef0f6)}
.eu-bci-recent__list li:last-child{border-bottom:none}
.eu-bci-recent__list a{display:flex;gap:14px;padding:10px 4px;text-decoration:none;color:inherit}
.eu-bci-recent__list a:hover{background:var(--eu-bg-sunk,#f6f7fa)}
.eu-bci-recent__t{flex:1;font-size:13px;font-weight:600;color:var(--eu-text-primary,#1a0f2e)}
.eu-bci-recent__m{font-size:10.5px;color:var(--eu-text-muted,#6a6383);font-family:'JetBrains Mono',ui-monospace,monospace;white-space:nowrap}
.eu-bci-recent__sk{height:40px;background:linear-gradient(90deg,var(--eu-bg-sunk,#f6f7fa),var(--eu-line-soft,#eef0f6),var(--eu-bg-sunk,#f6f7fa));background-size:200% 100%;animation:bciSk 1.2s linear infinite}
@keyframes bciSk{to{background-position:-200% 0}}
.eu-bci-sections__hd{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.eu-bci-az{margin-left:auto;display:flex;gap:1px;flex-wrap:wrap;max-width:480px}
.eu-bci-az__b{display:inline-grid;place-items:center;width:22px;height:22px;font-size:11px;font-weight:700;color:var(--eu-accent,#1850b5);border-radius:4px;cursor:pointer;text-decoration:none;font-family:'JetBrains Mono',ui-monospace,monospace}
.eu-bci-az__b:hover{background:rgba(24,80,181,.10)}
.eu-bci-az__b.is-dim{color:var(--eu-text-muted,#9b95ad);cursor:default}
.eu-bci-az__b.is-dim:hover{background:transparent}
.eu-bci-sec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.eu-bci-sec-card{display:block;background:var(--eu-bg-card,#fff);border:1px solid var(--eu-border,#e1e3eb);border-radius:9px;padding:11px 14px;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.eu-bci-sec-card:hover{border-color:var(--eu-accent,#1850b5);transform:translateX(2px)}
.eu-bci-sec-card.is-flash{animation:bciFlash 1.2s}
@keyframes bciFlash{0%,100%{background:var(--eu-bg-card,#fff)}30%{background:rgba(24,80,181,.10)}}
.eu-bci-sec-card__t{font-size:13px;font-weight:600;color:var(--eu-text-primary,#1a0f2e);line-height:1.3}
.eu-bci-sec-card__c{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;color:var(--eu-text-muted,#6a6383);margin-top:3px}
.eu-bci-empty{padding:20px;text-align:center;font-size:12.5px;color:var(--eu-text-muted,#6a6383)}
.eu-bci-empty a{color:var(--eu-accent,#1850b5);font-weight:600}
.eu-dark .eu-bci-sidebar,.eu-dark .eu-bci-tile,.eu-dark .eu-bci-sec-card,.eu-dark .eu-bci-recent,.eu-dark .eu-bci-results{background:var(--eu-bg-card)}
.eu-dark .eu-bci-tile__t,.eu-dark .eu-bci-sec-card__t,.eu-dark .eu-bci-recent__t,.eu-dark .eu-bci-result__t{color:var(--eu-text-primary)}
.eu-dark .eu-bci-tile__d{color:var(--eu-text-secondary)}
.eu-dark .eu-bci-tree__a{color:var(--eu-text-secondary)}

/* ═══════════════════════════════════════════════════════════════════════
 * Cosmetic batch — #10682, #10678, #10677, #10613, #10603
 * ═══════════════════════════════════════════════════════════════════════ */

/* #10682 — Long ticket subject overlaps UI elements on the request details
   page. The H1 had no wrap/overflow handling; subjects > ~80 chars pushed
   into adjacent actions. Force wrapping + a sensible max-width. */
.request-detail h1,
.request-page__title,
[class*="request"] h1,
.request-table th[data-test-id*="subject"],
.request-table td[data-test-id*="subject"] {
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  max-width: 100%;
}
.request-table td[data-test-id*="subject"] {
  white-space: normal;
  max-width: 640px;
}

/* #10678 — Search bar magnifying-glass overlaps the placeholder text.
   The icon sits at left:14px but the input has padding-left:14px, so the
   placeholder lands under the icon. Push the input padding-left to clear
   the icon + breathing room. */
.search input[type="search"],
.search input,
[class*="search"] input[type="search"] {
  padding-left: 38px !important;
}
.search-icon,
[class*="search"] svg[class*="icon"],
.search button[type="submit"] {
  pointer-events: none;
}

/* #10613 — Required-field warning icon was rendered with a zero-length
   <line> for the dot — already fixed in the .eu-field-error::before
   block above. This rule re-asserts it in case any other stylesheet
   imported later overrides it. */
.eu-field-error::before {
  /* fill — see canonical definition near line ~4270 — keep both in sync */
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

/* #10603 — The login page shows a "Forgot password?" link AND a redundant
   "Reset password" link in the secondary nav, both linking to the same
   target. Hide the secondary one to remove the duplication. */
.signin-form a[href*="password/new"]:not(:first-of-type),
.signin-form .signin-form__forgot-password ~ a[href*="password"]:not(.signin-form__forgot-password),
.signin-page__secondary-links a[href*="password"] {
  display: none !important;
}

/* #10677 — Profile page in dark mode: form field labels, helper text,
   meta strings all render at color rgba(0,0,0,0.55) — invisible on dark
   background. Force light text colour for body content in profile route. */
.eu-dark .profile-page,
.eu-dark [data-test-id*="profile"],
.eu-dark [class*="profile"] {
  color: var(--eu-text, #e7e8ee);
}
.eu-dark .profile-page label,
.eu-dark .profile-page .form-field label,
.eu-dark .profile-page .meta,
.eu-dark .profile-page p,
.eu-dark .profile-page div,
.eu-dark [class*="profile"] label,
.eu-dark [class*="profile"] .meta,
.eu-dark [class*="profile"] dl,
.eu-dark [class*="profile"] dd {
  color: var(--eu-text, #e7e8ee) !important;
}
.eu-dark .profile-page input,
.eu-dark .profile-page textarea,
.eu-dark [class*="profile"] input,
.eu-dark [class*="profile"] textarea {
  background: #1a1230;
  color: #fff;
  border-color: #3a2860;
}
/* Ensure phone-number row shows after save — Zendesk hides empty fields
   by default; force its container to render even if the formatted value
   is whitespace. */
[class*="profile"] [data-test-id*="phone"],
[class*="profile"] .phone,
[class*="profile"] [class*="phone"] {
  display: block !important;
  visibility: visible !important;
}