.card:hover {cursor: pointer;border-color: var(--primary);}
.card:hover .img-hold > img {transform: scale(1.5);transition: 1200ms ease-in-out;}

.nav-links a.active {color: var(--primary);border-color: var(--primary);}
.nav-links a:hover {background: #fff3ef;text-decoration: none;border-color: var(--primary);}

.hero-section .adBanner:hover {background-size: 140%;transition: all 3s ease-in-out;-webkit-transition: all 3s ease-in-out;background-position: center;}

.color:hover .mask::after {content: "";position: absolute;top: -4px;left: -4px;width: 28px;height: 28px;border: 2px solid var(--darkGray);border-radius: 6px;box-sizing: border-box;}

input[type="radio"]:checked + .mask::after {content: "";position: absolute;top: -3.5px;left: -3.5px;width: 28px;height: 28px;border: 2px solid #194ab4;border-radius: 6px;box-sizing: border-box;}

.btn-primary:hover, .btn-secondary:hover {box-shadow: 0 0 0 3px rgba(242, 96, 0, 0.12);filter: brightness(0.95);}

.filter-toggle:hover {background: var(--secoundry);box-shadow: 0 0 0 3px rgba(242, 96, 0, 0.12);}
.filter-option.active,.filter-option:hover{background: var(--secoundry);font-weight:700}

.dynamic-card .color.selected .mask,
.dynamic-card .color.Selected .mask {0 0 0 1px var(--white), 0 0 0 3px var(--primary)}
.dynamic-card .size.disabled .size-choice,
.dynamic-card .size-choice:disabled {opacity: 0.35;cursor: not-allowed;}

.dynamic-card .size.Selected .size-choice,.dynamic-card .size.selected .size-choice {color: var(--primary);border: 2px solid var(--primary);}
.account-menu-link.active, .account-menu-link:hover {background: var(--secoundry)}


/*Navigation*/
.nav-icons li:not(.user-profile, .search-menu):hover { background: var(--secoundry); border-radius: 4px; }
.nav-icons li.logout:hover {background: var(--red);}
.user-dropdown .login:hover a {background: var(--primary);color: var(--white)}
.nav-icons li.logout:hover a {color: var(--white)}
.collection-dropdown a:hover{background:var(--secoundry);border: none;}
.user-profile:hover .user-dropdown {display: flex;}



.field-text input:focus,
.field-select select:focus,
.field-textarea textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(242, 96, 0, 0.12);
}

.input-text:focus-visible, .input-text:focus {border: none !important;box-shadow: none;outline: none;}