/*===========================================
MEHRAB GROUP UI KIT - MAIN STYLESHEET
===========================================*/

/* ========== ALL @IMPORTS MUST BE FIRST ========== */
@import 'components/button.css';
@import 'components/card.css';
@import 'components/form.css';
@import 'components/table.css';
@import 'components/modal.css';
@import 'components/alert.css';
@import 'components/pagination.css';
@import 'components/breadcrumb.css';
@import 'components/header.css';
@import 'components/footer.css';
@import 'components/hero.css';
@import 'components/language_switcher.css';
@import 'components/management.css';
@import 'components/products.css';
@import 'components/projects.css';
@import 'components/quality.css';
@import 'components/search.css';
@import 'components/sidebar.css';
@import 'components/testimonials.css';
@import 'components/management_message.css';
@import 'components/about.css';
@import 'components/sectors.css';
@import 'components/industries.css';
@import 'components/contact.css';
@import 'components/faq.css';
@import 'components/team.css';
@import 'components/blog.css';

/* ========== ROOT VARIABLES ========== */
:root{
  --primary:#C41E3A;
  --primary-dark:#8B1530;
  --primary-light:#FCE8EC;
  --secondary:#1A2E6B;
  --secondary-dark:#0F1F4A;
  --secondary-light:#E8ECF5;
  --border:#D4D4D4;
  --background:#FFFFFF;
  --background-secondary:#F8F9FA;
  --text:#2D2D2D;
  --text-muted:#6B6B6B;
  --gray-bg:#F5F5F5;
  --success:#2E7D32;
  --success-dark:#1B5E20;
  --warning:#ED6C02;
  --warning-dark:#E65100;
  --shadow-sm:0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg:0 8px 24px rgba(0,0,0,0.12);
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:12px;
  --font-fa:'Yekan Bakh','Vazirmatn','IRANSans',Tahoma,sans-serif;
  --container:1340px;
  --spacing-xs:4px;
  --spacing-sm:8px;
  --spacing-md:16px;
  --spacing-lg:24px;
  --spacing-xl:32px;
  --spacing-xxl:48px;
}

/* Dark Theme Support (اختیاری) */
[data-theme="dark"]{
  --background:#1a1a1a;
  --background-secondary:#2d2d2d;
  --text:#ffffff;
  --text-muted:#b0b0b0;
  --border:#404040;
  --gray-bg:#2d2d2d;
}

/* ========== FONTS ========== */
@font-face{
  font-family:'Yekan Bakh';
  src:url('/static/fonts/YekanBakh-Light.ttf') format('truetype');
  font-weight:300;
  font-display:swap;
}

@font-face{
  font-family:'Yekan Bakh';
  src:url('/static/fonts/YekanBakh-Regular.ttf') format('truetype');
  font-weight:400;
  font-display:swap;
}

@font-face{
  font-family:'Yekan Bakh';
  src:url('/static/fonts/YekanBakh-Medium.ttf') format('truetype');
  font-weight:500;
  font-display:swap;
}

@font-face{
  font-family:'Yekan Bakh';
  src:url('/static/fonts/YekanBakh-Bold.ttf') format('truetype');
  font-weight:700;
  font-display:swap;
}

/* ========== RESET & BASE ========== */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:var(--font-fa);
  color:var(--text);
  background:var(--background);
  line-height:1.5;
  font-size:16px;
  transition:background 0.3s ease,color 0.3s ease;
}

/* ========== CONTAINER ========== */
.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--spacing-md);
}

/* ========== LINKS ========== */
a{
  text-decoration:none;
  color:var(--secondary);
  transition:color 0.2s ease;
}

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

/* ========== TYPOGRAPHY ========== */
h1,h2,h3,h4,h5,h6{
  font-weight:600;
  line-height:1.3;
  color:var(--secondary-dark);
  margin-bottom:var(--spacing-md);
}

h1{font-size:32px;}
h2{font-size:28px;}
h3{font-size:24px;}
h4{font-size:20px;}
h5{font-size:18px;}
h6{font-size:16px;}

/* ========== UTILITY CLASSES ========== */
.text-center{text-align:center;}
.text-right{text-align:right;}
.text-left{text-align:left;}
.text-muted{color:var(--text-muted);}

.mt-1{margin-top:var(--spacing-sm);}
.mt-2{margin-top:var(--spacing-md);}
.mt-3{margin-top:var(--spacing-lg);}
.mt-4{margin-top:var(--spacing-xl);}

.mb-1{margin-bottom:var(--spacing-sm);}
.mb-2{margin-bottom:var(--spacing-md);}
.mb-3{margin-bottom:var(--spacing-lg);}
.mb-4{margin-bottom:var(--spacing-xl);}

.p-1{padding:var(--spacing-sm);}
.p-2{padding:var(--spacing-md);}
.p-3{padding:var(--spacing-lg);}
.p-4{padding:var(--spacing-xl);}

.d-flex{display:flex;}
.d-grid{display:grid;}
.flex-wrap{flex-wrap:wrap;}
.justify-between{justify-content:space-between;}
.justify-center{justify-content:center;}
.align-center{align-items:center;}
.gap-1{gap:var(--spacing-sm);}
.gap-2{gap:var(--spacing-md);}
.gap-3{gap:var(--spacing-lg);}

.w-100{width:100%;}
.h-100{height:100%;}

/* Grid System */
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:var(--spacing-lg);
}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

.rounded-sm{border-radius:var(--radius-sm);}
.rounded-md{border-radius:var(--radius-md);}
.rounded-lg{border-radius:var(--radius-lg);}

.cursor-pointer{cursor:pointer;}
.overflow-hidden{overflow:hidden;}
.position-relative{position:relative;}
.position-absolute{position:absolute;}

.hover-lift:hover{
  transform:translateY(-2px);
  transition:transform 0.2s ease;
}

/* ========== RESPONSIVE ========== */
@media (max-width:1024px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:768px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  .container{padding:0 var(--spacing-md);}
  h1{font-size:28px;}
  h2{font-size:24px;}
  h3{font-size:20px;}
}
