.hpd-view-all-controls {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
flex-wrap: wrap;
margin: 28px 0 12px;
}
.hpd-view-all-button {
appearance: none;
border: 2px solid #0e2a47;
border-radius: 3px;
background: #0e2a47;
color: #ffffff;
min-height: 42px;
padding: 9px 18px;
font-size: 15px;
line-height: 1.2;
font-weight: 700;
cursor: pointer;
transition:
background-color 0.2s ease,
border-color 0.2s ease,
color 0.2s ease,
opacity 0.2s ease;
}
.hpd-view-all-button:hover,
.hpd-view-all-button:focus {
background: #ff8a00;
border-color: #ff8a00;
color: #ffffff;
}
.hpd-view-all-button:focus-visible {
outline: 3px solid rgba(14, 42, 71, 0.25);
outline-offset: 3px;
}
.hpd-view-all-button:disabled,
.hpd-view-all-button.is-loading {
cursor: wait;
opacity: 0.72;
}
.hpd-view-all-status {
color: #0e2a47;
font-size: 14px;
line-height: 1.35;
}
@media (max-width: 767px) {
.hpd-view-all-controls {
margin-top: 22px;
}
.hpd-view-all-button {
width: 100%;
max-width: 280px;
}
.hpd-view-all-status {
width: 100%;
text-align: center;
}
}