﻿/** Begin light mode style **/
.light-mode-enabled :is(
    .parcel-scroll table.grid td,
    .delivery-days-list span,
    .parcel-icon-container .icon sup .parcel-counter
) {
    color: #1A1A1A;
}

.light-mode-enabled .leaflet-control-attribution a {
    color: #005EA2;
}

.light-mode-enabled :is(
    #parcels-google-map,
    div.parcel-manifest,
    fieldset.renewal-block,
    div.rate-table,
    div.infox-renewal-filter,
    div.infox-renewal,
    fieldset.contact-information, 
    fieldset.infox-renewal-details,
    fieldset.infox-renewal-details div.left,
    div.approvals-pending-grid,
    div.missedstops-reportstable,
    div.missedstops-report,
    div.parcel-report-user,
    div.participant-report, 
    div.parcel-report, 
    div.route-report, 
    div.suspension-report,
    div.closing-report,
    div.payment-report,
    div.standards-report,
    div.supplies-report div.request-view, 
    div.supplies-report div.item-view,
    div.vendor-report,
    div.apikey-grid,
    div.pending-requests,
    div.holiday-list    
) {
    border-color: #D0D4DA;
}

.light-mode-enabled .manifest-link a {
    background: #005EA2;
    color: white;
}

.light-mode-enabled .manifest-link a:hover {
     background: #004B85;
}

.light-mode-enabled :is(
    div.parcel-list div.parcel-scroll table.grid tr.alt-row td,
    div.days-closed table.grid tr.alt-row td 
) {
    background-color: #F6F8FC;
}

.light-mode-enabled div.parcel-list div.parcel-scroll table.grid tr:first-child {
    border-bottom: solid 1px #B2B9C7;
}

.light-mode-enabled div.days-closed table.grid tr:first-child {
    border-bottom: solid 1px #95A4C8;
}

.light-mode-enabled div.parcels div.parcel-current {
    background-color: #C2188B;
}

.light-mode-enabled :is(
    div.parcel-list div.parcel-scroll table.grid tr.editing,
    div.supplies-layout div.pending-requests table tr.editing
) {
    border-color: #C2188B;
}

.light-mode-enabled div.parcels div.parcel-current label {
    color: white;
}

/** End light mode style **/

/** Begin dark mode style **/
.dark-mode-enabled :is(
    .parcel-scroll table.grid td,
    .delivery-days-list span,
    .parcel-icon-container .icon sup .parcel-counter,
    .leaflet-control-attribution span
) {
    color: #F2F2F2;
}

.dark-mode-enabled :is(
    div.parcel-list div.parcel-scroll table.grid tr.alt-row td,
    div.days-closed table.grid tr.alt-row td 
) {
    background-color: #30343C;
}

.dark-mode-enabled div.parcel-list div.parcel-scroll table.grid tr:first-child {
    border-bottom: solid 1px #3A3F48;
}

.dark-mode-enabled div.days-closed table.grid tr:first-child {
    border-bottom: solid 1px #3A3F48;
}

.dark-mode-enabled :is(
    #parcels-google-map,
    div.parcel-manifest,
    fieldset.renewal-block,
    div.rate-table,
    div.infox-renewal-filter,
    div.infox-renewal,
    fieldset.contact-information, 
    fieldset.infox-renewal-details,
    fieldset.infox-renewal-details div.left,
    div.approvals-pending-grid,
    div.missedstops-reportstable,
    div.missedstops-report,
    div.parcel-report-user,
    div.participant-report, 
    div.parcel-report, 
    div.route-report, 
    div.suspension-report,
    div.closing-report,
    div.payment-report,
    div.standards-report,
    div.supplies-report div.request-view, 
    div.supplies-report div.item-view,
    div.vendor-report,
    div.days-closed-scroll,
    div.apikey-grid,
    div.pending-requests,
    div.holiday-list
) {
    border-color: #3A3F48;
}

.dark-mode-enabled .manifest-link a {
    background: #6CA6FF;
    color: #1C1E22;
}

.dark-mode-enabled .manifest-link a:hover {
    background-color: #8FB3FF;
}

.dark-mode-enabled .leaflet-container .leaflet-control-attribution {
    background: rgba(0, 0, 0, 0.8);
}

.dark-mode-enabled div.parcels div.parcel-current {
    background-color: #FF4FA3;
}

.dark-mode-enabled :is(
    div.parcel-list div.parcel-scroll table.grid tr.editing,
    div.supplies-layout div.pending-requests table tr.editing
) {
    border-color: #FF4FA3;
}

.dark-mode-enabled div.parcels div.parcel-current label {
    color: white;
}

/** End dark mode style **/

/** Being big cursor **/
.big-cursor-enabled :is( 
    .leaflet-interactive,
    .leaflet-container a:not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out)
) {
    cursor: var(--cursor-pointer);
}

.big-cursor-enabled .leaflet-grab {
    cursor: var(--cursor-grab);
}

.big-cursor-enabled :is(
    .leaflet-dragging .leaflet-grab,
    .leaflet-dragging .leaflet-grab .leaflet-interactive,
    .leaflet-dragging .leaflet-marker-draggable
) {
    cursor: var(--cursor-grabbing);
}
/** End big cursor **/

/** Begin font resize adjustment **/
.font-scale-enabled :is(
    div.parcels textarea.notes,
    div.parcel-list div.parcel-scroll table.grid tr td:nth-child(3)
) {
    font-size: calc(14px * var(--font-scale));
}

.font-scale-enabled.stack :is(
    div.parcels input[type=button].submission, 
    div.parcels input[type=submit].submission
){
    font-size: calc(14px * var(--font-scale));
}

.font-scale-enabled :is(
    ul.parcel-selector-menu input,
    input.total-parcels,
    div.check-parcel-form fieldset input 
) {
    font-size: calc(13px * var(--font-scale));
}

.font-scale-enabled :is(
    div.parcels input.institution,
    div.parcel-list div.parcel-scroll table.grid tr.header-row th,
    div.supplies-filters fieldset label,
    div.payment-numbers p
) {
    font-size: calc(12px * var(--font-scale));
}

.font-scale-enabled :is(
    div.parcel-list div.parcel-scroll table.grid tr td:nth-child(2),
    div.renewal-form div.same-as-shipping
) {
    font-size: calc(11px * var(--font-scale));
}

.font-scale-enabled select.institution-selector {
    width: clamp( 350px, calc(350px + (var(--font-scale) - 1) * 237px), 587px );
}

.font-scale-enabled ul.parcel-selector-menu select.parcel-type {
    width: clamp( 48px, calc(48px + (var(--font-scale) - 1) * 47px), 95px );
    height: auto;
    min-height: 31px;
}

.font-scale-enabled ul.parcel-selector-menu select.library-type {
    width: clamp( 89px, calc(89px + (var(--font-scale) - 1) * 78px), 167px );
    height: auto;
    min-height: 31px;
}

/*.font-scale-enabled.font-adjust-enabled ul.parcel-selector-menu select {
    width: 100%;
    height: auto;
}*/

.font-scale-enabled.stack ul.parcel-selector-menu {
    grid-template-columns: repeat(2, max-content);
}

.font-scale-enabled ul.parcel-selector-menu:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) {
    grid-template-columns: 1fr; 
}

.font-scale-enabled ul.parcel-selector-menu:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) > li {
    padding-left: 0;
}

.font-scale-enabled.stack ul.parcel-selector-menu li:nth-child(3) {
    padding-left: 0;
}

.font-scale-enabled :is( 
    span.manifest-link, 
    span.manifest-link a 
) {
    max-width: clamp(180px, calc(180px + (var(--font-scale) - 1) * 135px), 315px);
    width: 100%;
    padding: 3px;
}

.font-scale-enabled div.parcels div.submission-buttons {
    width: 100%;
}

.font-scale-enabled div.parcels div.submission-buttons input.submission {
    max-width: 299px;
    width: 100%;
}

.font-scale-enabled div.parcels div.submission-buttons input.submission {
    margin-top: 13px;
    margin-left: 0;
}

.font-scale-enabled div.parcels div.submission-buttons input.submission:nth-child(1) {
    margin-left: 0;
    text-wrap: auto;
}

.font-scale-enabled div.parcel-list-container {
    width: clamp( 318px, calc(28vw + (var(--font-scale) - 1) * 40px), 404px );
    /*min-width: clamp(318px, calc(28vw + (var(--font-scale) - 1) * 40px), 404px);
    width: 100%;
    max-width: 404px;*/
}

.font-scale-enabled div.main-parcel-container > div.left {
    min-width: 0;
}

.font-scale-enabled div.parcel-list {
    width: 100%;
    max-width: none;
    margin: 10px 0;
    box-sizing: border-box;
    overflow-y: visible;
}

.font-scale-enabled div.parcel-list div.move-parcels {
    width: clamp( 220px, calc(220px + (var(--font-scale) - 1) * 158px), 378px );
}

.font-scale-enabled div.parcel-list div.move-parcels input:first-child {
    margin-top: 0;
}

.font-scale-enabled div.parcel-list div.parcel-scroll {
    overflow-x: auto;
    
}

.font-scale-enabled div.parcel-list div.parcel-scroll table tr.header-row th:nth-child(3){
    min-width: 200px;
}

.font-scale-enabled.font-adjust-enabled.letter-spacing-enabled
div.parcel-list div.parcel-scroll table tr.header-row th:nth-child(3) {
    min-width: clamp( 200px, calc(200px + (var(--letter-spacing-scale) / 0.12em) * 200px), 400px );
}

.font-scale-enabled div.manifest-date-select input.total-parcels {
    width: clamp(20px, calc(20px + (var(--font-scale) - 1) * 22px), 42px);
}

.font-scale-enabled div.renewal-form span a {
    overflow-wrap: anywhere;
}

.font-scale-enabled :is(
    fieldset.renewal-block,
    div.renewal-form 
){
    min-width: 0;
}

:is(
    .font-scale-enabled, 
    .letter-spacing-enabled, 
    .word-spacing-enabled,
    .line-height-enabled,
    .font-adjust-enabled
) div.infox-renewal-filter {
    flex: 0 1 clamp(175px, 26ch, 284px);
    width: clamp(175px, 26ch, 284px);
    min-width: 225px;
    max-width: 284px;
    height: fit-content;
    max-height: none;
}

:is(
    .font-scale-enabled, 
    .letter-spacing-enabled, 
    .font-adjust-enabled
) table tr td span.approvals-pending {
    float: none;
}

.font-scale-enabled div.holiday-selections {
    width: clamp( 200px, calc(200px + (var(--font-scale) - 1) * 75px), 275px );
}

.font-scale-enabled :is(
    div.holiday-selections div.add-holiday,
    div.holiday-selections div.add-holiday fieldset input:first-of-type
) {
    width: clamp( 175px, calc(175px + (var(--font-scale) - 1) * 75px), 250px );
}

.font-scale-enabled div.supplies-layout {
    max-width: clamp( 525px, calc(525px + (var(--font-scale) - 1) * 275px), 800px );
}

.font-scale-enabled div.pending-requests {
    max-width: clamp( 500px, calc(500px + (var(--font-scale) - 1) * 225px), 725px );
}

.font-scale-enabled div.wikiformatting {
    max-width: clamp( 75vw, calc(75vw + (var(--font-scale) - 1) * 15vw), 90vw );
}

.font-scale-enabled div.vendor-report {
    max-width: clamp( 230px, calc(230px + (var(--font-scale) - 1) * 195px), 425px );
}

.font-scale-enabled :is(
    div.renewal-form span#descResource,
    div.renewal-form div.same-as-shipping  span.description,
    div.subsidy-checkboxes span:not(.aspNetDisabled)
 ) {
    display: inline-grid;
    margin-left: 6px;
    max-width: calc(100% - 30px);
}

:is(
    .font-scale-enabled,
    .letter-spacing-enabled,
    .word-spacing-enabled,
    .line-height-enabled,
    .font-adjust-enabled
) div.membership-checkboxes {

    width: min(100%, clamp(100px, 16ch, 260px));
}

.font-scale-enabled table.route-info {
    margin: 0 0 10px 0;
    display: block;
}

.font-scale-enabled table.route-info tr td label {
    width: 122px;
}

.font-scale-enabled input.base-route {
    width: clamp( 70px, calc(70px + (var(--font-scale) - 1) * 45px), 115px );
}

.font-scale-enabled input.route-code {
    width: clamp( 110px, calc(110px + (var(--font-scale) - 1) * 50px), 160px );
}

.font-scale-enabled fieldset.infox-renewal-details div.section:nth-child(3) fieldset.inline {
    margin-right: 6px;
}

.font-scale-enabled input.renewal-evergreen-shortname {
    max-width: clamp( 210px, calc(210px + (var(--font-scale) - 1) * 103px), 313px );
    width: 100%;
}

.font-scale-enabled div.leaflet-top a:last-child {
    display: block;
    cursor: pointer;
}

.font-scale-enabled div.member-map {
    max-width: 550px;
}

.font-scale-enabled div.member-map-legend {
    display: none;
    position: absolute;
    max-width: min( 100%, clamp( 300px, calc(300px + (var(--font-scale) - 1) * 250px), 550px ) );
    width: auto;
    top: 125px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 1001;
    max-height: 72vh;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.font-scale-enabled div.leaflet-top a:nth-child(-n+2) {
    position: relative;
    z-index: 999;
}

.font-scale-enabled div.leaflet-top a:last-child {
    position: relative;
    z-index: 1000;
}

.font-scale-enabled div.leaflet-bottom {
    z-index: 999;
}

.font-scale-enabled div.apikey-form input.apikey-length {
    width: 30px;
}

:is(
    .font-scale-enabled,
    .font-adjust-enabled,
    .letter-spacing-enabled,
    .word-spacing-enabled
) div.parcel-toggle-hidden-container textarea.hide-library-reason {
    width: 100%;
    max-width: none;
}

.font-scale-enabled div.parcel-report-buttons p {
    float: none;
    margin: 24px 0;
}

.font-scale-enabled div.renewal-form textarea.notes {
    width: 100%;
}

.font-scale-enabled :is(
    input.email, 
    input.first, 
    input.last, 
    input.title, 
    input.address,
    input.password
) {
    width: 100%;
}

.font-scale-enabled div.apikey-container fieldset.block select {
    width: clamp(155px, calc(155px + (var(--font-scale) - 1) * 105px), 260px);
}

.font-scale-enabled div.renewal-library-type select {
    width: clamp(105px, calc(105px + (var(--font-scale) - 1) * 80px), 185px);
}

:is(
    .font-scale-enabled,
    .font-adjust-enabled:is(
        [data-font="Verdana"],
        [data-font="Century Gothic"]
    ),
    .letter-spacing-enabled
) div.days-closed fieldset input[type=submit] {
    margin-top: 10px;
}

.font-scale-enabled div.days-closed-edit {
    min-width: clamp(235px, calc(235px + (var(--font-scale) - 1) * 30px), 265px);
    width: 100%;
    max-width: 330px;
}

.font-scale-enabled div.days-closed-range {
    max-width: clamp(355px, calc(355px + (var(--font-scale) - 1) * 20px), 375px);
}

.font-scale-enabled :is(
    div.renewal-dates div, 
    div.renewal-rates,
    div.renewal-discounts
) {
    width: clamp(165px, calc(165px + (var(--font-scale) - 1) * 125px), 290px);
}

.font-scale-enabled :is(
    div.renewal-dates input.renewal-year, 
    div.renewal-rates input, 
    div.renewal-discounts input
) {
    width: clamp(50px, calc(50px + (var(--font-scale) - 1) * 40px), 90px);

}

/** End font resize adjustment **/

/** Begin letter spacing adjustment **/
.letter-spacing-enabled .manifest-link a {
    letter-spacing: var(--letter-spacing-scale);
}
/** End letter spacing adjustment **/

/** Begin line height adjustment **/
.line-height-enabled .manifest-link a {
    line-height: calc(1.18 * var(--line-height-scale, 1));
}

/** End line height adjustment **/

/** Being word spacing adjustment **/
.word-spacing-enabled .manifest-link a {
    word-spacing: var(--word-spacing-scale);
}

.word-spacing-enabled :is(
    div.missedstops-reportstable table.grid th.missedstops-pickedup, 
    div.missedstops-reportstable table.grid th.missedstops-delivered 
) {
    min-width: 100px;
}

.word-spacing-enabled :is(
    div.standards-report table tr th.renewal, 
    div.standards-report table tr th.delivery 
) {
    min-width: 55px;
}

/** End word spacing adjustment **/

/** Begin color select **/
html.link-color-enabled .leaflet-container a:not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out) {
  color: var(--link-color) !important;
}

html.text-color-enabled :is( 
    .parcel-scroll table.grid td,
    .delivery-days-list span,
    .parcel-icon-container .icon sup .parcel-counter,
) {
  color: var(--text-color) !important;
}

/** End color select **/

/*****************Breakpoints Start*******************/

@media (min-width: 863px) and (max-width: 991px) {

    .font-scale-enabled.stack.font-adjust-enabled.letter-spacing-enabled ul.parcel-selector-menu {
        grid-template-columns: 1fr;
    }

    .font-scale-enabled.stack.font-adjust-enabled.letter-spacing-enabled ul.parcel-selector-menu li {
        padding-left: 0;
    }

}

@media (min-width: 863px) {

    .font-scale-enabled.font-adjust-enabled div.parcel-list-container {
        width: clamp(318px, calc(28vw + (var(--font-scale) - 1) * 40px), 404px);
        max-width: none;
    }

    :is(
        .font-scale-enabled,
        .letter-spacing-enabled, 
        .word-spacing-enabled, 
        .font-adjust-enabled
    ) div.parcel-list div.move-parcels {
        width: clamp(237px, calc(237px + (var(--font-scale) - 1) * 9px), 246px);
        text-align: center;
    }

    :is(
        .font-scale-enabled,
        .letter-spacing-enabled, 
        .word-spacing-enabled, 
        .font-adjust-enabled
    ) div.parcel-list div.move-parcels input[type=submit] {
        width: 100%;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 863px) {
    .font-scale-enabled div.renewal-library-type {
        height: clamp( 100px, calc(100px + (var(--font-scale) - 1) * 50px), 150px );
    }

    .font-scale-enabled table.route-info tr td, .font-scale-enabled table.checkbox tr td {
        display: block;
    }

    .font-scale-enabled table.checkbox tr:nth-child(2) td:nth-child(2) fieldset {
        clear: both;
    }

    .font-scale-enabled ul.parcel-selector-menu:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) {
        grid-template-columns: repeat(3, max-content);
    }

    .font-scale-enabled ul.parcel-selector-menu:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) > li:not(:first-child) {
        padding-left: 25px;
    }

    .font-scale-enabled div.main-parcel-container {
        flex-flow: row;
    }

    .font-scale-enabled div.parcel-list-container {
        position: fixed;
        left: 10px;
        right: 10px;
        width: auto;
        max-width: none;
        box-sizing: border-box;
        z-index: 1000;
    }

    .font-scale-enabled div.main-parcel-container div.right {
        max-width: clamp( 318px, calc(318px + (var(--font-scale) - 1) * 91px), 409px );
        width: 100%;
    }

    .font-scale-enabled div.parcel-icon-container {
        display: flex;
        gap: 8px;
        margin-top: 16px;
    }

    .font-scale-enabled div.parcel-icon-container h1 {
        margin: 0;
    }

    .font-scale-enabled div.parcel-icon-container span.icon {
        position: relative;
    }

    .font-scale-enabled div.parcel-icon-container span.icon sup input.parcel-counter {
        width: auto;
    }

    .font-scale-enabled :is( 
        div.parcel-icon-container i.fa-box, 
        div.parcel-icon-container i.fa-box-open 
    ) {
        font-size: clamp( 24px, calc(24px + (var(--font-scale) - 1) * 6px), 30px );
        width: auto;
        height: auto;
    }

    .font-scale-enabled div.parcel-icon-container span.icon sup {
        top: -19px;
        right: 15px;
    }

    .font-scale-enabled:is(
        .letter-spacing-enabled, 
        .word-spacing-enabled, 
        .font-adjust-enabled
    ) div.parcel-list div.move-parcels {
        width: clamp(424px, calc(424px + (var(--font-scale) - 1) * 47px), 471px);
    }


    .font-scale-enabled div.days-closed-container {
        flex-wrap: wrap;
    }
}

@media only screen and (max-width: 682px) {
    .font-scale-enabled div.parcel-info-form dl {
        grid-template-columns: 1fr;
        row-gap: 0.25em;
        align-items: start;
    }

    .font-scale-enabled div.parcel-info-form dl dd {
        padding-bottom: .5em;
    }

    .font-scale-enabled div.parcel-info-form h2.now-title {
        margin: 20px 0;
    }

    .font-scale-enabled div.check-parcel-form input[type=text] {
        width: 100%;
    }

    .font-scale-enabled div.supplies-layout div.submission-buttons {
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .font-scale-enabled ul.parcel-selector-menu:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) {
        grid-template-columns: 1fr; 
    }

    .font-scale-enabled ul.parcel-selector-menu:has(> li:nth-child(3)):not(:has(> li:nth-child(4))) > li:not(:first-child) {
        padding-left: 0;
    }

    .font-scale-enabled div.member-map-legend {
        left: 10px;
        right: 10px;
    }

}

@media only screen and (max-width: 600px) {

    .font-scale-enabled :is(
        div.infox-contact-information-container div.left, 
        div.infox-contact-information-container div.right
    ) {
        max-width: 400px;
    }

    .font-scale-enabled:is( 
        .letter-spacing-enabled, 
        .word-spacing-enabled, 
        .font-adjust-enabled 
    ) div.parcel-list div.move-parcels {
        width: clamp(237px, calc(237px + (var(--font-scale) - 1) * 9px), 246px);
    }

    .font-scale-enabled:is( 
        .letter-spacing-enabled, 
        .word-spacing-enabled, 
        .font-adjust-enabled 
    ) div.parcel-list div.move-parcels input[type=submit] {
        width: 100%;
        margin-bottom: 10px;
    }

    .font-scale-enabled :is(
        div.renewal-dates div,
        div.renewal-rates,
        div.renewal-discounts
    ).renewal-discounts {
        width: 244px;
    }

    .font-scale-enabled div.rate-form div.submission-buttons {
        display: grid;
    }

    .font-scale-enabled div.rate-form div.submission-buttons input {
        width: 255px;
    }

}

@media only screen and (max-width: 400px) {

    .font-scale-enabled.stack ul.parcel-selector-menu {
        grid-template-columns: 1fr;
    }

    .font-scale-enabled ul.parcel-selector-menu li {
        padding-left: 0;
    }

    .font-scale-enabled div.parcel-list div.move-parcels {
        width: 185px;
        margin: 0 auto;
        text-align: center;
    }

    .font-scale-enabled div.parcel-list div.move-parcels input {
        margin-bottom: 5px;
    }

}