/**
 * variables.css — mykardamyla.gr unified design tokens
 *
 * Παλέτα: iOS Blue (#007AFF) — βασισμένη στο vibeloop.html
 * Font:   Inter (default), Outfit διατηρείται για index/events
 *
 * ΧΡΗΣΗ:
 *   Πρόσθεσε στο <head> κάθε σελίδας ΠΡΙΝ από το inline <style>:
 *   <link rel="stylesheet" href="/variables.css">
 *
 *   Μετά αφαίρεσε το :root block από το inline <style> της σελίδας.
 *
 * ΣΗΜΕΙΩΣΗ:
 *   Το αρχείο αυτό δεν έχει συνδεθεί ακόμα σε καμία σελίδα.
 *   Η μετάβαση γίνεται σταδιακά, σελίδα-σελίδα.
 * ─────────────────────────────────────────────────────────────────────────────
 */

:root {

    /* ── Primary ─────────────────────────────────────────────────────────── */
    --primary:            #007AFF;   /* iOS Blue                              */
    --primary-dark:       #0051d5;   /* iOS Blue dark                         */
    --primary-light:      #e8f0ff;   /* Soft blue tint (buttons, badges)      */
    --accent:             #5ac8fa;   /* iOS light blue (highlights)           */

    /* Aliases που χρησιμοποιούνται σε παλιές σελίδες */
    --p1: var(--primary);
    --p2: var(--primary-dark);
    --p3: var(--accent);
    --gradient-start: var(--primary);
    --gradient-end:   var(--primary-dark);

    /* ── Semantic / Status ───────────────────────────────────────────────── */
    --success:            #34C759;   /* iOS green                             */
    --success-light:      #d5f5e3;
    --warning:            #FF9500;   /* iOS orange                            */
    --warning-light:      #fff3cd;
    --danger:             #FF3B30;   /* iOS red                               */
    --danger-light:       #fee2e2;
    --secondary:          #5ac8fa;

    /* ── Text ────────────────────────────────────────────────────────────── */
    --text:               #1c1c1e;   /* iOS near-black                        */
    --text-main:          #1c1c1e;   /* alias (used by tourism/requests/admin)*/
    --text-muted:         #8e8e93;   /* iOS grey                              */
    --text-light:         #aeaeb2;

    /* ── Backgrounds ─────────────────────────────────────────────────────── */
    --bg:                 #f2f2f7;   /* iOS system background                 */
    --background:         #f2f2f7;   /* alias                                 */
    --bg2:                #e5e5ea;
    --surface:            #ffffff;
    --surface-gray:       #f8f9fa;
    --white:              #ffffff;

    /* Vibeloop-specific surface aliases */
    --surface2:  var(--bg);
    --header-bg: #1c1c1e;

    /* ── Borders ─────────────────────────────────────────────────────────── */
    --border:             #e5e7eb;
    --border-strong:      rgba(148, 163, 184, 0.35);

    /* Glassmorphism (directory) */
    --glass-bg:           rgba(255, 255, 255, 0.55);
    --glass-bg-strong:    rgba(255, 255, 255, 0.75);
    --glass-shadow:       0 8px 32px rgba(0, 122, 255, 0.12);
    --glass-shadow-lg:    0 12px 40px rgba(0, 122, 255, 0.18);

    /* ── Shadows ─────────────────────────────────────────────────────────── */
    --shadow-sm:          0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --shadow:             0 4px 16px rgba(0,0,0,0.08);
    --shadow-lg:          0 12px 40px rgba(0,0,0,0.12);
    --card-shadow:        0 8px 30px rgba(0,0,0,0.05);
    --card-shadow-hover:  0 20px 40px rgba(0, 122, 255, 0.12);

    /* ── Border radius ───────────────────────────────────────────────────── */
    --radius:             16px;
    --radius-sm:          10px;

    /* ── Typography ──────────────────────────────────────────────────────── */
    --font-main:          'Inter', sans-serif;

    /* ── Transitions ─────────────────────────────────────────────────────── */
    --transition:         all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
