/*
 * DASHBOARD_FINAL_CP3R6
 *
 * Based on confirmed rendered DOM.
 *
 * No React DOM movement.
 * No order/payment calculations.
 * No chart changes.
 */


/* ============================================================
   DASHBOARD HEADER
   ============================================================ */

.dashboard-heading.enterprise-dashboard-heading {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        auto !important;

    align-items: start !important;

    column-gap: 24px !important;
    row-gap: 0 !important;

    min-height: 0 !important;
    height: auto !important;

    margin-bottom: 16px !important;
}


.dashboard-heading.enterprise-dashboard-heading
> :first-child {
    min-width: 0 !important;
}


.dashboard-heading.enterprise-dashboard-heading
> button {
    align-self: start !important;
    justify-self: end !important;

    margin: 0 !important;
}


/* ============================================================
   FILTER CARD
   ============================================================ */

.dashboard-filter-card.enterprise-filter-card {
    margin-bottom: 16px !important;
}


/*
 * Confirmed native structure:
 *
 * grid
 * ├─ branch
 * ├─ sales
 * └─ .space-y-4
 *    ├─ quick buttons
 *    └─ date grid
 */

.dashboard-filter-card.enterprise-filter-card
> .grid {
    display: grid !important;

    width: 100% !important;

    padding: 0 !important;

    column-gap: 16px !important;
    row-gap: 12px !important;

    align-items: end !important;
}


.dashboard-filter-card.enterprise-filter-card
> .grid
> :nth-child(1),

.dashboard-filter-card.enterprise-filter-card
> .grid
> :nth-child(2) {
    min-width: 0 !important;
}


/*
 * Important:
 * preserve the DOM but expose the Quick Range and Date grid
 * to the parent's layout.
 */
.dashboard-filter-card.enterprise-filter-card
> .grid
> :nth-child(3) {
    display: contents !important;
}


/* ------------------------------------------------------------
   LARGE DESKTOP
   Branch | Sales | Quick range
   Dates span entire second row
   ------------------------------------------------------------ */

@media (min-width: 1180px) {

    .dashboard-filter-card.enterprise-filter-card
    > .grid {
        grid-template-columns:
            minmax(210px, 240px)
            minmax(190px, 220px)
            minmax(0, 1fr)
            !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(1) {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(2) {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .flex.flex-wrap.gap-2 {
        grid-column: 3 !important;
        grid-row: 1 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .grid.gap-3 {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
    }
}


/* ------------------------------------------------------------
   LAPTOP / NORMAL DESKTOP
   Branch | Sales
   Quick range gets its own full row
   Dates full width below it
   ------------------------------------------------------------ */

@media (min-width: 700px) and (max-width: 1179px) {

    .dashboard-filter-card.enterprise-filter-card
    > .grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(1) {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(2) {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .flex.flex-wrap.gap-2 {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .grid.gap-3 {
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
    }
}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media (max-width: 699px) {

    .dashboard-filter-card.enterprise-filter-card
    > .grid {
        grid-template-columns:
            minmax(0, 1fr)
            !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(1) {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(2) {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .flex.flex-wrap.gap-2 {
        grid-column: 1 !important;
        grid-row: 3 !important;
    }


    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .grid.gap-3 {
        grid-column: 1 !important;
        grid-row: 4 !important;
    }
}


/* Quick range */

.dashboard-filter-card.enterprise-filter-card
> .grid
> :nth-child(3)
> .flex.flex-wrap.gap-2 {
    display: flex !important;

    width: 100% !important;

    flex-wrap: wrap !important;
    align-items: center !important;

    gap: 7px !important;

    margin: 0 !important;
}


.dashboard-filter-card.enterprise-filter-card
> .grid
> :nth-child(3)
> .flex.flex-wrap.gap-2
button {
    min-height: 38px !important;

    padding: 7px 12px !important;

    font-size: 12px !important;
    line-height: 1.2 !important;

    border-radius: 9px !important;
}


/* Confirmed native Date From + Date To grid */

.dashboard-filter-card.enterprise-filter-card
> .grid
> :nth-child(3)
> .grid.gap-3 {
    display: grid !important;

    width: 100% !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;

    gap: 12px !important;

    margin-top: 0 !important;
}


@media (max-width: 520px) {

    .dashboard-filter-card.enterprise-filter-card
    > .grid
    > :nth-child(3)
    > .grid.gap-3 {
        grid-template-columns:
            minmax(0, 1fr)
            !important;
    }
}


/* Consistent filter controls */

.dashboard-filter-card.enterprise-filter-card
select,

.dashboard-filter-card.enterprise-filter-card
input {
    width: 100% !important;

    min-width: 0 !important;
    min-height: 40px !important;

    font-size: 13px !important;
}


/* ============================================================
   ONLINE ORDERING ATTRIBUTION
   ============================================================ */

#cp3-online-attribution-panel {
    margin-top: 16px !important;
    margin-bottom: 16px !important;

    overflow: hidden !important;

    border-radius: 14px !important;

    border-left:
        3px solid #f97316 !important;
}


/* Remove redundant ONLINE ORDERING eyebrow. */

#cp3-online-attribution-panel
.cp3-eyebrow {
    display: none !important;
}


/* Collapsed / expanded header */

#cp3-online-attribution-panel
.cp3-head {
    min-height: 66px !important;

    padding:
        13px 16px !important;

    gap: 16px !important;
}


#cp3-online-attribution-panel
.cp3-head-copy {
    min-width: 0 !important;
}


#cp3-online-attribution-panel
.cp3-title {
    display: block !important;

    margin: 0 !important;

    font-size: 16px !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;
}


#cp3-online-attribution-panel
.cp3-summary {
    display: block !important;

    margin-top: 5px !important;

    font-size: 12.5px !important;
    line-height: 1.45 !important;

    color: #64748b !important;
}


#cp3-online-attribution-panel
.cp3-toggle {
    flex: 0 0 auto !important;

    min-height: 36px !important;

    padding:
        6px 10px !important;

    white-space: nowrap !important;

    font-size: 12px !important;
    font-weight: 700 !important;

    border-radius: 8px !important;
}


/* Expanded body */

#cp3-online-attribution-panel
.cp3-body {
    padding:
        0 16px 16px
        !important;
}


#cp3-online-attribution-panel
.cp3-grid {
    gap: 12px !important;

    padding-top: 14px !important;
}


#cp3-online-attribution-panel
.cp3-card {
    min-width: 0 !important;

    padding: 14px !important;

    border-radius: 10px !important;

    background: #f8fafc !important;
}


/* Total */

#cp3-online-attribution-panel
.cp3-card:nth-child(1) {
    border-top:
        3px solid #64748b !important;
}


/* Commissioned */

#cp3-online-attribution-panel
.cp3-card:nth-child(2) {
    border-top:
        3px solid #f97316 !important;
}


/* Direct */

#cp3-online-attribution-panel
.cp3-card:nth-child(3) {
    border-top:
        3px solid #334155 !important;
}


#cp3-online-attribution-panel
.cp3-card-label {
    margin-bottom: 8px !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    font-weight: 800 !important;
}


#cp3-online-attribution-panel
.cp3-main-value {
    margin-bottom: 7px !important;

    font-size: 25px !important;
    line-height: 1.05 !important;

    font-weight: 800 !important;
}


#cp3-online-attribution-panel
.cp3-main-caption {
    margin-bottom: 10px !important;

    font-size: 11.5px !important;
    line-height: 1.4 !important;
}


#cp3-online-attribution-panel
.cp3-pairs {
    gap: 6px !important;
}


#cp3-online-attribution-panel
.cp3-pair {
    gap: 12px !important;

    font-size: 12px !important;
    line-height: 1.4 !important;
}


/* Insight */

#cp3-online-attribution-panel
.cp3-r6-insight {
    margin-top: 13px;

    padding:
        11px 13px;

    border:
        1px solid #fed7aa;

    border-radius: 9px;

    background: #fff7ed;

    color: #475569;

    font-size: 12px;
    line-height: 1.5;
}


#cp3-online-attribution-panel
.cp3-r6-insight strong {
    color: #0f172a;
}


/* Partner performance */

#cp3-online-attribution-panel
.cp3-table-head {
    margin-top: 18px !important;
    margin-bottom: 9px !important;
}


#cp3-online-attribution-panel
.cp3-table-title {
    font-size: 14px !important;
    line-height: 1.3 !important;
}


#cp3-online-attribution-panel
.cp3-table-note {
    margin-top: 3px !important;

    font-size: 11px !important;
}


#cp3-online-attribution-panel
table {
    font-size: 12px !important;
}


#cp3-online-attribution-panel
th {
    padding:
        10px !important;

    font-size: 10px !important;
    line-height: 1.3 !important;
}


#cp3-online-attribution-panel
td {
    padding:
        11px 10px !important;

    font-size: 12px !important;
}


#cp3-online-attribution-panel
tbody tr:hover {
    background:
        #f8fafc !important;
}


@media (max-width: 900px) {

    #cp3-online-attribution-panel
    .cp3-grid {
        grid-template-columns:
            minmax(0, 1fr)
            !important;
    }
}


/* ============================================================
   EVERYTHING ELSE IS INTENTIONALLY UNTOUCHED
   ============================================================ */