/* HyperHosting frontend overrides.
 * Loaded after the stock SupportPal stylesheet by the GreekWidthFixer plugin.
 * Uses stable SupportPal component classes so the stock template can remain active.
 */

header {
    background-color: #004588 !important;
    clear: both;
    position: relative;
    padding: 5px 0;
}

header a,
header a:link,
header a:active,
header a:visited,
.sp-search-button,
.sp-dropdown-container > a {
    color: rgba(255, 255, 255, 0.75) !important;
}

header a:hover,
.sp-search-button:hover,
.sp-dropdown-container > a:hover {
    color: #fff !important;
}

/* Do not make links inside the white account dropdown white. */
header .sp-dropdown a,
header .sp-dropdown a:link,
header .sp-dropdown a:active,
header .sp-dropdown a:visited {
    color: var(--sp-text-color-primary, var(--color-text-primary, #1f2937)) !important;
}

header .sp-dropdown a:hover {
    color: var(--sp-text-color-secondary, var(--color-text-secondary, #4b5563)) !important;
}

.sp-search-container {
    background-color: var(--sp-color-primary-800, var(--color-primary-800, #003b75));
    color: #fff;
}

.sp-search {
    background-color: #004588 !important;
}

table.sp-table-grid thead th {
    font-size: 16px;
    font-weight: 600 !important;
    text-align: center;
}

table.sp-table-grid thead th:first-child {
    text-align: left;
}

table.sp-table-grid thead th:nth-child(odd) {
    border-bottom: 4px solid #a2d27a;
}

table.sp-table-grid thead th:nth-child(even) {
    border-bottom: 4px solid #7bc144;
}

table.sp-table-grid > tbody > tr:nth-child(2n) > td {
    background-color: #f8fcfd;
}

table.sp-table-grid tbody td:nth-child(3),
table.sp-table-grid tbody td:nth-child(4),
table.sp-table-grid tbody td:nth-child(5) {
    text-align: center;
}

table.sp-table-grid .sp-description {
    color: #111;
    font-size: 16px;
}

table.sp-table-grid .sp-w-full a,
table.sp-table-grid .sp\:w-full a {
    color: #111;
    font-weight: 400;
}

table.sp-table-grid .sp-w-full a strong,
table.sp-table-grid .sp\:w-full a strong {
    font-weight: 600;
}

/* Keep ticket information on the left and the conversation on the right. */
.sp-sidebar {
    order: 1 !important;
    margin-left: 0;
    margin-right: 1rem;
}

.sp-content {
    order: 2 !important;
}

.sp-alert.sp-alert-warning.sp-alert-hyperhosting {
    margin-bottom: 0;
    border-radius: 0;
}

@media (max-width: 1023px) {
    .sp-sidebar {
        margin-right: 0;
    }
}