﻿/* site.css */

/* Global Radzen variable overrides */
:root {
    /* Brand colors */
    /*--rz-primary: #ff6600;*/ /* Primary accent (buttons, links, highlights) */
    /*--rz-secondary: #333333;*/ /* Secondary accent */
    --rz-info: #17a2b8; /* Info messages */
    /*--rz-success: #28a745;*/ /* Success messages */
    /*--rz-warning: #ffc107;*/ /* Warning messages */
    --rz-danger: #dc3545; /* Error/danger messages */
    --rz-primary: black;
    --rz-secondary: #16a085;
    --rz-warning: #e67e22;
    --rz-success: #27ae60;
    /* Typography */
    --rz-font-family: "Segoe UI", Arial, sans-serif;
    --rz-font-size: 16px;
    --rz-heading-font-weight: 600;
    --rz-text-color: #222222;
    /* Borders & spacing */
    --rz-border-radius: 8px; /* Rounded corners */
    --rz-border-color: #dddddd;
    --rz-padding: 0.75rem;
    /* Shadows */
    --rz-shadow: 0 2px 6px rgba(0,0,0,0.15);
    /* Backgrounds */
    --rz-background: #ffffff;
    --rz-card-background: #f9f9f9;
    /* Layout*/
    --rz-header-background-color: black;
    --rz-footer-background-color: black;
    --rz-body-background-color: white;
    --rz-sidebar-toggle-color: black;
    /*
    --rz-panel-menu-padding-block: 0;
    --rz-panel-menu-padding-inline: 10px;
    --rz-panel-menu-font-size: 1 rem;
    --rz-panel-menu-font-weight: #{$panel-menu-font-weight};
    --rz-panel-menu-focus-outline: #{$panel-menu-focus-outline};
    --rz-panel-menu-focus-outline-offset: #{$panel-menu-focus-outline-offset};
    --rz-panel-menu-item-line-height: #{$panel-menu-item-line-height};
    --rz-panel-menu-item-padding-block: #{$panel-menu-item-padding-block};
    --rz-panel-menu-item-padding-inline: #{$panel-menu-item-padding-inline};
    --rz-panel-menu-item-margin-block: #{$panel-menu-item-margin-block};
    --rz-panel-menu-item-margin-inline: #{$panel-menu-item-margin-inline};
    --rz-panel-menu-item-border: #{$panel-menu-item-border};
    --rz-panel-menu-item-border-radius: #{$panel-menu-item-border-radius};
    --rz-panel-menu-item-color: #{$panel-menu-item-color};
    --rz-panel-menu-item-background-color: #{$panel-menu-item-background-color};
    --rz-panel-menu-item-hover-color: #{$panel-menu-item-hover-color};
    --rz-panel-menu-item-hover-background-color: #{$panel-menu-item-hover-background-color};
    --rz-panel-menu-item-active-color: #{$panel-menu-item-active-color};
    --rz-panel-menu-item-active-background-color: #{$panel-menu-item-active-background-color};
    --rz-panel-menu-item-active-indicator: #{$panel-menu-item-active-indicator};
    --rz-panel-menu-item-offset: #{$panel-menu-item-offset};
    --rz-panel-menu-item-transition: #{$panel-menu-item-transition};
    --rz-panel-menu-2nd-level-vertical-offset: #{$panel-menu-2nd-level-vertical-offset};
    --rz-panel-menu-item-2nd-level-padding-block: #{$panel-menu-item-2nd-level-padding-block};
    --rz-panel-menu-item-2nd-level-padding-inline: #{$panel-menu-item-2nd-level-padding-inline};
    --rz-panel-menu-item-2nd-level-margin-block: #{$panel-menu-item-2nd-level-margin-block};
    --rz-panel-menu-item-2nd-level-margin-inline: #{$panel-menu-item-2nd-level-margin-inline};
    --rz-panel-menu-item-2nd-level-border-radius: #{$panel-menu-item-2nd-level-border-radius};
    --rz-panel-menu-item-2nd-level-offset: #{$panel-menu-item-2nd-level-offset};
    --rz-panel-menu-item-2nd-level-font-size: #{$panel-menu-item-2nd-level-font-size};
    --rz-panel-menu-item-2nd-level-font-weight: #{$panel-menu-item-2nd-level-font-weight};
    --rz-panel-menu-item-2nd-level-color: #{$panel-menu-item-2nd-level-color};
    --rz-panel-menu-item-2nd-level-background-color: #{$panel-menu-item-2nd-level-background-color};
    --rz-panel-menu-item-2nd-level-hover-color: #{$panel-menu-item-2nd-level-hover-color};
    --rz-panel-menu-item-2nd-level-hover-background-color: #{$panel-menu-item-2nd-level-hover-background-color};
    --rz-panel-menu-item-2nd-level-active-color: #{$panel-menu-item-2nd-level-active-color};
    --rz-panel-menu-item-2nd-level-active-background-color: #{$panel-menu-item-2nd-level-active-background-color};
    --rz-panel-menu-item-2nd-level-active-font-weight: #{$panel-menu-item-2nd-level-active-font-weight};
    --rz-panel-menu-item-3rd-level-color: #{$panel-menu-item-3rd-level-color};
    --rz-panel-menu-item-3rd-level-background-color: #{$panel-menu-item-3rd-level-background-color};
    --rz-panel-menu-item-3rd-level-hover-color: #{$panel-menu-item-3rd-level-hover-color};
    --rz-panel-menu-item-3rd-level-hover-background-color: #{$panel-menu-item-3rd-level-hover-background-color};
    --rz-panel-menu-item-3rd-level-active-color: #{$panel-menu-item-3rd-level-active-color};
    --rz-panel-menu-item-3rd-level-active-background-color: #{$panel-menu-item-3rd-level-active-background-color};
    --rz-panel-menu-icon-width: #{$panel-menu-icon-width};
    --rz-panel-menu-icon-font-size: #{$panel-menu-icon-font-size};
    --rz-panel-menu-icon-color: #{$panel-menu-icon-color};
    --rz-panel-menu-icon-height: #{$panel-menu-icon-height};
    --rz-panel-menu-icon-margin-inline: #{$panel-menu-icon-margin-inline};
    --rz-panel-menu-icon-2nd-level-margin-inline: #{$panel-menu-icon-2nd-level-margin-inline};
    --rz-panel-menu-icon-2nd-level-icon-size: #{$panel-menu-icon-2nd-level-icon-size};
    --rz-panel-menu-toggle-icon-font-size: #{$panel-menu-toggle-icon-font-size};
    --rz-panel-menu-toggle-icon-opacity: #{$panel-menu-toggle-icon-opacity};*/
    /* rz-panel-menu*/
    --rz-panel-menu-padding-block: 0;
    --rz-panel-menu-padding-inline: 10px;
    --rz-panel-menu-font-size: 1rem;
    --rz-panel-menu-icon-color: white;
    --rz-panel-menu-item-background-color: black;
    --rz-panel-menu-item-color: white;
    --rz-panel-menu-item-border: none;
    --rz-panel-menu-item-2nd-level-color: white;
    --rz-panel-menu-item-2nd-level-font-size: 1rem;
    --rz-panel-menu-item-2nd-level-background-color: transparent;
    --rz-panel-menu-item-2nd-level-border-radius: 0;
    --rz-panel-menu-item-hover-background-color: transparent;
    --rz-panel-menu-item-hover-color: white;
    --rz-panel-menu-item-2nd-level-hover-background-color: transparent;
    --rz-panel-menu-item-2nd-level-hover-color: white;
    --rz-panel-menu-item-2nd-level-active-background-color: transparent;
    --rz-panel-menu-item-2nd-level-active-color: white;
    /* --rz-grid-header-background-color: ghostwhite;*/
    /*--rz-layout-body-background-color: whitesmoke;*/
    /*   --rz-body-background-color:whitesmoke;*/
    /*--rz-grid-header-background-color: linear-gradient(180deg, #f6f8fb 0%, #e9eef7 50%, #ffffff 100%);*/
    /*    --rz-text-font-family: 'Trebuchet', Tahoma, Geneva, Verdana, sans-serif;*/
    /*--rz-font-family: 'Montserrat', sans-serif;
    --rz-font-size: 16px;
    --rz-text-h4-font-size: 2rem;
    --rz-text-h4-font-family: 'Montserrat', Tahoma, Geneva, Verdana, sans-serif;*/
}

/* Optional: scope overrides to a specific theme */
.rz-default {
    --rz-primary: #ff6600;
    --rz-secondary: #444444;
}

/* Example component tweaks */
.rz-button {
    font-weight: 500;
    text-transform: uppercase;
}

.rz-card {
    border-radius: var(--rz-border-radius);
    box-shadow: var(--rz-shadow);
    background: var(--rz-card-background);
}

.rz-layout {
    border: 1px solid gainsboro;
}

.rz-group-header {
    background-color: ghostwhite !important;
}

.rz-grid-table thead th {
    background-color: lavender !important;
}

.rz-tabview-panel {
    background-color: white !important;
}

.rz-card {
    background-color: white !important;
    margin: 10px;
}

/* Mobile */
@media (max-width:768px) {
    .rz-body {
        width: 100vW !important;
        padding: 10px !important;
        background-color:whitesmoke !important;
    }

    .hamburger {
        display: block !important;
        margin-right: 10px;
    }

    .desktop-menu {
        display: none !important; /* hide inline menu */
    }
}
