/* 
 * MARIANA Theme System
 * Automatic light and dark mode support
 * Based on system preference: prefers-color-scheme
 */

/* ========================================
   LIGHT MODE (Default)
   ======================================== */

* {
  font-family: 'Open Sans', sans-serif;
}

:root {
  /* Color Palette */
  --mariana-primary: #eb0203;
  --mariana-primary-dark: #eb0203;
  --mariana-primary-light: #F5E6E8;

  /* Backgrounds */
  --mariana-bg-primary: #FFFFFF;
  --mariana-bg-secondary: #F7F7F7;
  --mariana-bg-tertiary: #EFEFEF;

  /* Text */
  --mariana-text-primary: #FFFFFF;
  --mariana-text-secondary: #666666;
  --mariana-text-tertiary: #999999;

  /* Borders */
  --mariana-border: #E0E0E0;
  --mariana-border-light: #F0F0F0;

  /* Shadows */
  --mariana-shadow: rgba(0, 0, 0, 0.15);
  --mariana-shadow-sm: rgba(0, 0, 0, 0.08);

  /* Messages */
  --mariana-msg-user-bg: #fbe4e4;
  --mariana-msg-user-text: #212121;
  --mariana-msg-bot-bg: #f5f5f5;
  --mariana-msg-bot-text: #212121;
  --mariana-msg-border: #E0E0E0;

  /* Messages Area */
  --mariana-messages-bg: #FFFFFF;

  /* Typing Indicator */
  --mariana-typing-bg: #f5f5f5;

  /* Input Area */
  --mariana-input-bg: #FFFFFF;

  /* Input Field */
  --mariana-input-field-bg: #FFFFFF;
  --mariana-input-field-text: #212121;
  --mariana-input-field-border: #6F7070;
  --mariana-input-icon: #eb0203;

  /* Buttons */
  --mariana-button-bg: #FFFFFF;
  --mariana-button-border: #EB0203;
  --mariana-button-text: #EB0203;
  --mariana-button-hover-bg: #EEEEEE;
  --mariana-hierarchy-disabled-1-bg: #D5D5D5;
  --mariana-hierarchy-disabled-1-text: #6F7070;
  --mariana-hierarchy-disabled-1-border: #D5D5D5;
  --mariana-hierarchy-disabled-2-bg: #F5F5F5;
  --mariana-hierarchy-disabled-2-text: #6F7070;
  --mariana-hierarchy-disabled-2-border: #7C7D7D;
  --mariana-hierarchy-disabled-3-bg: #FFFFFF;
  --mariana-hierarchy-disabled-3-text: #6F7070;

  /* Recipe Cards */
  --mariana-recipe-card-bg: #FFFFFF;
  --mariana-recipe-card-border: #D5D5D5;
  --mariana-recipe-card-name: #000000;
  --mariana-recipe-card-description: #4E4F4F;
  --mariana-recipe-card-meta: #4E4F4F;
  --mariana-recipe-card-meta-icon: #4E4F4F;

  /* Coupon Cards */
  --mariana-coupon-card-bg: #FFFFFF;
  --mariana-coupon-card-strip: #EB0203;
  --mariana-coupon-card-border: #D5D5D5;
  --mariana-coupon-card-title-text: #000000;
  --mariana-coupon-card-new-text: #EB0203;
  --mariana-coupon-card-new-bg: #FDF2F2;
  --mariana-coupon-card-know-more-text: #EB0203;
  --mariana-coupon-card-validity-text: #4E4F4F;
  --mariana-coupon-card-select-bg: #FFFFFF;
  --mariana-coupon-card-selected-border: #EB0203;
  --mariana-coupon-arrow-filter: #EB0203;

  /* Scroll Dots */
  --mariana-scroll-dot-inactive: #F7C6C6;
  --mariana-scroll-dot-active: #EB0203;

  /* Scroll Arrows (Desktop) */
  --mariana-scroll-arrow-bg: #FFFFFF;
  --mariana-scroll-arrow-border: #D5D5D5;
  --mariana-scroll-arrow-icon: #EB0203;

  /* Tooltip / Speech Bubble */
  --mariana-tooltip-bg: rgba(213, 213, 213, 1);
  --mariana-tooltip-text: rgba(55, 56, 56, 1);

  /* States */
  --mariana-hover-bg: #F9F9F9;
  --mariana-dropdown-hover-bg: #FBE4E4;
  --mariana-dropdown-danger-text: var(--mariana-primary);
  --mariana-focus-ring: rgba(227, 30, 36, 0.25);
}

/* ========================================
   DARK MODE - System Preference
   ======================================== */

@media (prefers-color-scheme: dark) {
  :root {    /* Color Palette */
    --mariana-primary: #eb0203;
    --mariana-primary-dark: #eb0203;
    --mariana-primary-light: #F5E6E8;

    /* Backgrounds */
    --mariana-bg-primary: #282828;
    --mariana-bg-secondary: #282828;
    --mariana-bg-tertiary: #3A3A3A;

    /* Text */
    --mariana-text-primary: #FFFFFF;
    --mariana-text-secondary: #B0B0B0;
    --mariana-text-tertiary: #808080;

    /* Borders */
    --mariana-border: #3A3A3A;
    --mariana-border-light: #2D2D2D;

    /* Shadows */
    --mariana-shadow: rgba(0, 0, 0, 0.4);
    --mariana-shadow-sm: rgba(0, 0, 0, 0.25);

    /* Messages */
    --mariana-msg-user-bg: #fbe4e4;
    --mariana-msg-user-text: #212121;
    --mariana-msg-bot-bg: #373838;
    --mariana-msg-bot-text: #E0E0E0;
    --mariana-msg-border: #3A3A3A;

    /* Messages Area */
    --mariana-messages-bg: #000000;

    /* Typing Indicator */
    --mariana-typing-bg: #373838;

    /* Input Area */
    --mariana-input-bg: #272828;

    /* Input Field */
    --mariana-input-field-bg: #272828;
    --mariana-input-field-text: #FFFFFF;
    --mariana-input-field-border: #9FA0A0;
    --mariana-input-icon: #FBE4E4;

    /* Buttons */
    --mariana-button-bg: #282828;
    --mariana-button-border: #fbe4e4;
    --mariana-button-text: #fbe4e4;
    --mariana-button-hover-bg: #353535;
    --mariana-hierarchy-disabled-1-bg: #4E4F4F;
    --mariana-hierarchy-disabled-1-text: #D5D5D5;
    --mariana-hierarchy-disabled-1-border: #4E4F4F;
    --mariana-hierarchy-disabled-2-bg: #373838;
    --mariana-hierarchy-disabled-2-text: #D5D5D5;
    --mariana-hierarchy-disabled-2-border: #606161;
    --mariana-hierarchy-disabled-3-bg: var(--mariana-messages-bg);
    --mariana-hierarchy-disabled-3-text: #D5D5D5;

    /* Recipe Cards */
    --mariana-recipe-card-bg: #272828;
    --mariana-recipe-card-border: #4E4F4F;
    --mariana-recipe-card-name: #FFFFFF;
    --mariana-recipe-card-description: #EBEBEB;
    --mariana-recipe-card-meta: #EBEBEB;
    --mariana-recipe-card-meta-icon: #EBEBEB;

    /* Coupon Cards */
    --mariana-coupon-card-bg: #373838;
    --mariana-coupon-card-strip: #FBE4E4;
    --mariana-coupon-card-border: #4E4F4F;
    --mariana-coupon-card-title-text: #FFFFFF;
    --mariana-coupon-card-new-text: #FBE4E4;
    --mariana-coupon-card-new-bg: #373838;
    --mariana-coupon-card-know-more-text: #FBE4E4;
    --mariana-coupon-card-validity-text: #EBEBEB;
    --mariana-coupon-card-select-bg: #272828;
    --mariana-coupon-card-selected-border: #FBE4E4;
    --mariana-coupon-arrow-filter: #FBE4E4;

    /* Scroll Dots */
    --mariana-scroll-dot-inactive: #373838;
    --mariana-scroll-dot-active: #FBE4E4;

    /* Scroll Arrows (Desktop) */
    --mariana-scroll-arrow-bg: #272828;
    --mariana-scroll-arrow-border: #4E4F4F;
    --mariana-scroll-arrow-icon: #FFFFFF;

    /* Tooltip / Speech Bubble */
    --mariana-tooltip-bg: rgba(78, 79, 79, 1);
    --mariana-tooltip-text: rgba(213, 213, 213, 1);

    /* States */
    --mariana-hover-bg: #353535;
    --mariana-dropdown-hover-bg: #353535;
    --mariana-dropdown-danger-text: #f58e8e;
    --mariana-focus-ring: rgba(227, 30, 36, 0.4);
  }
}

/* Explicit light mode override — must come after the dark media query to win */
mariana-widget.mariana-light-mode {
  --mariana-primary: #eb0203;
  --mariana-primary-dark: #eb0203;
  --mariana-primary-light: #F5E6E8;
  --mariana-bg-primary: #FFFFFF;
  --mariana-bg-secondary: #F7F7F7;
  --mariana-bg-tertiary: #EFEFEF;
  --mariana-text-primary: #FFFFFF;
  --mariana-text-secondary: #666666;
  --mariana-text-tertiary: #999999;
  --mariana-border: #E0E0E0;
  --mariana-border-light: #F0F0F0;
  --mariana-shadow: rgba(0, 0, 0, 0.15);
  --mariana-shadow-sm: rgba(0, 0, 0, 0.08);
  --mariana-msg-user-bg: #fbe4e4;
  --mariana-msg-user-text: #212121;
  --mariana-msg-bot-bg: #f5f5f5;
  --mariana-msg-bot-text: #212121;
  --mariana-msg-border: #E0E0E0;
  --mariana-messages-bg: #FFFFFF;
  --mariana-typing-bg: #f5f5f5;
  --mariana-input-bg: #FFFFFF;
  --mariana-input-field-bg: #FFFFFF;
  --mariana-input-field-text: #212121;
  --mariana-input-field-border: #6F7070;
  --mariana-input-icon: #eb0203;
  --mariana-button-bg: #FFFFFF;
  --mariana-button-border: #EB0203;
  --mariana-button-text: #EB0203;
  --mariana-button-hover-bg: #EEEEEE;
  --mariana-hierarchy-disabled-1-bg: #D5D5D5;
  --mariana-hierarchy-disabled-1-text: #6F7070;
  --mariana-hierarchy-disabled-1-border: #D5D5D5;
  --mariana-hierarchy-disabled-2-bg: #F5F5F5;
  --mariana-hierarchy-disabled-2-text: #6F7070;
  --mariana-hierarchy-disabled-2-border: #7C7D7D;
  --mariana-hierarchy-disabled-3-bg: #FFFFFF;
  --mariana-hierarchy-disabled-3-text: #6F7070;
  --mariana-recipe-card-bg: #FFFFFF;
  --mariana-recipe-card-border: #D5D5D5;
  --mariana-recipe-card-name: #000000;
  --mariana-recipe-card-description: #4E4F4F;
  --mariana-recipe-card-meta: #4E4F4F;
  --mariana-recipe-card-meta-icon: #4E4F4F;
  --mariana-coupon-card-bg: #FFFFFF;
  --mariana-coupon-card-strip: #EB0203;
  --mariana-coupon-card-border: #D5D5D5;
  --mariana-coupon-card-title-text: #000000;
  --mariana-coupon-card-new-text: #EB0203;
  --mariana-coupon-card-new-bg: #FDF2F2;
  --mariana-coupon-card-know-more-text: #EB0203;
  --mariana-coupon-card-validity-text: #4E4F4F;
  --mariana-coupon-card-select-bg: #FFFFFF;
  --mariana-coupon-card-selected-border: #EB0203;
  --mariana-coupon-arrow-filter: #EB0203;
  --mariana-scroll-dot-inactive: #F7C6C6;
  --mariana-scroll-dot-active: #EB0203;
  --mariana-scroll-arrow-bg: #FFFFFF;
  --mariana-scroll-arrow-border: #D5D5D5;
  --mariana-scroll-arrow-icon: #EB0203;
  --mariana-tooltip-bg: rgba(213, 213, 213, 1);
  --mariana-tooltip-text: rgba(55, 56, 56, 1);
  --mariana-hover-bg: #F9F9F9;
  --mariana-dropdown-hover-bg: #FBE4E4;
  --mariana-dropdown-danger-text: var(--mariana-primary);
  --mariana-focus-ring: rgba(227, 30, 36, 0.25);
}

/* Permitir dark mode via classe no body ou html para mariana detetar o tema da AppCC*/
/* Também via atributo theme="mariana-dark-mode" no elemento mariana-widget */

body.mariana-dark-mode,
html.mariana-dark-mode,
mariana-widget.mariana-dark-mode {
  /* Permite dark mode via classe no body ou html */
  --mariana-primary: #eb0203;
  --mariana-primary-dark: #eb0203;
  --mariana-primary-light: #F5E6E8;

  /* Backgrounds */
  --mariana-bg-primary: #282828;
  --mariana-bg-secondary: #282828;
  --mariana-bg-tertiary: #3A3A3A;

  /* Text */
  --mariana-text-primary: #FFFFFF;
  --mariana-text-secondary: #B0B0B0;
  --mariana-text-tertiary: #808080;

  /* Borders */
  --mariana-border: #3A3A3A;
  --mariana-border-light: #2D2D2D;

  /* Shadows */
  --mariana-shadow: rgba(0, 0, 0, 0.4);
  --mariana-shadow-sm: rgba(0, 0, 0, 0.25);

  /* Messages */
  --mariana-msg-user-bg: #fbe4e4;
  --mariana-msg-user-text: #212121;
  --mariana-msg-bot-bg: #373838;
  --mariana-msg-bot-text: #E0E0E0;
  --mariana-msg-border: #3A3A3A;

  /* Messages Area */
  --mariana-messages-bg: #000000;

  /* Typing Indicator */
  --mariana-typing-bg: #373838;

  /* Input Area */
  --mariana-input-bg: #272828;

  /* Input Field */
  --mariana-input-field-bg: #272828;
  --mariana-input-field-text: #FFFFFF;
  --mariana-input-field-border: #9FA0A0;
  --mariana-input-icon: #FBE4E4;

  /* Buttons */
  --mariana-button-bg: #282828;
  --mariana-button-border: #fbe4e4;
  --mariana-button-text: #fbe4e4;
  --mariana-button-hover-bg: #353535;
  --mariana-hierarchy-disabled-1-bg: #4E4F4F;
  --mariana-hierarchy-disabled-1-text: #D5D5D5;
  --mariana-hierarchy-disabled-1-border: #4E4F4F;
  --mariana-hierarchy-disabled-2-bg: #373838;
  --mariana-hierarchy-disabled-2-text: #D5D5D5;
  --mariana-hierarchy-disabled-2-border: #606161;
  --mariana-hierarchy-disabled-3-bg: var(--mariana-messages-bg);
  --mariana-hierarchy-disabled-3-text: #D5D5D5;

  /* Recipe Cards */
  --mariana-recipe-card-bg: #272828;
  --mariana-recipe-card-border: #4E4F4F;
  --mariana-recipe-card-name: #FFFFFF;
  --mariana-recipe-card-description: #EBEBEB;
  --mariana-recipe-card-meta: #EBEBEB;
  --mariana-recipe-card-meta-icon: #EBEBEB;

  /* Coupon Cards */
  --mariana-coupon-card-bg: #373838;
  --mariana-coupon-card-strip: #FBE4E4;
  --mariana-coupon-card-border: #4E4F4F;
  --mariana-coupon-card-title-text: #FFFFFF;
  --mariana-coupon-card-new-text: #FBE4E4;
  --mariana-coupon-card-new-bg: #373838;
  --mariana-coupon-card-know-more-text: #FBE4E4;
  --mariana-coupon-card-validity-text: #EBEBEB;
  --mariana-coupon-card-select-bg: #272828;
  --mariana-coupon-card-selected-border: #FBE4E4;
  --mariana-coupon-arrow-filter: #FBE4E4;

  /* Scroll Dots */
  --mariana-scroll-dot-inactive: #373838;
  --mariana-scroll-dot-active: #FBE4E4;

  /* Scroll Arrows (Desktop) */
  --mariana-scroll-arrow-bg: #272828;
  --mariana-scroll-arrow-border: #4E4F4F;
  --mariana-scroll-arrow-icon: #FFFFFF;

  /* Tooltip / Speech Bubble */
  --mariana-tooltip-bg: rgba(78, 79, 79, 1);
  --mariana-tooltip-text: rgba(213, 213, 213, 1);

  /* States */
  --mariana-hover-bg: #353535;
  --mariana-dropdown-hover-bg: #353535;
  --mariana-dropdown-danger-text: #f58e8e;
  --mariana-focus-ring: rgba(227, 30, 36, 0.4);
}