/*

	YachtCast Intelligence
	Client Branding

-------------------------------------------------*/

/* fonts
-------------------------------------------
font-family:'Inter', Arial, Helvetica, sans-serif; font-weight:400; - google font

300 light
400 regular
500 medium
600 semi bold
700 bold
800 extra bold

*/

:root {
    --font-family: "Inter", Arial, Helvetica, sans-serif;

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semiBold: 600;
    --font-weight-bold: 700;
    --font-weight-extra-bold: 800;

    --brand-colour: #0066ff;
    --brand-color-filter: invert(47%) sepia(84%) saturate(7148%) hue-rotate(211deg) brightness(101%) contrast(107%);

    --brand-accent: #00f5b3; /* key - brand_accent_colour */
    --brand-accent-filter: invert(66%) sepia(85%) saturate(928%) hue-rotate(109deg) brightness(100%) contrast(101%);
    --brand-accent-copy-colour: #00785c; /* key button_hover_copy_colour */

    --button-hover-copy-colour: #00785c;

    --button-copy-colour: #fff; /* key - button_copy_colour*/
    --brand-button-icon-filter: invert(100%);

    --button-brand-outline-icons: var(--brand-color-filter);
    --button-accent-outline-icons: var(--brand-accent-filter);

    --button-accent-copy-colour: var(--brand-accent-copy-colour);
    --brand-accent-icons-filters: invert(23%) sepia(77%) saturate(1537%) hue-rotate(143deg) brightness(91%)
        contrast(102%);

    --button-hover-icon-colour: invert(23%) sepia(77%) saturate(1537%) hue-rotate(143deg) brightness(91%) contrast(102%);

    --header-bg-colour: #0066ff;
    --login-bg-colour: #0066ff;

    --nav-highlight-bg-colour: #e9f3ff; /* light brand tint by default */
}

/* buttons
    --------------------------------------------------*/
/* solid =====================*/
.theme .btn.solid {
    background-color: var(--brand-colour);
    color: var(--button-copy-colour);
}
.theme .btn.solid:hover {
    background-color: var(--brand-accent);
    color: var(--button-hover-copy-colour);
}
.theme .btn.solid:before,
.theme .btn.solid:after {
    filter: var(--brand-button-icon-filter);
}
.theme .btn.solid:hover:before,
.theme .btn.solid:hover:after {
    filter: var(--button-hover-icon-colour);
}

/* solid accent — copy & icon use --button-hover-copy-colour, the value the
   brand-settings page documents as the "Secondary Accent button copy/icon"
   colour. --brand-accent-btn-icons-colour is the same hex baked into a CSS
   filter string by theme-overrides.twig. */
.theme .btn.solid-accent {
    background-color: var(--brand-accent);
    color: var(--button-hover-copy-colour);
}

.theme .btn.solid-accent:hover {
    background-color: var(--brand-colour);
    color: var(--button-copy-colour);
}
.theme .btn.solid-accent:before,
.theme .btn.solid-accent:after {
    filter: var(--button-hover-icon-colour);
}

.theme .btn.solid-accent:hover:before,
.theme .btn.solid-accent:hover:after {
    filter: var(--brand-button-icon-filter);
}

/* outline ===================*/
.theme .btn.outline {
    border-color: var(--color-ui-200);
    color: var(--brand-colour);
}
.theme .btn.outline:hover {
    border-color: var(--brand-colour);
    background-color: var(--brand-colour);
    color: var(--button-copy-colour);
}
.theme .btn.outline:before,
.theme .btn.outline:after {
    filter: var(--button-brand-outline-icons);
}
.theme .btn.outline:hover:before,
.theme .btn.outline:hover:after {
    filter: var(--brand-button-icon-filter);
}

/* outline accent*/
.theme .btn.outline-accent {
    border-color: var(--color-ui-200);
    color: var(--brand-accent);
}
.theme .btn.outline-accent:hover {
    border-color: var(--brand-accent);
    background-color: var(--brand-accent);
    color: var(--button-hover-copy-colour);
}
.theme .btn.outline-accent:before,
.theme .btn.outline-accent:after {
    filter: var(--button-accent-outline-icons);
}
.theme .btn.outline-accent:hover:before,
.theme .btn.outline-accent:hover:after {
    filter: var(--button-hover-icon-colour);
}

/* colour outline ===============*/
.theme .btn.colour-outline {
    color: var(--brand-colour);
    border-color: var(--brand-colour);
}
.theme .btn.colour-outline:hover {
    border-color: var(--brand-colour);
    background-color: var(--brand-colour);
    color: var(--button-copy-colour);
}
.theme .btn.colour-outline:before,
.theme .btn.colour-outline:after {
    filter: var(--button-brand-outline-icons);
}
.theme .btn.colour-outline:hover:before,
.theme .btn.colour-outline:hover:after {
    filter: var(--brand-button-icon-filter);
}

/* outline colour accent*/
.theme .btn.colour-outline-accent {
    color: var(--brand-accent);
    border-color: var(--brand-accent);
}
.theme .btn.colour-outline-accent:hover {
    border-color: var(--brand-accent);
    background-color: var(--brand-accent);
    color: var(--button-hover-copy-colour);
}
.theme .btn.colour-outline-accent:before,
.theme .btn.colour-outline-accent:after {
    filter: var(--button-accent-outline-icons);
}
.theme .btn.colour-outline-accent:hover:before,
.theme .btn.colour-outline-accent:hover:after {
    filter: var(--button-hover-icon-colour);
}

/* outline hover =======================*/
.btn.outline-hover:hover {
    border-color: var(--nav-highlight-bg-colour);
    background-color: var(--nav-highlight-bg-colour);
    color: var(--brand-colour);
}
.btn.outline-hover:hover:before,
.btn.outline-hover:hover:after {
    filter: var(--button-brand-outline-icons);
}

/* outline hover accent
.btn.outline-hover-accent:hover {
    color: var(--brand-accent-copy-colour);
    border-color: var(--brand-accent);
    background-color: var(--brand-accent);
}
.btn.outline-hover-accent:before,
.btn.outline-hover-accent:after {
    filter: filter: var(--button-accent-outline-icons);
}*/

body.homepage,
.homepage-bg {
    background-color: var(--login-bg-colour);
}

/* login */
.theme .forgotten-container a {
    color: var(--brand-accent);
}
.theme .forgotten-container a:hover {
    color: #20e7a3;
}

.theme .sign-up-link {
    color: var(--brand-accent);
}
.theme .sign-up-link:hover {
    color: #fff;
}

.theme .loginContainer .form fieldset .loginButton.btn,
.theme .loginContainer .form fieldset.forgotten-copy a.reset-button.btn {
    color: var(--button-hover-copy-colour);
}

.theme .loginContainer .form fieldset .loginButton.btn:hover,
.theme .loginContainer .form fieldset.forgotten-copy a.reset-button.btn:hover {
    background-color: var(--brand-accent);
}

.theme .backtoLink {
    color: #fff;
    background-color: var(--brand-colour);
}
.theme .backtoLink:hover {
    background-color: var(--brand-accent);
}

.theme .loginContainer .form fieldset.forgotten-copy a.backtoLink {
    border: 1px solid var(--brand-colour);
    color: #fff;
}
.theme .loginContainer .form fieldset.forgotten-copy a.backtoLink:hover {
    border: 1px solid #fff;
    color: #fff;
}

.theme .loginContainer .form fieldset label {
    color: #fff;
}
.loginContainer .form fieldset .sign-up-link:hover {
    color: #fff;
}

/* forgotten page */
.loginContainer .form fieldset.forgotten-copy {
    color: #fff;
}

/* inactive */
.loginContainer .form fieldset.inactivity p {
    color: #fff;
}

/* header */

.theme header {
    background: var(--header-bg-colour);
}

.theme .loginContainer .form fieldset .forgotten a {
    color: #fff;
}

.colour-table tr td {
    color: #000;
    text-align: center;
    padding: 10px;
    font-size: 14px;
}

/* links */
.theme a,
button.btn {
    color: var(--brand-colour);
    text-decoration: none;
}
.theme a.color-ui-500 {
    color: var(--color-ui-500);
}

.theme a:hover,
.theme a.color-ui-950:hover {
    color: var(--brand-accent);
    text-decoration: none;
    border-color: var(--brand-accent);
}
.theme a.color-ui-950 {
    color: var(--color-ui-950);
}
.theme .displayOptions a.active {
    color: var(--brand-colour);
}
.theme .drop-footer .underline:hover {
    color: var(--brand-colour);
}

.theme .home-title.intel a,
.theme .latest-news p.heading a,
.theme .latest-videos p.heading a {
    color: #666;
}

.theme .home-title.intel a:hover,
.theme .latest-news p.heading a:hover,
.theme .latest-videos p.heading a:hover {
    color: var(--brand-colour);
}

.theme .show-more-filters button {
    color: var(--brand-colour);
}

.theme .searchResults .result .resultDetails .sold-price a {
    color: var(--brand-colour);
}
.theme .searchResults .result .resultDetails .sold-price a:hover {
    color: var(--brand-accent);
}

.theme .searchResults .result .resultDetails a.selection-image-count:hover {
    color: var(--brand-accent);
}

@media screen and (min-width: 641px) {
    /* header search */
    .search-wrap .search-go:before {
        background-color: var(--brand-accent);
    }
}

.theme .filter-applied {
    color: var(--brand-colour);
}

/* offcanvas navigation */
.theme #offCanvas .menu a:hover,
.theme #offCanvas .menu button:hover,
.theme #offCanvas .menu a.active,
.theme #offCanvas .menu button.active {
    color: var(--brand-colour);
}

.theme #offCanvas .menu a:hover:before,
.theme #offCanvas .menu button:hover:before,
.theme #offCanvas .menu a.active:before,
.theme #offCanvas .menu button.active:before {
    filter: var(--brand-color-filter);
}

/* site header */
.theme .siteOptions .app-list .app-item .text {
    color: var(--brand-colour);
}

.theme #profile-dropdown .menu a:hover:before {
    filter: var(--brand-color-filter);
}
.theme #profile-dropdown .menu a:hover {
    color: var(--brand-colour);
}
.theme .compareContainer .select-all:hover label {
    color: var(--brand-colour);
}

.theme .btn.button-shortlist.style-6.onShortlist {
    color: #fff;
    background-color: var(--brand-colour);
    border-color: var(--brand-colour);
}
.theme .btn.button-shortlist.style-6.onShortlist:before {
    filter: invert(100%);
}

/* tabs */
.tabsContainer li a.active:before {
    filter: var(--brand-color-filter);
}

/* headings
.theme h1 { color: #000;} */

/* login/forgot */
.theme .loginContainer .signin_row input[type="checkbox"]:checked + label:before {
    filter: var(--brand-color-filter);
}
.loginContainer .btn:hover {
    background-color: var(--brand-colour);
}

/* dashboard navigation */
.theme .navigation li a {
    color: var(--brand-colour);
}
.theme .navigation li a:hover,
.theme .navigationDirectory li a:hover {
    color: var(--brand-accent);
    border: 1px solid var(--brand-accent);
}

/* sub navigation */
.theme .subNavigation li .title.with-icon {
    color: var(--brand-accent);
}
.theme .subNavigation li ul li a {
    color: var(--brand-colour);
}
.theme .subNavigation li ul li a:hover {
    color: var(--brand-accent);
}

/* alphabet search */
.theme .alphabetSorting .alphabetList li a.active,
.theme .alphabetSorting .alphabetList li a:hover {
    color: var(--brand-colour);
    border: 1px solid var(--brand-colour);
}

/* search results */
.theme .searchResults .result .resultDetails a:hover {
    color: var(--brand-colour);
}
.theme .searchResults .result .resultDetails .resultActions li.compare input:checked + label,
.theme .searchResults .result .resultActions.full-width .compare input:checked + label {
    color: var(--brand-colour);
}
.theme .searchResults .result .resultDetails .resultActions li.compare input + label:hover,
.theme .searchResults .result .resultActions.full-width .compare input + label:hover {
    color: var(--brand-colour);
}
.theme .list-view tbody tr td.name a.name {
    color: var(--brand-colour);
}
.theme .shortlist-details .details-header .show-details:hover {
    border: 1px solid var(--brand-accent);
}
.theme .shortlist-details .details-header .show-details:hover:before {
    filter: var(--brand-accent-filter);
}
.theme .searchResults .result .resultDetails .report-sale a,
.theme .searchResults .result .resultDetails .priceContainer a {
    color: var(--brand-colour);
}
.theme .searchResults .result .resultDetails .report-sale a:hover {
    color: var(--brand-accent);
}
.theme .searchResults .result .imageContainer .position {
    background: var(--brand-colour);
}

/* BG colour 90% of the main colour */
.theme .filters-item select.drop-style.active-filter,
.theme .filters-item .faux-dropdown.active-filter {
    background-color: var(--color-ui-1);
}

/* filter drop downs*/
.theme .searchResults .resultsOptions .chosen-container-single .chosen-single,
.theme .yachtCompareHeader .resultsOptions.display .chosen-container-single .chosen-single {
    color: var(--brand-colour);
}
.theme .sort-option.active,
.theme .sort-option:hover {
    color: var(--brand-colour);
}
.theme .searchResults .resultsOptions .chosen-container-single .chosen-drop ul li.highlighted,
.theme .searchResults .resultsOptions .chosen-container-single .chosen-drop ul li.result-selected,
.theme .yachtCompareHeader .resultsOptions .chosen-container-single .chosen-drop ul li.highlighted,
.theme .yachtCompareHeader .resultsOptions .chosen-container-single .chosen-drop ul li.result-selected {
    background-color: var(--brand-colour);
}
.theme .styled-item-list li button.active,
.theme .styled-item-list li button:hover,
.theme #builder-overlay .builder-list button.active,
.theme #builder-overlay .builder-list button:hover,
.theme #model-list .model-list button.active,
.theme #model-list .model-list button:hover,
.theme #model-dropdown .model-list button.active,
.theme #model-dropdown .model-list button:hover,
.theme #price-dropdown .filter-price-bracket button:hover,
.theme #price-dropdown .filter-price-bracket button.active {
    color: var(--brand-colour);
}
.theme .noUi-connect {
    background: var(--brand-colour);
}
.theme .noUi-horizontal .noUi-handle {
    border-color: var(--brand-colour);
}
.theme .togglebox-init > label:hover {
    color: var(--brand-colour);
}

.theme .view-dropdown:before {
    filter: var(--brand-color-filter);
}

.theme .displayOptions a.active:before,
.theme .displayOptions a.active:hover:before,
.theme .displayOptions a:hover:before {
    filter: var(--brand-color-filter);
    opacity: 1;
}

.theme .sort-option:hover:before,
.theme .sort-option.active:before,
.theme .sort-option.active:hover:before,
.theme .sort-dropdown:before {
    filter: var(--brand-color-filter);
    opacity: 1;
}

.theme .clear-list-sidebar {
    color: #999;
} /* this is needed to override the a standard styling */
.theme .clear-list-sidebar:hover {
    color: var(--brand-colour);
}
.theme .clear-list-sidebar:hover:before {
    filter: invert(8%) sepia(97%) saturate(4350%) hue-rotate(340deg) brightness(120%) contrast(108%);
}

.theme .drop-footer .underline:hover:before {
    filter: var(--brand-accent-filter);
    opacity: 1;
}

/* compare */
.theme .yachtCompareHeader .resultsOptions.display .chosen-container-single .chosen-single {
    color: var(--brand-colour);
}
.theme #yachtCompare .yachtCompareInner .yachtCompareDetailsContainer ul.yachtDetails li.yachtName a {
    color: var(--brand-colour);
}

.compare-fixed-mode .compareContainer a.compare-clear:hover {
    filter: var(--brand-accent-filter);
}
.compare-fixed-mode .close-compare:hover {
    filter: var(--brand-accent-filter);
}

/* forms */
.radio-button input[type="radio"]:checked + label:after {
    filter: var(--brand-color-filter);
}
.checkbox-container input[type="checkbox"]:checked + label:before,
.styled-item-list li button.active:before,
#builder-overlay .builder-list button.active:before,
#source-list .option-checkbox-styled input[type="checkbox"]:checked + label::before,
#year-dropdown .option-checkbox-styled input[type="checkbox"]:checked + label::before {
    filter: var(--brand-color-filter);
}

#intelligence_login .checkbox-container input[type="checkbox"]:checked + label:before {
    filter: none;
    opacity: 0.5;
}

.switch-container input[type="checkbox"]:checked + label {
    background-color: var(--brand-colour);
}

/* pagination */
/*.theme .pagination-navigation .page-navigation-container a:hover {*/
/*    background-color: var(--brand-colour);*/
/*    border: 1px solid var(--brand-colour);*/
/*}*/

/* table sort filters */
.data-list thead tr td a.ASC:before,
.data-list thead tr td a.sort.up:before,
.data-list thead tr td a.DESC:before,
.data-list thead tr td a.sort.down:before {
    filter: var(--brand-color-filter);
}

/* settings */
.theme .radio-block .radio-item input:checked + .radio-name {
    border-color: var(--brand-colour);
    background-color: var(--brand-colour);
    color: #fff;
}

/* news */
.theme .industry-news .news-item .image-container .icon-hover {
    border: 2px solid var(--brand-colour);
}
.theme .industry-news .news-item:hover .headline,
.acent .industry-news .news-item .headline:hover {
    color: var(--brand-colour);
}
.theme .news-yachts li a {
    color: var(--brand-colour);
}

/* model & shipyard details */
.theme .tabs-container .tabs .tab-list li.active a,
.theme .tabs-container .tabs .tab-list li a.active {
    color: var(--brand-colour);
    border-bottom-color: var(--brand-colour);
}
.theme .tabs-container .tabs .tab-list li.active a:before,
.theme .tabs-container .tabs .tab-list li button.active:before,
.theme .tabs-container .tabs .tab-list li a.active:before,
.theme .tabs-container .tabs .tab-list li a:hover:before {
    opacity: 1;
    filter: var(--brand-color-filter);
}
.theme .sub-tabs-bar .sub-tab-list li.active a,
.theme .sub-tabs-bar .sub-tab-list li a.active,
.theme .sub-tabs-bar .sub-tab-list li:not(.active) a:hover,
.theme .sub-tabs-bar .sub-tab-list li a:not(.active):hover {
    color: var(--brand-colour);
}
.theme .sub-tabs-bar .sub-tab-list li.active a,
.theme .sub-tabs-bar .sub-tab-list li a.active {
    color: var(--brand-colour);
    background-color: color-mix(in srgb, var(--brand-colour) 12%, #fff);
    border: 1px solid color-mix(in srgb, var(--brand-colour) 12%, #fff);
}
.theme .tabs-container .tabs .tab-list li a.mouseover,
.theme .tabs-container .tabs .tab-list li a.touched-event,
.theme .tabs-container .tabs .tab-list li a:hover {
    color: var(--brand-colour);
}
.theme .searchResults h2 a {
    color: var(--brand-colour);
}
.theme .searchResults h2 a:hover {
    color: var(--brand-accent);
}

.theme .social-media-links a:before {
    filter: var(--brand-accent-filter);
}

/* yacht details */
.theme .particular-tabs li a.active:after {
    background: var(--brand-colour);
}
.theme .particular-tabs li a.active,
.theme .particular-tabs li a:hover {
    color: var(--brand-colour);
}

.theme .tabs-container .tabs .tab-list.model-tabs a:hover {
    color: var(--brand-acent);
}
.theme .tabs-container .tabs .tab-list.model-tabs a:hover:before {
    filter: var(--brand-accent-filter);
    opacity: 1;
}

.theme .particular-tabs li a.active:before,
.theme .particular-tabs li a:hover:before {
    filter: var(--brand-accent-filter);
    opacity: 1;
}

.theme .sub-tabs a:hover {
    border: 1px solid var(--brand-colour);
    color: var(--brand-colour);
}
.theme .sub-tabs a.active {
    border: 1px solid var(--brand-colour);
    color: #fff;
    background-color: var(--brand-colour);
}
.theme .sub-tabs a.inactive:hover {
    color: var(--brand-colour);
}

.theme .yacht-actions .style-like-select.dropdown.menu li ul li a:hover {
    background-color: var(--brand-colour);
}
.theme .yacht-actions .style-like-select.dropdown.menu li a.title {
    color: var(--brand-colour);
}

.theme .media-container .link-360-tour:hover {
    color: #fff;
}

.theme .awardsSection ul li .judges-coments .controles a {
    color: var(--brand-colour);
}

.theme .overviewSpcicfications .min-spec.model li ul li a {
    color: var(--brand-colour);
}

.theme .optionButtons .coastGuard:hover,
.optionButtons .fanInfo:hover {
    background-color: var(--brand-colour);
}

.theme .current-location-button .check {
    color: var(--brand-colour);
}
.theme .current-location-button .check:hover {
    color: var(--brand-accent);
}

.theme .yachtDetailsContainer .accordion .accordion-item .accordion-title {
    color: var(--color-ui-950);
}
.theme .particulars-table thead tr td a {
    color: #999;
}
.theme .particulars-table thead tr td a:hover {
    color: var(--brand-colour);
}
.theme .sold-price-list li a {
    color: var(--brand-colour);
}
.theme .sold-price-list li a:hover {
    color: var(--brand-accent);
}

.theme .particular-tabs li.notes a span.has-notes .count,
.theme .particular-tabs li.reports a span.has-reports .count,
.theme .particular-tabs li.notes a.active span.has-notes .count,
.theme .particular-tabs li.reports a.active span.has-reports .count {
    background: var(--brand-accent);
}

.theme .yacht-actions .style-like-select.dropdown.menu li a.title:before {
    filter: var(--brand-accent-filter);
}

.theme .card-links a {
    color: var(--color-ui-500);
}
.theme .card-links a:hover {
    color: var(--brand-colour);
}

/* choose custom pdf wizard  */
.theme .step-choose-template .section input + label:before {
    background: var(--brand-colour) !important;
}

.theme .addMorePhotosBtn {
    border: 2px solid var(--brand-colour);
}
.theme .addMorePhotosBtn:after {
    color: var(--brand-colour);
}
.theme .addMorePhotosBtn:hover:after {
    color: var(--brand-accent);
}
.theme .choose-orientation input:checked + label:after {
    background: var(--brand-colour);
}

.delete-photo:hover,
.crop-photo:hover {
    filter: var(--brand-accent-filter);
    opacity: 1;
}

/* tabs / my account tabs */
.theme .tabsContainer li a.active {
    color: var(--brand-colour);
}
.theme .tabsContainer li a.active:after {
    background: var(--brand-colour);
}

/* my account + recent sales, sold price edit */
.accountProfileOverview ul li.edit-option a::before,
.searchResults .result .resultDetails .priceContainer li.soldPrice a.edit-price::before {
    filter: var(--brand-accent-filter);
}

/* my account - navigation */
.theme .card-navigation .card-link a:hover {
    color: var(--brand-colour);
}
.theme .card-navigation .card-link a:hover span {
    filter: var(--brand-colour);
}

/* compare page */
.theme #yachtCompare .yachtCompareInner .yachtCompareDetailsContainer ul.yachtDetails li.yachtRemove a:hover {
    color: var(--brand-colour);
}

.loginContainer .form fieldset .loginButton,
.loginContainer form fieldset #js_submit,
.loginContainer .form fieldset.forgotten-copy a.reset-button {
    background: var(--brand-accent);
}
.loginContainer .form fieldset .loginButton:hover,
.loginContainer form fieldset #js_submit:hover,
.loginContainer .form fieldset.forgotten-copy a.reset-button:hover {
    background: #fff;
    color: var(--brand-colour);
}

/* modal presets
-------------------------------------------*/
.mo-tabs li button.active {
    border-bottom: 2px solid var(--brand-colour);
}
.radio-block .radio-item input:checked + .radio-name {
    border-color: var(--brand-colour);
}

/* top 100
-------------------------------------------*/

.theme .data-list.top-100 tr td.photo .position-number {
    background-color: var(--brand-colour);
}

/* selection - anyalitics
----------------------------------------------------------------------------------------------------------*/
.theme .activity-overview-wrap .quantity-wrap {
    background-color: var(--brand-colour);
}

.profile-btn {
    border: 1px solid var(--brand-colour);
}

.theme .scroll-to-top:hover {
    background-color: var(--brand-colour);
    color: #fff;
    background-position: 23px 7px;
}