/* --- Global Utility Extensions --- */
:root {
    --color-success: #5cb85c;
    --color-danger: #d9534f;
    --border-light: #ddd;
    --spacer-md: 15px;
    --spacer-lg: 30px;
}

/* Typography & Layout Utilities */
.u-text-semibold {
    font-weight: 600;
}

.u-block {
    display: block;
}

.u-margin-top-xs {
    margin-top: 5px;
}

.u-margin-bottom-md {
    margin-bottom: var(--spacer-md);
}

.u-margin-bottom-lg {
    margin-bottom: var(--spacer-lg);
}

.u-padding-bottom-md {
    padding-bottom: var(--spacer-md);
}

.u-border-bottom {
    border-bottom: 1px solid #eee;
}

/* --- Component: Survey Panel --- */
.c-survey-panel {
    border: 1px solid var(--border-light);
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: var(--spacer-lg);
}

    .c-survey-panel .panel-heading {
        background-color: #f8f9fa;
        border-bottom: 1px solid var(--border-light);
        font-weight: bold;
        color: #333;
    }

/* --- Component: Survey Actions (Footer) --- */
.c-survey-actions {
    margin-top: 20px;
    padding: 20px 0 50px 0;
    border-top: 1px solid #eee;
}

/* --- DevExpress Input Alignment --- */
/* Forces DevExpress Memos/Textboxes to inherit Bootstrap padding */
.c-memo-input .dxeEditArea_Default,
.c-text-input .dxeEditArea_Default {
    padding: 6px 12px !important;
    font-family: inherit;
}


/* Peril Selection Button Groups */
.c-peril-picker.btn-group-justified {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
}

.c-peril-picker .btn {
    min-width: 80px;
    transition: all 0.2s ease-in-out;
}

    /* Status-based coloring for active selection */
    .c-peril-picker .btn.active[data-level="low"],
    .c-peril-picker label:first-child.active {
        background-color: var(--color-success) !important;
        color: #fff !important;
        border-color: #4cae4c;
    }

    .c-peril-picker .btn.active[data-level="high"],
    .c-peril-picker label:last-child.active {
        background-color: var(--color-danger) !important;
        color: #fff !important;
        border-color: #d43f3a;
    }

/* Default gray state for unselected */
.c-survey-panel .btn-default {
    background-color: #f5f5f5;
    color: #333;
}

/* Green when Yes is active */
.c-survey-panel .btn-yes.active {
    background-color: #5cb85c !important;
    border-color: #4cae4c !important;
    color: #fff !important;
}

/* Red when No is active */
.c-survey-panel .btn-no.active {
    background-color: #d9534f !important;
    border-color: #d43f3a !important;
    color: #fff !important;
}

/* Hover effects to make it feel tactile */
.btn-yes:hover {
    border-color: #5cb85c;
}

.btn-no:hover {
    border-color: #d9534f;
}

/* Green for Yes when active */
.btn-yes.active {
    background-color: #5cb85c !important;
    border-color: #4cae4c !important;
    color: #ffffff !important;
}

/* Red for No when active */
.btn-no.active {
    background-color: #d9534f !important;
    border-color: #d43f3a !important;
    color: #ffffff !important;
}


/* --- Component: Grid Modernization (v10.2 compatible) --- */

/* The main grid container */
.c-grid-view {
    border: 1px solid var(--border-light) !important;
    border-collapse: collapse !important;
}

/* Header styling */
.dxgvHeader_Default, .c-grid-header {
    background-color: #f8f9fa !important;
    background-image: none !important;
    color: #333 !important;
    font-weight: 600 !important;
    padding: 12px !important;
    border-bottom: 2px solid var(--border-light) !important;
    text-transform: uppercase;
    font-size: 12px;
}

/* Cell styling */
.dxgv_Default, .c-grid-cell {
    padding: 12px !important;
    border-bottom: 1px solid #eee !important;
    background-color: #fff !important;
}

/* Pager Area - Targeting the generated table cell */
.dxgvPagerPanel_Default {
    padding: 15px !important;
    background-color: transparent !important;
    border-top: 1px solid var(--border-light) !important;
}

/* Active Page Number (Success Green) */
.dxpCurrentPageNumber_Default {
    background-color: var(--color-success) !important;
    border: 1px solid #4cae4c !important;
    color: white !important;
    padding: 2px 8px !important;
    font-weight: bold !important;
}

/* Compact buttons for Grid Actions */
.btn-grid-action {
    padding: 2px 8px !important;
    font-size: 12px !important;
    margin-right: 5px;
}

.c-grid-cell .fa {
    margin-right: 3px;
}

/* Ensure Peril Colors Stay Active */
.peril-picker .btn-success.active,
.peril-picker .btn-success:active {
    background-color: #5cb85c !important;
    color: #fff !important;
    border-color: #4cae4c !important;
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}

.peril-picker .btn-warning.active,
.peril-picker .btn-warning:active {
    background-color: #f0ad4e !important;
    color: #fff !important;
    border-color: #eea236 !important;
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}

.peril-picker .btn-danger.active,
.peril-picker .btn-danger:active {
    background-color: #d9534f !important;
    color: #fff !important;
    border-color: #d43f3a !important;
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}

/* Remove the default grey hover if it's already active */
.peril-picker .btn.active:hover {
    filter: brightness(90%);
}

/* Target only the LinkButtons with button classes inside grid cells */
.c-grid-view .dxgvDataRow td .btn {
    color: #ffffff !important;
}

    /* Ensure icons inside those specific buttons are also white */
    .c-grid-view .dxgvDataRow td .btn i {
        color: #ffffff !important;
    }

    /* Maintain white text on hover for grid buttons */
    .c-grid-view .dxgvDataRow td .btn:hover {
        color: #ffffff !important;
        text-decoration: none;
    }

/* Specific fix for btn-info (your blue View/Edit buttons) */
.c-grid-view .btn-info {
    background-color: #004a99; /* Deep blue to ensure white text is readable */
    border-color: #003d7a;
}