/* ============================================
   GIBANICA APP v4.0 — BASE
   Warm · Cream · Bakery
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    /* Core cream palette */
    --cream:          #FAF7F2;
    --cream-dark:     #F2EBE0;
    --cream-border:   #E8DDD0;
    --cream-deep:     #DDD0C0;

    /* Warm brown accent */
    --primary:        #8B5E3C;
    --primary-light:  #A67C5B;
    --primary-dark:   #6B4423;
    --primary-50:     #FBF5EF;
    --primary-100:    #F5E8D8;
    --primary-200:    #EACDB0;

    /* Soft secondary */
    --secondary:      #9A8478;
    --secondary-light:#C4B5AB;

    /* Status */
    --success:        #5A7A4A;
    --success-light:  #EAF2E4;
    --danger:         #B84A3C;
    --danger-light:   #FBEDEB;
    --warning:        #A0783A;
    --warning-light:  #FDF3E3;

    /* Backgrounds */
    --bg-body:        #F5F0E8;
    --bg-card:        #FDFAF6;
    --bg-sidebar:     #2C1F14;
    --bg-hover:       #F2EBE0;
    --bg-input:       #FDFAF6;

    /* Text */
    --text-primary:   #2C1F14;
    --text-secondary: #6B5744;
    --text-muted:     #A89080;
    --text-inverse:   #FAF7F2;

    /* Borders */
    --border:         #E0D4C4;
    --border-light:   #EDE5D8;

    /* Shadows — warm toned */
    --shadow-xs: 0 1px 2px rgba(80, 50, 20, 0.06);
    --shadow-sm: 0 1px 4px rgba(80, 50, 20, 0.08), 0 1px 2px rgba(80, 50, 20, 0.05);
    --shadow-md: 0 4px 12px rgba(80, 50, 20, 0.10), 0 2px 4px rgba(80, 50, 20, 0.06);
    --shadow-lg: 0 10px 24px rgba(80, 50, 20, 0.12), 0 4px 8px rgba(80, 50, 20, 0.07);

    --sidebar-width: 250px;
    --radius:    10px;
    --radius-sm: 6px;
    --radius-lg: 16px;

    --transition: all 0.2s ease;
}

html { font-size: 15px; }

body {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.6;
    color: var(--text-primary);
    background: var(--bg-body);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
    font-family: 'Lora', Georgia, serif;
    font-weight: 600;
    letter-spacing: -0.2px;
}

a {
    color: var(--primary);
    text-decoration: none;
    transition: color 0.2s;
}

a:hover { color: var(--primary-dark); }

img { max-width: 100%; height: auto; }

.text-center  { text-align: center; }
.text-right   { text-align: right; }
.text-muted   { color: var(--text-muted); }
.text-success { color: var(--success); }
.text-danger  { color: var(--danger); }
.mt-1 { margin-top: 8px; }
.mt-2 { margin-top: 16px; }
.mt-3 { margin-top: 24px; }
.mb-1 { margin-bottom: 8px; }
.mb-2 { margin-bottom: 16px; }
.mb-3 { margin-bottom: 24px; }
.loading { opacity: 0.5; pointer-events: none; }