/* Hamilton Township School District — OpenText SSPR mobile overrides */

body {
    min-width: 0;
    font-size: 16px;
}

#header,
.header {
    min-height: 118px;
    padding: 6px 16px 46px;
    background: linear-gradient(
        to bottom,
        var(--htsd-charcoal) 0,
        var(--htsd-charcoal) 72px,
        var(--htsd-red) 72px,
        var(--htsd-red) 76px,
        #ffffff 76px,
        #ffffff 100%
    );
}

#header-company-logo,
.header-company-logo {
    top: 9px;
    left: 14px;
    width: 52px;
    max-width: none;
    height: 52px;
    margin: 0;
    background: url("hamilton-logo.png") center center / contain no-repeat;
}

#header::before {
    top: 13px;
    right: 12px;
    left: 78px;
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
}

#header::after {
    top: 39px;
    right: 12px;
    left: 78px;
    overflow: hidden;
    font-size: 12px;
    text-overflow: ellipsis;
}

#header-center {
    top: 76px !important;
    height: 42px !important;
    padding: 0 12px !important;
}

#header-center-left,
#header-center-right,
#header-menu-wrapper,
#header-menu,
#header-username-group {
    height: 42px !important;
}

#header-page {
    max-width: 42vw;
    overflow: hidden;
    font-size: 15px !important;
    line-height: 42px !important;
    text-overflow: ellipsis;
}

#header-menu-wrapper a,
#header-menu a,
#header .header-button {
    min-width: 36px;
    min-height: 36px;
    padding: 6px 7px !important;
}

#centerbody,
#centerBody,
#content,
.centerbody,
.main-content,
.page-content {
    width: 100%;
    max-width: none;
    margin: 22px auto;
    padding: 0 14px;
    box-sizing: border-box;
}

#centerbody::before,
#centerBody::before,
#content::before {
    content: none;
    display: none;
}

#centerbody::after,
#centerBody::after,
#content::after {
    content: none;
    display: none;
}

#centerbody > form::before,
#centerBody > form::before,
#content > form::before {
    margin-bottom: 8px;
    padding-bottom: 0;
    font-size: 23px;
}

#centerbody label:first-of-type::before,
#centerBody label:first-of-type::before,
#content label:first-of-type::before {
    margin-bottom: 16px;
    padding: 10px 11px;
    font-size: 14px;
}

#centerbody > form,
#centerBody > form,
#content > form,
.form-panel,
.login-panel,
.login-wrapper,
.pwm-form,
.pwm-panel {
    width: 100%;
    padding: 24px 20px;
    border-radius: 10px;
}

h1,
.page-title,
.panel-title {
    font-size: 23px;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
select,
textarea,
.form-control {
    min-height: 48px;
    font-size: 16px;
}

button,
input[type="button"],
input[type="submit"],
.button,
.btn,
.btn-primary {
    min-height: 48px;
    max-width: 100%;
    padding-right: 18px;
    padding-left: 18px;
}

@media (max-width: 420px) {
    #header-company-logo,
    .header-company-logo {
        width: 48px;
        height: 48px;
    }

    #centerbody > form,
    #centerBody > form,
    #content > form,
    .form-panel,
    .login-panel,
    .login-wrapper,
    .pwm-form,
    .pwm-panel {
        padding: 22px 16px;
    }

    button,
    input[type="submit"],
    .btn-primary {
        width: 100%;
    }
}
