@media (max-width: 360px) {
    .header-button-middle {
        display: none;
    }
    .header-logo-text {
        display: none;
    }
    .header-logo-text-short {
        display: inline;
        font-size: 15px;
    }
    .content-result-date {
        font-size: 11px !important;
    }
    .content-result-score {
        font-size: 16px !important;
    }
    .content-result-total {
        font-size: 9px !important;
    }
    .content-result-icon {
        width: 11px !important;
        height: 11px !important;
        margin: 0 5px !important;
    }
    .content-result-sun {
        font-size: 10px !important;
    }
    .content-result-icon-sun {
        width: 15px !important;
        height: 15px !important;
        margin-right: 5px !important;
        display: inline-block !important;
        vertical-align: middle !important;
    }
}

@media (max-width: 500px) {
    .calendar-row {
        font-size: 10px !important;
    }
    .calendar-row-item > img {
        width: 10px !important;
        height: 10px !important;
    }
    .calendar-row-hora > img {
        width: 13px !important;
        height: 13px !important;
    }
    .calendar-row-tithi > img {
        width: 13px !important;
        height: 13px !important;
    }
    .calendar-row-date {
        display: block !important;
        height: 18px;
    }
    .calendar-row-date:empty {
        display: none !important;
    }
    .calendar-row-time {
        margin-left: 15px;
    }
}

@media (min-width: 0px) and (max-width: 720px) {
    .modal-geo-container {
        display: none;
    }
    .modal-geo {
        top: 10%;
        width: 100%;
        text-align: left;
        z-index: 600;
        box-shadow: 0 0 50px rgba(0, 0, 0, 1);
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
}

@media (min-width: 0px) and (max-width: 700px) {
    .date-selector {
        width: 85px;
    }
    .time-selector {
        width: 55px;
    }
    input, button, select, .button-common-text, .header-switch-text, .header-button-text, .modal-timezone-text {
        font-size: 12px !important;
    }
    label.modal-input {
        font-size: 10px !important;
    }
    label.modal-checkbox {
        font-size: 12px !important;
    }
    .header-logo {
        margin-right: 7px;
    }
    .header-logo-text {
        font-size: 17px;
    }
    .header-logo-text-beta {
        font-size: 10px;
    }
    .header-logo-img {
        width: 17px;
        height: 17px;
    }
    .button-menu-text {
        display: none;
    }
    .button-menu-icon {
        padding-right: 0px !important;
    }
    .header-date {
        padding-right: 0;
    }
    .header-geo + button.header-button-common {
        display: block;
        width: 100%;
    }
    .header-geo .header-button-common {
        display: block;
        width: 100%;
        max-width: none;
        padding-right: none;
    }
    .header-endeavor .header-select {
        display: block;
        width: 100%;
        max-width: none;
    }
    .header-endeavor {
        display: block;
        width: 100%;
        max-width: none;
    }
    .switch {
        margin-right: 90px !important;
    }
    .header-mode {
        margin-right: 5px;
    }
    .header-time {
        margin-right: 0px;
    }
    .header-date-time, .header-geo, .header-endeavor {
        margin-top: 5px;
    }
    .header-geo {
        display: flex;
        justify-content: space-between;
        width: 100%;
        vertical-align: middle;
        align-items: center;
    }
    button.header-button-common-left {
        flex-grow: 1;
        display: flex;
        align-items: center;
        max-width: none !important;
        margin-right: 5px;
    }
    button.header-button-common-right {
        display: flex;
        align-items: center;
        justify-content: center;
        width: auto;
        margin-right: 0px !important;
        padding-left: 5px;
    }
    .button-common-icon {
        margin-right: 3px;
    }
    .header-geo-date-time-endeavor {
        display: inline-block;
    }
    .header-date-time, .header-date, .header-time {
        display: inline-block;
        white-space: nowrap;
    }
    .header-container {
        margin: 5px 10px 10px 10px;
    }
    .content-container {
        flex-direction: column;
        width: 100%;
        /* height: calc(100vh - 50px); Учитываем высоту нижней панели */
        margin: 0;
    }
    .content-container-left, .content-list {
        width: 100%;
    }
    .content-container-left {
        height: auto;
    }
    .content-list {
        flex-grow: 1; /* Занимает все оставшееся пространство по высоте */
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
        padding-bottom: 50px;
        min-height: 700px;
    }
    .content-result {
        width: 100%;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
        padding: 10px 15px 5px 15px;
    }
    .content-elements {
        overflow-x: scroll;
    }
    .content-endavors {
        display: none;
    }
    .content-chart {
        display: none;
        position: fixed;
        left: 50%;
        top: 5%;
        width: 310px;
        transform: translate(-50%, 0);
        text-align: center;
        z-index: 100;
        box-shadow: 0 0 50px rgba(0, 0, 0, 1);
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -khtml-border-radius: 20px;
    }
    .button-modal-chart-close {
        display: inline-block;
    }
    .content-chart-container {
        height: 270px !important;
        width: 270px !important;
    }
    .content-chart-table {
        font-size: 10px !important;
        margin-top: 5px !important;
        padding-left: 0 !important;
    }
    .content-chart-table > table > tbody > tr > td {
        height: 22px !important;
    }
    .content-endeavors {
        display: none;
        position: fixed;
        left: 50%;
        top: 5%;
        width: 90%;
        transform: translate(-50%, 0);
        z-index: 50;
        box-shadow: 0 0 50px rgba(0, 0, 0, 1);
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -khtml-border-radius: 20px;
    }
    .content-endeavors-container {
        overflow-x: auto;
    }
    .button-modal-endeavors-close {
        display: inline-block;
    }
    .content-endeavors > .panchanga-badge {
        height: 25px;
    }
    .content-endeavors > .panchanga-badge > .panchanga-badge-icon {
        height: 15px;
        width: 15px;
    }
    .content-endeavors > .panchanga-badge > .panchanga-badge-text {
        font-size: 12px;
    }

    .content-bottom-bar {
        display: block;
    }
    .content-elements-panchanga {
        width: 230px;
        flex-shrink: 0;
    }
    .content-elements-yogas {
        width: 460px;
        flex-shrink: 0;
    }
    .content-bottom-bar {
        box-shadow: 0 0 20px rgba(0, 0, 0, .4);
    }
    .content-result-date {
        font-size: 12px;
    }
    .content-result-score {
        font-size: 18px;
    }
    .content-result-total {
        font-size: 10px;
    }
    .content-result-icon {
        width: 13px;
        height: 13px;
        margin: 0 5px;
    }
    .content-result-sun {
        font-size: 12px;
    }
    .content-result-icon-sun {
        width: 18px;
        height: 18px;
        margin-right: 5px;
        display: inline-block;
        vertical-align: middle;
    }
    .content-loading-container {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .polar-container {
        font-size: 14px;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .content-list-scale {
        display: none;
    }
}

@media (min-width: 701px) and (max-width: 1000px) {
    .header-geo-date-time-endeavor {
        display: inline-block;
    }
    .header-date-time, .header-date, .header-time {
        display: inline-block;
        white-space: nowrap;
    }
    .header-endeavor .header-select {
        max-width: none;
    }
    .header-container {
        margin: 5px 10px 15px 10px;
    }
    .content-container {
        margin: 0;
        overflow-x: scroll;
    }
    .content-result {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
        padding-left: 10px;
    }
    .content-list {
        width: 510px;
        flex-shrink: 0;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .content-chart {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .button-modal-chart-close {
        display: none !important;
    }
    .content-loading-container {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .polar-container {
        font-size: 16px;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
}

@media (min-width: 1001px) and (max-width: 1200px) {
    .main-container {
        width: 100%;
    }
    .header-container {
        margin: 5px 10px 15px 10px;
    }
    .content-container {
        margin: 0;
        overflow-x: scroll;
    }
    .content-result {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
        padding-left: 10px;
    }
    .content-list {
        width: 510px;
        flex-shrink: 0;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .content-chart {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .button-modal-chart-close {
        display: none !important;
    }
    .content-loading-container {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
    .polar-container {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -khtml-border-radius: 0;
    }
}

@media (min-width: 1200px) {
    .button-modal-chart-close, .button-modal-endeavors-close {
        display: none !important;
    }
    .polar-container {
        margin-bottom: 15px;
    }
}