/*
Theme Name: Noor Store - متجر نور
Theme URI: https://nourstore.local/
Author: Noor Store Team
Author URI: https://nourstore.local/
Description: قالب متجر إلكتروني مصري عصري متكامل مبني على واجهات جوجل ستيتش، متوافق 100% مع ووكومرس وإليمنتور، يدعم الشراء السريع، وتتبع الشحنات، والدفع عند الاستلام وانستاباي، والتحكم الكامل في المنتجات عبر ووكومرس.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: noor-store
Tags: e-commerce, custom-colors, custom-menu, featured-images, full-width-template, rtl-language-support, translation-ready, woocommerce, elementor
*/

/* ==========================================================================
   Base Theme Variables & Styles
   ========================================================================== */
:root {
  --color-surface: #faf9f9;
  --color-on-surface: #1b1c1c;
  --color-surface-dim: #dbdad9;
  --color-surface-bright: #faf9f9;
  --color-surface-container-lowest: #ffffff;
  --color-surface-container-low: #f5f3f3;
  --color-surface-container: #efeded;
  --color-surface-container-high: #e9e8e8;
  --color-surface-container-highest: #e3e2e2;
  --color-surface-variant: #e3e2e2;
  --color-on-surface-variant: #444748;
  --color-inverse-surface: #303031;
  --color-inverse-on-surface: #f2f0f0;

  --color-primary: #000000;
  --color-on-primary: #ffffff;
  --color-primary-container: #1c1b1b;
  --color-on-primary-container: #858383;
  --color-primary-fixed: #e5e2e1;
  --color-primary-fixed-dim: #c8c6c5;
  --color-on-primary-fixed: #1c1b1b;

  --color-secondary: #5d5f5f;
  --color-on-secondary: #ffffff;
  --color-secondary-container: #dcdddd;
  --color-on-secondary-container: #5f6161;

  --color-outline: #747878;
  --color-outline-variant: #c4c7c7;

  --color-error: #ba1a1a;
  --color-on-error: #ffffff;
  --color-error-container: #ffdad6;
  --color-on-error-container: #93000a;

  --font-family-arabic: 'Cairo', 'IBM Plex Sans Arabic', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

html, body {
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: var(--color-surface);
  color: var(--color-on-surface);
  font-family: var(--font-family-arabic);
  direction: rtl;
  text-align: right;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Safe area padding for mobile notches and navigation bars */
.pb-safe {
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.pt-safe {
  padding-top: env(safe-area-inset-top, 0px);
}

/* Material Symbols icon helper */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  vertical-align: middle;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--color-surface-container-low);
}
::-webkit-scrollbar-thumb {
  background: var(--color-outline-variant);
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-secondary);
}

/* WooCommerce adjustments */
.woocommerce-Price-currencySymbol {
  font-weight: normal;
  margin-right: 2px;
}

/* Hide spin buttons on number inputs */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input[type=number] {
  -moz-appearance: textfield;
}

/* Animation utilities */
@keyframes pulseSubtle {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.85; transform: scale(1.02); }
}
.animate-pulse-subtle {
  animation: pulseSubtle 2.5s infinite ease-in-out;
}