/*
 * Scoped styles for the redesigned POV-subscriber page.
 * Ported from the "pro" design (storage/css/new/style*.css) and namespaced
 * under .pov-redesign so the full-site pro rules don't leak into the current
 * site chrome (header / footer / navigation).
 */
.pov-redesign,
.pov-redesign * {
    box-sizing: border-box;
}

/* --- layout utilities --- */
.pov-redesign .flex { display: flex; }
.pov-redesign .flex-column { flex-direction: column; }
.pov-redesign .flex-1 { flex-grow: 1; }
.pov-redesign .justify-between { justify-content: space-between; }
.pov-redesign .gap-1 { gap: 5px; }
.pov-redesign .right { margin-left: auto; }
.pov-redesign .text-right { text-align: right; }
.pov-redesign .text-center { text-align: center; }
.pov-redesign .no-wrap,
.pov-redesign .nowrap { white-space: nowrap; }
.pov-redesign .font-small { font-size: 12px; }
.pov-redesign .condensed { letter-spacing: -0.92px; }
.pov-redesign .p-2 { padding: 10px; }
.pov-redesign .py-1 { padding: 5px 0; }
.pov-redesign .py-2 { padding: 10px 0; }
.pov-redesign .my-3 { margin: 15px 0; }
.pov-redesign .mb-2 { margin-bottom: 10px; }
.pov-redesign .mb-3 { margin-bottom: 15px; }
.pov-redesign .border {
    border: 1px solid #cacaca;
    background: #fff;
}

/* section title with gradient underline ("Відділення:") */
.pov-redesign .title {
    font-size: 22px;
    color: #4a4a4a;
    font-weight: 500;
}
.pov-redesign .title:after {
    content: "";
    display: block;
    background-image: linear-gradient(to right, #295e6c 0%, #52bfa2 100%);
    height: 2px;
}

/* --- combined card --- */
.pov-redesign .organization_table {
    display: flex;
    flex-direction: column;
}
.pov-redesign .organization_table h1 {
    font-size: 22px;
    font-weight: 500;
    margin: 0;
}
.pov-redesign .organization_table h2 {
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}

/* card header bar holding title + dropdowns */
.pov-redesign .block-small {
    margin-bottom: 0;
    padding: 10px;
    background: #fff;
    width: 100%;
    justify-content: space-between;
    display: flex;
    align-items: center;
}
.pov-redesign .block-small.border-bottom {
    border-bottom: 1px solid lightgrey;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}
.pov-redesign .block-small.bottom {
    background: #f4f4f4;
    border-top: 2px solid #d7d7d7;
    justify-content: flex-end;
    color: #82858a;
}
/* mobile: stack the two dropdowns full-width under the title */
.pov-redesign .main_title_list {
    max-width: none;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 5px;
}
.pov-redesign .main_title_list .dropdown { width: 100%; }

/* dropdown trigger button (teal pill, like pro) */
.pov-redesign .block-small .dropdown { position: relative; }
.pov-redesign .block-small .dropdown-toggle {
    border: 1px solid #295e6c;
    background-color: #295e6c;
    cursor: pointer;
    white-space: nowrap;
    border-radius: 2px;
    padding: 3px 7px;
    color: #fff;
    font-size: 14px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}
.pov-redesign .block-small .dropdown-toggle .caption {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pov-redesign .block-small .dropdown-toggle:after {
    content: "";
    display: inline-block;
    flex-shrink: 0;
    border: 5px solid transparent;
    border-top: 5px solid #fff;
    margin: 0;
    position: relative;
    top: 2px;
}

/* --- two column body --- */
.pov-redesign .top-wrapper {
    display: flex;
    flex-direction: column-reverse;
}
.pov-redesign .information {
    padding-bottom: 10px;
    border-top: 1px solid lightgrey;
}
.pov-redesign .rates { padding-bottom: 0; }
.pov-redesign .rates table { width: 100%; }

/* --- information table --- */
.pov-redesign .about_organization {
    width: 100%;
    border-collapse: collapse;
}
.pov-redesign .about_organization tr.wrapper td {
    vertical-align: baseline;
}
.pov-redesign .about_organization td {
    padding: 5px 10px;
}
.pov-redesign .information table td:first-of-type {
    font-size: 14px;
    color: #295e6c;
    white-space: nowrap;
}
.pov-redesign .about_organization a { color: #295e6c; }

/* rates table uses the current site's native .table-course styles (global CSS) */

/* preloader / error markup reuse the current site's global styles + JS toggling */

/* --- departments accordion (uses the site's native .chevron) --- */
.pov-redesign .accordion {
    display: flex;
    flex-direction: column;
}
.pov-redesign .accordion .title {
    padding: 9px 10px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid lightgrey;
    background: #f4f4f4;
    cursor: pointer;
    margin-bottom: 0;
}
.pov-redesign .accordion .title:after { content: none; } /* no gradient bar on item titles */
.pov-redesign .accordion .title h3 {
    font-size: 14px;
    font-weight: 500;
    color: #295e6c;
    margin: 0;
}
.pov-redesign .accordion .title .chevron {
    margin-left: auto;
    color: #295e6c;
}
.pov-redesign .accordion-item:last-of-type .title { border-bottom: 0; }
.pov-redesign .accordion-item .content { display: none; }
.pov-redesign .accordion-item.open .content { display: block; }

/* departments table */
.pov-redesign .department-table {
    width: 100%;
    border-collapse: collapse;
}
.pov-redesign .department-table th {
    background-color: aliceblue;
    text-align: left;
    font-weight: 500;
    padding: 8px 10px;
    border: 1px solid lightgrey;
}
.pov-redesign .department-table td {
    padding: 8px 10px;
    border: 1px solid lightgrey;
    vertical-align: top;
    word-break: break-word;
}
/* columns: Адреса (dominant), Години роботи (shrinks to content), Телефони */
.pov-redesign .department-table th:nth-child(1),
.pov-redesign .department-table td:nth-child(1) { width: 40%; border-left: 0; }
.pov-redesign .department-table th:nth-child(2),
.pov-redesign .department-table td:nth-child(2) { width: 1%; text-align: center; }
.pov-redesign .department-table td:nth-child(2) { white-space: nowrap; }
.pov-redesign .department-table th:nth-child(3),
.pov-redesign .department-table td:nth-child(3) { border-right: 0; }
.pov-redesign .department-table .department i { font-style: italic; }
.pov-redesign .department-table a { color: #295e6c; text-decoration: none; word-break: break-word; }
/* each phone on its own line with vertical padding for easier tapping */
.pov-redesign .department-table .dept-phone {
    display: block;
    padding: 6px 0;
}
.pov-redesign .department-table .dept-phone:first-child { padding-top: 0; }
.pov-redesign .department-table .dept-phone:last-child { padding-bottom: 0; }

#povs_table_about .table-bottom {
    border-bottom: 0;
}
/* ===== >= 768px : reveal dropdowns inline ===== */
@media screen and (min-width: 768px) {
    .pov-redesign .organization_table h1 { font-size: 24px; }
    .pov-redesign .block-small.border-bottom {
        flex-direction: row;
        align-items: center;
    }
    .pov-redesign .block-small .main_title_list {
        flex-direction: row;
        justify-content: flex-end;
        width: auto;
        gap: 5px;
    }
    .pov-redesign .main_title_list .dropdown { width: auto; }
    .pov-redesign .block-small .dropdown-toggle {
        width: auto;
        justify-content: flex-start;
    }
    /* desktop: phones on a single line (comma-separated), no block stacking */
    .pov-redesign .department-table .dept-phone {
        display: inline;
        padding: 0;
    }
    .pov-redesign .department-table .dept-phone:not(:last-child):after {
        content: ", ";
    }
}

/* ===== >= 1100px : information | rates side by side ===== */
@media screen and (min-width: 1100px) {
    .pov-redesign .top-wrapper { flex-direction: row; }
    .pov-redesign .information {
        border-right: 1px solid lightgrey;
        flex: 1;
        border-top: none;
    }
    .pov-redesign .rates { flex: 1; }
}
