﻿/* ============================================================
   SYNCFUSION OVERRIDES — MALTACOURT DESIGN SYSTEM
   ============================================================ */


/* ------------------------------------------------------------
   BUTTONS
   ------------------------------------------------------------ */

.e-btn,
.e-control.e-btn {
    background: var(--mcw-accent) !important;
    border-radius: var(--mcw-radius-md) !important;
    color: white !important;
    border: none !important;
    box-shadow: var(--mcw-shadow-sm) !important;
    font-weight: 600 !important;
}

    .e-btn:hover,
    .e-control.e-btn:hover {
        background: var(--mcw-accent-hover) !important;
        box-shadow: var(--mcw-shadow-md) !important;

    }

/* ------------------------------------------------------------
   INPUTS
   ------------------------------------------------------------ */

.e-input-group,
.e-input,
.e-control.e-input {
    border-radius: var(--mcw-radius-md) !important;
    border-color: var(--mcw-border) !important;
    padding: .65rem .75rem !important;
    font-size: .95rem !important;
}

    .e-input:focus,
    .e-input-group:focus-within {
        border-color: var(--mcw-primary) !important;
        box-shadow: 0 0 0 2px rgba(49,40,108,.25) !important;
    }


/* ------------------------------------------------------------
   GRIDS
   ------------------------------------------------------------ */

/* Main Grid */
.e-grid {
    border: 1px solid var(--mcw-border-brand) !important;
    border-radius: var(--mcw-radius-md) !important;
    overflow: hidden;
}

    /* Header Row */
    .e-grid .e-headercell {
        background: var(--mcw-primary) !important;
        color: white !important;
        border-color: rgba(255,255,255,.12) !important;
        font-weight: 600 !important;
    }

    .e-grid .e-headertext {
        color: white !important;
    }


    .e-grid .e-altrow {
        background-color: #f7f7f7;
    }


    /* Data Rows */
    .e-grid .e-row {
        background: var(--mcw-bg) !important;
    }



    /*=======================================*/
    /*=========================================*/
   
.e-grid td.e-groupcaption {
    background-color: #f8f8fc !important; /* faint purple-tinted gray */
    border-left: 4px solid #6a2bbf !important; /* Maltacourt purple */
}



    /* Row Height */
    .e-grid .e-rowcell {
        padding-top: .75rem !important;
        padding-bottom: .75rem !important;
    }

    .e-grid .e-headercell {
        padding-top: .85rem !important;
        padding-bottom: .85rem !important;
    }

    /* Pager */
    .e-grid .e-pager {
        background: white !important;
        border-top: 1px solid var(--mcw-border-brand) !important;
    }


    /* ------------------------------------------------------------
   GRID ROW STATES — SELECTION / FOCUS / ACTIVE
   ------------------------------------------------------------ */

    /* Selected row (strong highlight) */
    .e-grid .e-selectionbackground,
    .e-grid .e-active {
        background-color: var(--mcw-accent) !important;
        color: var(--mcw-text-inverse) !important;
    }

    /* Focused row (when grid loses focus but row stays highlighted) */
    .e-grid .e-focused {
        background-color: var(--mcw-accent-hover) !important;
        color: var(--mcw-text-inverse) !important;
        outline: none !important;
    }

    /* Checkbox-selected row (Syncfusion applies a different class) */
    .e-grid .e-checkselect {
        background-color: var(--mcw-accent) !important;
        color: var(--mcw-text-inverse) !important;
    }

    /* Cell selection (when clicking individual cells) */
    .e-grid .e-cellselectionbackground {
        background-color: var(--mcw-accent) !important;
        color: var(--mcw-text-inverse) !important;
    }

    /* Hover row — lighter orange */
    .e-grid .e-rowcell.e-hover,
    .e-grid .e-row:hover .e-rowcell {
        background-color: var(--mcw-accent-light) !important;
    }

/* Hover on ANY cell 
    .e-grid td.e-rowcell:hover {
        background-color: var(--mcw-accent-light) !important;
        color: var(--mcw-text) !important; 
    }
        */

    /* Hover on ANY row cell */
    .e-grid tr.e-row:hover td.e-rowcell {
        background-color: var(--mcw-accent-light) !important;
        color: var(--mcw-text) !important; /* black text */
    }

    /* Hover on SELECTED row cell */
    .e-grid tr.e-selectionbackground:hover td.e-rowcell,
    .e-grid tr.e-active:hover td.e-rowcell {
        background-color: var(--mcw-accent-light) !important; /* keep light orange */
        color: var(--mcw-text) !important; /* force black text */
    }




/* ------------------------------------------------------------
   CHECKBOX
   ------------------------------------------------------------ */
.e-checkbox-wrapper .e-frame {
    border-radius: var(--mcw-radius-sm) !important;
    border-color: var(--mcw-primary) !important;
}

.e-checkbox-wrapper .e-check {
    background: var(--mcw-primary) !important;
}

/* ------------------------------------------------------------
   CARD / PANEL / CONTAINER
   ------------------------------------------------------------ */

.e-card,
.e-panel {
    border-radius: var(--mcw-radius-md) !important;
    box-shadow: var(--mcw-shadow-sm) !important;
}

/* ------------------------------------------------------------
   FOCUS RING (GLOBAL)
   ------------------------------------------------------------ */

*:focus {
    outline: 2px solid var(--mcw-primary) !important;
    outline-offset: 2px !important;
}


/* ------------------------------------------------------------
   DIALOGS
   ------------------------------------------------------------ */


.mcw-dialog {
    border: 16px solid var(--mcw-accent) !important;
    border-radius: 12px !important;
    box-shadow: var(--mcw-shadow-md) !important;
}



/*field s*/
.mcw-control--error {
    background: var(--mcw-error) !important;
    border-color: var(--mcw-error) !important;
    box-shadow: 0 0 0 3px var(--mcw-error-bg) !important;
    background: var(--mcw-error-bg);
}

.mcw-control--success {
    background: var(--mcw-success) !important;
    border-color: var(--mcw-success) !important;
    box-shadow: 0 0 0 3px var(--mcw-success-bg) !important;
    background: var(--mcw-success-bg);
}

.mcw-control--warning {
    background: var(--mcw-warning) !important;
    border-color: var(--mcw-warning) !important;
    box-shadow: 0 0 0 3px var(--mcw-warning-bg) !important;
    background: var(--mcw-warning-bg);
}





    /* Dialog header block */
    .mcw-dialog .mcw-dialog-header {
        background: var(--mcw-primary-dark);
        color: var(--mcw-text-inverse);
        padding: 1rem 1.25rem;
        border-bottom: 3px solid var(--mcw-accent);
        border-radius: 8px 8px 0 0;
    }

        /* Ensure supporting text */
        .mcw-dialog .mcw-dialog-header .mcw-text-supporting {
            color: var(--mcw-text-inverse);
            opacity: 0.9;
        }

        /* Title spacing inside dialog header */
        .mcw-dialog .mcw-dialog-header .mcw-title--small {
            margin-bottom: 0.25rem;
            color: var(--mcw-text-inverse);
        }


    .mcw-dialog .e-dlg-header-content {
        border-bottom: none !important;
        padding: var(--mcw-space-md) !important;
    }

            .mcw-dialog .e-dlg-content {
                padding: var(--mcw-space-md) !important;
                background: var(--mcw-bg) !important;
                border: none !important;
            }

            .mcw-dialog .mcw-card--large {
                padding: 2rem;
                border-radius: var(--mcw-radius-lg);
                background: var(--mcw-bg-alt);
                box-shadow: var(--mcw-shadow-sm);
            }

            .mcw-dialog .mcw-grid--two {
                gap: 1.5rem;
            }

            .mcw-dialog .mcw-field {
                margin-bottom: 1rem;
            }


.mcw-control--readonly {
    background-color: #f3f3f3; /* light gray */
    border: 1px solid #d0d0d0; /* subtle border */
    font-weight: 600; /* semi-bold */
    color: #333; /* dark text */
}

/*base alert*/

.mcw-alert {
    padding: 0.75rem 1rem;
    border-radius: 4px;
    margin-bottom: 2em;
}

/*warning alert*/
.mcw-alert--warning {
    background-color: #fff4e5;
    border-left: 4px solid #ff9800;
    padding: 0.75rem 1rem;
    color: #5a3d00;
}

/*read-only controls*/
.mcw-dialog select.mcw-control--readonly,
.mcw-dialog input.mcw-control--readonly {
    background-color: #f3f3f3 !important;
    border-color: #d0d0d0 !important;
    font-weight: 600 !important;
    color: #333 !important;
    cursor: not-allowed;
}

/*prevent disabled washout*/
.mcw-dialog .mcw-control--readonly:disabled {
    opacity: 1 !important; /* prevents grey washout */
}


/*flexrow for dimensions of LP*/
.mcw-flex-row {
    display: flex;
    gap: 1rem;
}

    .mcw-flex-row .mcw-field {
        width: auto !important;
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
    }
