:root {
    --main-color: #197E46;
    --support-color: #FBEC0D;
    --dark-main-color: #156a3b;
    --main-color-075: rgba(25, 126, 70, 0.075);
    --main-color-60: rgba(25, 126, 70, 0.6);
}
.homepage-pushes {
    background-color: var(--main-color);
    box-shadow: 0px 5px 0px var(--support-color);
}
.homepage-push,
.new-header .top-bar .official-site-more-info-content .block-icon,
.btn-yesno.btn-yes.active, .btn-opts.btn-yes-page.active,
.row-step .inner .nb,
.box .sumTitle h2 .total-nb.total-nb-timeframe, .box .sumTitle h2.withPanel .total-nb,
.repositories-menu .navigation a.selected span.total,
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover,
.new-header .menu-bar .container .content .login-dropdown .dropdown-menu.logged-menu li button:hover, .new-header .menu-bar .container .content .logged-dropdown .dropdown-menu.logged-menu li button:hover,
.left-sidebar .drawer-footer nav.navigation-drawer-page-menu>ul li.login-dropdown .dropdown-menu.login-menu form .form-group button:hover {
    background-color: var(--main-color);
}
.homepage-pushes-content .homepage-push.video:hover,
.homepage-push:hover {
    background-color: var(--support-color);
}
:is(.homepage-pushes-content .homepage-push.video:hover, .homepage-push:hover) :is(.homepage-push-title, .homepage-push-description) {
    color: black;
}
.new-header .top-bar .slogan .official-site-more-info-toggler,
.new-header .top-bar .official-site-more-info-content .desc-block span,
.left-sidebar .drawer-footer nav.navigation-drawer-page-menu>ul li a:hover,
.new-header .menu-bar .container .content ul.nav.navbar-nav.left-nav>li.is-dropdown>a:hover,
body a:hover,
.link-footer-item-link:hover,
.transparent-bordered-button:hover, a.transparent-bordered-button:hover,
.hs-toggle i.fa-toggle-on,
.related-products .search-badge,
a,
.first-level-accordion>.accordion-container>.product-group-items>.product-group-item-title,
.my-expand .expand-description a.btn-link,
.box .sumTitle h2,
h2,
.timef .tftitle,
.repositories-menu .navigation a.selected span.title,
.directory-thumb-list>.row>div .item .content div.shadow span,
.directory-pagination span.next a, .directory-pagination span.prev a,
.directory-pagination span.active, .directory-pagination a.active, .directory-pagination a:visited.active,
.item-unit .text a:hover,
.directory-plain-list .item .link-group a,
.left-sidebar .drawer-footer nav.navigation-drawer-page-menu>ul li.login-dropdown .dropdown-menu.login-menu form .form-group button,
.new-header .menu-bar .container .content .login-dropdown .dropdown-menu.logged-menu li button, .new-header .menu-bar .container .content .logged-dropdown .dropdown-menu.logged-menu li button,
.new-header .menu-bar .container .content .login-dropdown .dropdown-menu.logged-menu li form .checkbox label input:checked~.fa-toggle-on, .new-header .menu-bar .container .content .logged-dropdown .dropdown-menu.logged-menu li form .checkbox label input:checked~.fa-toggle-on,
.new-header .menu-bar .container .content ul.nav.navbar-nav.left-nav>li a:hover,
tr.cost td.costHypotesis strong.editableValue,
.costs-payment .costValue,
.search-well-nopadding.first-level-accordion .accordion-container.product-group-container .product-group-items .product-group-item-content .accordion-content-wrapper .search-sub-group .product-group-container .product-group-items .product-group-item-title {
    color: var(--main-color);
}
.new-header .menu-bar .container .content ul.nav.navbar-nav.left-nav>li.is-dropdown:hover>a {
    color: var(--main-color) !important;
}
.new-header .brand-bar .navbar-brand > p {
    margin: 0;
}
.right-sidebar section.contact-section .feedback-wizard-navigation button:hover,
.transparent-bordered-button, a.transparent-bordered-button,
.main-link a,
.my-expand .expand-description a.btn-link,
.box .sumTitle h2 .total-nb.total-nb-timeframe, .box .sumTitle h2.withPanel .total-nb,
.left-sidebar .drawer-footer nav.navigation-drawer-page-menu>ul li.login-dropdown .dropdown-menu.login-menu form .form-group button,
.new-header .menu-bar .container .content .login-dropdown .dropdown-menu.logged-menu li button, .new-header .menu-bar .container .content .logged-dropdown .dropdown-menu.logged-menu li button {
    border-color: var(--main-color);
}
.history-actions .step-actions a.context.active {
    box-shadow: 0 0 0 1px var(--main-color), 0 0 0 4px #197e4636;
}
.panel-header .inner {
    background: var(--main-color);
    background: linear-gradient(var(--main-color), var(--dark-main-color));
}
.step-list-container .panel-header>.inner:before,
.panel-header .inner:before {
    border-top-color: var(--dark-main-color);
}
tr.cost td.costHypotesis input.editableValue:focus {
    border-color: var(--main-color-60);
    box-shadow: inset 0 1px 1px var(--main-color-075), 0 0 8px var(--main-color-60);
}
.right-sidebar section.contact-section textarea:focus,
.right-sidebar section.contact-section textarea:focus-visible {
    border-color: var(--main-color-60);
}
.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline-color: var(--main-color-60);
}
/* 2026-09-12 — migration fix. The platform's assets/css/default-theme.css sets
   `.homepage-pushes, .homepage-push { background: linear-gradient(#1a8dc8,#2c6490) }`.
   A gradient is a background-image, and the rules above override only background-color,
   so the blue gradient painted over South Sudan's green (--main-color #197E46).
   Clearing the image lets the country colour show; the yellow box-shadow already worked. */
.homepage-pushes,
.homepage-push,
.homepage-pushes-content .homepage-push {
    background-image: none;
}

/* 2026-09-12 — hover specificity. default-theme.css has
   `.homepage-push.push-link:hover { background: #1c88c2 }` at (0,3,0); the country rule above is
   `.homepage-push:hover` at (0,2,0), so the blue won regardless of load order. Matching the
   selector makes them equal and the instance sheet, which loads last, wins. */
.homepage-push.push-link:hover,
.homepage-pushes-content .homepage-push.push-link:hover {
    background-color: var(--support-color);
    background-image: none;
}
/* ==========================================================================
   Redesign variables. Everything above is unchanged.
   Today's site reads none of these names and has no [data-steps-design="2"]
   element, so this block changes nothing until the redesign is deployed.
   After that deploy, the rules above that these replace can be removed.
   ========================================================================== */
:root {
    /* Brand colour: every shade of the redesign's scale follows it (outline buttons #197e46; #156a3b = its --dark-main-color). */
    --primary-seed: #197e46;
    --primary-600: #156a3b;   /* hover: the instance's own darker shade */
}

/* Selected step in the brand green. The rule above that paints every marker green
   (.row-step .inner .nb) gives the new card's dark numbers 2.4:1, so the new
   card keeps its white markers and only the selected one is green. */
.step-list-container[data-steps-design="2"] {
    --steps-accent-color: #197e46;
}
.step-list-container[data-steps-design="2"] .row-step:not(.selected) .inner .nb {
    background-color: #fff;
}

/* Surface variables. Each holds the colour this instance shows today, so nothing changes
   while the rules above still apply; remove such a rule and its variable takes over with
   the same colour. Variables not listed keep the product default. */
:root {
    /* Homepage band */
    --homepage-pushes-background: var(--main-color);
    --homepage-pushes-hover-background: var(--support-color);
    --homepage-pushes-hover-text: #000000;
    /* Summary stripe */
    --panel-header-background: linear-gradient(var(--main-color), var(--dark-main-color));
    /* Header */
    --header-top-bar-accent: var(--main-color);
    --header-menu-bar-hover-text: var(--main-color);
}