/*!
 * Component: DAG Document Portal
 * Version: 1.0.6
 * Last Updated: 2026-08-25
 */


.dag-portal-wrapper {
    font-family: inherit;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}



/* --------------------------------------------------------------------------
   Tab styles
   -------------------------------------------------------------------------- */
.dag-portal-wrapper .portal-tablist {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    align-self: stretch;
    border-bottom: 4px solid #EB3300;
    gap: 0;
}

.dag-portal-wrapper .portal-tab {
    display: flex;
    padding: 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: var(--Colour-platinum, #D6DCD8);
    background: var(--Colour-platinum, color(display-p3 0.8471 0.8627 0.8471));
    color: #EB3300 !important;
    color: color(display-p3 0.9216 0.2 0);
    text-align: center;
    border-radius: 0px !important;
    border: none !important;
    /* H1/fhd */
    font-family: "Barlow Semi Condensed";
    font-size: 2.625rem; /* 42px */
    font-style: normal;
    font-weight: 800;
    line-height: 115%; /* 55.2px */
    text-transform: uppercase;
}

.dag-portal-wrapper .portal-tab.active,
.dag-portal-wrapper .portal-tab[aria-selected="true"] {
   display: flex;
    padding: 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: var(--Colour-fire-red, #EB3300);
    background: var(--Colour-fire-red, color(display-p3 0.9216 0.2 0));
    color: #FFF !important;
    color: color(display-p3 1 1 1);
    text-align: center;

    /* H1/fhd */
    font-family: "Barlow Semi Condensed";
    font-size: 2.625rem; /* 42px */
    font-style: normal;
    font-weight: 800;
    line-height: 115%; /* 55.2px */
    text-transform: uppercase;
}

.dag-portal-wrapper .portal-tab:focus-visible {
    outline: 3px solid #000000;
    outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Accordion and chevron (using borders)
   -------------------------------------------------------------------------- */
.dag-portal-wrapper .portal-accordion {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.dag-portal-wrapper .portal-accordion[open] {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
}

.dag-portal-wrapper .portal-accordion-title {
    list-style: none; /* Removes standard disclosure triangle */
    padding: 1.25rem 1.5rem;
    position: relative;
    user-select: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dag-portal-wrapper .portal-accordion-title::-webkit-details-marker,
.dag-portal-wrapper .portal-accordion-title::marker {
    display: none;
}

.dag-portal-wrapper .meeting-title {
    color: #000;
    color: color(display-p3 0 0 0);
    font-size: 2.25rem;
    font-weight: 800;
    padding-right: 2rem;
    text-align: left;
    transition: color 0.3s ease;

    /* H2/fhd */
    font-family: "Barlow Semi Condensed";
    line-height: 115%; /* 41.4px */
    text-transform: uppercase;
}

.dag-portal-wrapper .portal-accordion[open] .meeting-title {
    color: #EB3300;
    color: color(display-p3 0.9216 0.2 0);
}
/* Pure CSS Chevron Arrow */
.dag-portal-wrapper .portal-accordion-title::after {
    content: '';
    display: inline-block;
    flex-shrink: 0; /* Prevents the text from squishing the arrow */
    width: 12px;
    height: 12px;
    border-right: 3px solid #EB3300;
    border-bottom: 3px solid #EB3300;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
    margin-left: 1.5rem; /* Forces a safe gap between text and arrow */
}

.dag-portal-wrapper .portal-accordion[open] .portal-accordion-title::after {
    transform: rotate(-135deg);
}

/* --------------------------------------------------------------------------
   Contents inside accordion (hidden by default, revealed when open)
   -------------------------------------------------------------------------- */
.dag-portal-wrapper .portal-accordion-content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease-out;
    padding: 0 1.5rem;
}

.dag-portal-wrapper .portal-accordion[open] .portal-accordion-content {
    grid-template-rows: 1fr;
    padding-bottom: 1.5rem;
}

.dag-portal-wrapper .portal-accordion-inner {
    overflow: hidden;
}

/* --------------------------------------------------------------------------
   Item and groups
   -------------------------------------------------------------------------- */
.dag-portal-wrapper .file-group-title {
    color: #000;
    color: color(display-p3 0 0 0);
    /* H3/fhd */
    font-family: "Barlow Semi Condensed";
    font-size: 1.6rem;
    font-style: normal;
    font-weight: 800;
    line-height: 115%; /* 31.05px */
    text-transform: uppercase;
    margin-top: 1rem;
}

.dag-portal-wrapper .file-list {
    margin: 0;
    padding: 0;
}

.dag-portal-wrapper .file-item {
    border-bottom: 1px solid #edf2f7;
    padding: 0.75rem 0;
}

.dag-portal-wrapper .file-item:last-child {
    border-bottom: none;
}

.dag-portal-wrapper .file-item a {
    color: #000;
    color: color(display-p3 0 0 0);

    /* body/fhd */
    font-family: Barlow;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 30px */
    word-break: break-word;
    transition: color 0.15s ease;
}

.dag-portal-wrapper .file-item a:hover,
.dag-portal-wrapper .file-item a:focus {
    color: #EB3300;
    text-decoration: underline !important;
}

.dag-portal-wrapper .see-more-btn {
    color: #000;
    color: color(display-p3 0 0 0);

    /* body/fhd */
    font-family: Barlow;
    font-size: 1.25rem; /* 20px */
    font-style: normal;
    font-weight: 700;
    line-height: 150%; /* 30px */
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: none;
}

.dag-portal-wrapper .see-more-btn:hover {
    color: #EB3300;
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Responsiveness & Media Queries
   -------------------------------------------------------------------------- */
/* Tablet View (Middle State) */
@media (min-width: 768px) and (max-width: 1024px) {
    .dag-portal-wrapper .portal-accordion-title {
        padding: 1rem 1.25rem;
    }
    
    .dag-portal-wrapper .portal-accordion-content {
        padding: 0 1.25rem;
    }
}

/* 4K Displays (2560px+) */
@media (min-width: 2560px) {
    html {
        font-size: 20px; /* Dynamically scales rem base across ultra-wide viewports */
    }

    .dag-portal-wrapper {
        max-width: 1800px;
    }
}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
    .dag-portal-wrapper {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Mobile Screens (Phones, max 767px) */
@media (max-width: 767px) {
    .dag-portal-wrapper {
        padding: 0 1rem; /* Add breathing room on the edges */
    }

    /* Stack tabs vertically for mobile thumbs */
    .dag-portal-wrapper .portal-tablist {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .dag-portal-wrapper .portal-tab {
        width: 100%;
        margin-right: 0;
        /* margin-bottom: 0.5rem; */
        font-size: 2rem;
        padding: 1rem; /* Generous 44px+ touch target */
    }

    dag-portal-wrapper .portal-tab.active,
.dag-portal-wrapper .portal-tab[aria-selected="true"] {
        font-size: 2rem;
        padding: 1rem; /* Generous 44px+ touch target */
    }

    /* Scale down accordion text */
    .dag-portal-wrapper .meeting-title {
        font-size: 1.625rem; 
        padding-right: 0;
        flex: 1; /* Allows the title to take up available space */
        line-height: 1.2; /* Adjust line height for better readability on small screens */
        overflow-wrap: break-word; /* Prevents overflow on long titles */ 
    }

    .dag-portal-wrapper .portal-accordion-title {
        padding: 1rem;
    }

    .dag-portal-wrapper .portal-accordion-content {
        padding: 0 1rem;
    }
    
    .dag-portal-wrapper .file-group-title {
        font-size: 1.375rem; /* Slightly smaller for mobile */
    }

    .dag-portal-wrapper .file-item a {
        font-size: 1.125rem; /* Slightly smaller for long mobile filenames */
        display: block;      /* Expands clickable area */
        padding: 0.25rem 0;
    }

    .dag-portal-wrapper .see-more-btn {
        font-size: 1.125rem; /* Slightly smaller for mobile */
        padding: 0.25rem 0;
    }

 
}