/*
  Aura — θέματα εμφάνισης στα χρώματα του brand (General §1.2 #7).
  Χρώματα από το λογότυπο (graphics/Aura-Logo.png):
    ιντιγκό #5134DD · βιολετί #8050F0 · λεβάντα #B786FA · λιλά #D99BEB · μελιτζανί κειμένου #260643
  Το θέμα της Radzen (material / material-dark) αλλάζει από το ThemeService· εδώ αλλάζουμε μόνο τα tokens.
  Το attribute data-aura-theme μπαίνει στο <html> από το aura.js.
*/

:root {
    --aura-indigo: #5134DD;
    --aura-violet: #8050F0;
    --aura-lavender: #B786FA;
    --aura-lilac: #D99BEB;
    --aura-ink: #260643;
    --aura-gradient: linear-gradient(135deg, #5134DD 0%, #8050F0 55%, #C072EB 100%);
    --aura-radius: 10px;

    /* Κανονικά πεζά-κεφαλαία παντού (το material θέμα βάζει ΚΕΦΑΛΑΙΑ σε κουμπιά, tabs κ.λπ.). */
    --rz-text-button-text-transform: none;
    --rz-tabs-tab-text-transform: none;
    --rz-badge-text-transform: none;
    --rz-datepicker-calendar-header-text-transform: none;
    --rz-scheduler-header-text-transform: none;
    --rz-scheduler-today-button-text-transform: none;
    --rz-text-overline-text-transform: none;
}

.rz-button, .rz-button-text, .rz-tabview-nav a, .rz-badge, .rz-text-overline { text-transform: none !important; }

:root[data-aura-theme="light"] {
    --rz-primary: #6A3FE6;
    --rz-primary-light: #8E6BF0;
    --rz-primary-lighter: rgba(106, 63, 230, 0.12);
    --rz-primary-dark: #5134DD;
    --rz-primary-darker: #3B23A8;
    --rz-on-primary: #ffffff;
    --rz-secondary: #B04FD9;
    --rz-secondary-light: #C072EB;
    --rz-secondary-lighter: rgba(176, 79, 217, 0.12);
    --rz-secondary-dark: #8E37B5;
    --rz-on-secondary: #ffffff;

    --rz-base-50: #FAF8FD;
    --rz-base-100: #F3F0F9;
    --rz-base-200: #E6E0F0;
    --rz-base-300: #D3CAE3;
    --rz-base-400: #B3A7C9;
    --rz-base-500: #8E82A6;
    --rz-base-600: #6A5C85;
    --rz-base-700: #4A3A66;
    --rz-base-800: #33224D;
    --rz-base-900: #260643;

    --rz-body-background-color: #F5F2FA;
    --rz-header-background-color: transparent;
    --rz-border-radius: 8px;

    --aura-surface: #ffffff;
    --aura-header-background: var(--aura-gradient);
    --aura-header-color: #ffffff;
    --aura-muted: #6A5C85;
    --aura-tile: #ffffff;
    --aura-tile-hover: #EFE8FD;
}

:root[data-aura-theme="dark"] {
    --rz-primary: #9D7BFF;
    --rz-primary-light: #B79CFF;
    --rz-primary-lighter: rgba(157, 123, 255, 0.16);
    --rz-primary-dark: #8050F0;
    --rz-primary-darker: #6A3FE6;
    --rz-on-primary: #160A28;
    --rz-secondary: #D99BEB;
    --rz-secondary-light: #E6B9F2;
    --rz-secondary-lighter: rgba(217, 155, 235, 0.16);
    --rz-secondary-dark: #C072EB;
    --rz-on-secondary: #160A28;

    --rz-base-50: #ECE7F5;
    --rz-base-100: #BDB3D1;
    --rz-base-200: #8E82A6;
    --rz-base-300: #6A5C85;
    --rz-base-400: #4A3A66;
    --rz-base-500: #3A2A55;
    --rz-base-600: #2F1F47;
    --rz-base-700: #241638;
    --rz-base-800: #1A1029;
    --rz-base-900: #120A1F;

    --rz-body-background-color: #120A1F;
    --rz-base-background-color: #1A1029;
    --rz-header-background-color: transparent;
    --rz-border-radius: 8px;

    --aura-surface: #1A1029;
    --aura-header-background: linear-gradient(135deg, #24104A 0%, #3A1D78 60%, #5A2B8F 100%);
    --aura-header-color: #ECE7F5;
    --aura-muted: #BDB3D1;
    --aura-tile: #241638;
    --aura-tile-hover: #2F1F47;
}

html, body {
    background: var(--rz-body-background-color);
    color: var(--rz-text-color);
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Header με τη διαβάθμιση του brand */
.aura-header {
    background: var(--aura-header-background) !important;
    color: var(--aura-header-color) !important;
}

.aura-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: inherit;
    text-decoration: none;
}

.aura-brand img { height: 28px; }

.aura-brand small {
    font-weight: 500;
    letter-spacing: 0.02em;
    opacity: 0.85;
}

.aura-muted { color: var(--aura-muted); }

.aura-static-field { display: flex; flex-direction: column; gap: 0.3rem; }
.aura-static-field label { font-size: 0.85rem; color: var(--aura-muted); }
.aura-static-field input { width: 100%; box-sizing: border-box; }

.aura-card {
    background: var(--aura-surface);
    border-radius: var(--aura-radius);
}

/* Κουμπιά ειδών στο τερματικό — μεγάλα, για αφή */
.aura-tile {
    background: var(--aura-tile);
    border: 1px solid var(--rz-base-200);
    border-radius: var(--aura-radius);
    min-height: 88px;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
    cursor: pointer;
    color: var(--rz-text-color);
    transition: background 0.1s ease;
}

.aura-tile:hover, .aura-tile:active { background: var(--aura-tile-hover); }
.aura-tile .price { font-weight: 700; color: var(--rz-primary); }

.aura-amount { font-variant-numeric: tabular-nums; }

.aura-pin-display {
    font-size: 2rem;
    letter-spacing: 0.5em;
    text-align: center;
    min-height: 3rem;
}

.aura-keypad {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
}

.aura-keypad button {
    min-height: 64px;
    font-size: 1.5rem;
}

/* Πλαϊνά παράθυρα (General §1.2 #8): η Radzen δεν ορίζει top — χωρίς αυτό εμφανίζονται κάτω από τη σελίδα. */
.rz-dialog-side-position-right, .rz-dialog-side-position-left { top: 0; bottom: 0; }
.rz-dialog-side-position-top { top: 0; left: 0; right: 0; }
.rz-dialog-side-position-bottom { bottom: 0; left: 0; right: 0; }

/* ── Responsive (General §1.2 #12): κινητό, tablet και POS χαμηλής ανάλυσης ── */

/* Στενότερο sidebar — σε 800×600 / 1024×768 τα 300px της Radzen έτρωγαν τη μισή οθόνη. */
:root { --rz-sidebar-width: 220px; }

.aura-header-prefs { align-items: center; gap: 0.75rem; }
.aura-prefs-menu, .aura-prefs-menu > .rz-navigation-item, .aura-prefs-menu > .rz-navigation-item > .rz-navigation-item-wrapper {
    color: inherit; background: transparent !important; box-shadow: none;
}
.aura-prefs-menu .rz-navigation-menu { color: var(--rz-text-color); }
.aura-prefs-menu .aura-menu-separator { border-top: 1px solid var(--rz-base-300); }
.aura-header-user { line-height: 1.2; max-width: 220px; overflow: hidden; }
.aura-header-user > * { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aura-header-user small { opacity: 0.85; }

/* Πλαϊνό παράθυρο: ποτέ πλατύτερο από την οθόνη (κινητό). */
.rz-dialog-side { max-width: 100vw; }

/* Grids: οριζόντια κύλιση αντί για «συμπίεση» στηλών όταν η οθόνη είναι στενή. */
.rz-data-grid { max-width: 100%; }