/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.15.1764528270
Updated: 2025-11-30 18:44:30

*/

/* =========================================
   1. GLOBAL RESETS & FONTS
   ========================================= */
html, body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Arial, sans-serif;
  background-color: #f4f6f9;
  
 
}

*, *::before, *::after {
  box-sizing: inherit;
}

/* =========================================
   2. MAIN CONTAINER
   ========================================= */
.main_div_container {
  border: 1px solid #ced4da;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
  padding: 30px;
  width: 90%;
  max-width: 800px;
  margin: 50px auto;
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
  
  /* RTL Settings */
  direction: rtl;
  text-align: right;
}

/* =========================================
   3. MESSAGE BOX
   ========================================= */
.div_message {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 25px auto;
  padding: 15px;
  background-color: #e6f2ff;
  border: 1px solid #cce5ff;
  border-radius: 6px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  color: #004085;
}

/* =========================================
   4. STANDARD HTML TABLE STYLES
   ========================================= */
.general_table_classs {
  width: 100%;
  border-collapse: separate; /* Allows border radius */
  border-spacing: 0;
  margin-top: 20px;
  background-color: #fff;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  overflow: hidden;
}

.general_table_classs caption {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
  background-color: #d4edda;
  text-align: center;
  padding: 12px;
  color: #155724;
  border-radius: 6px;
}

.general_table_classs th,
.general_table_classs td {
  border: 1px solid #dee2e6;
  padding: 12px 15px;
  text-align: right;
  vertical-align: middle;
  word-break: break-word;
}

.general_table_classs th {
  background-color: #f8f9fa;
  color: #333;
  font-weight: bold;
}

/* --- Table Footer --- */
.general_table_classs tfoot {
  background-color: #e9ecef;
  font-weight: bold;
  border-top: 2px solid #ccc;
}

.general_table_classs tfoot td {
  border-top: 1px solid #aaa;
  text-align: center; /* Center content in footer */
  padding: 15px;
  color: #495057;
}

/* =========================================
   5. DIV-BASED TABLE STYLES
   ========================================= */

/* Caption */
.div_table_caption {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
  background-color: #f8f9fa;
  padding: 12px;
  text-align: center;
  border-bottom: 1px solid #e9ecef;
  color: #333;
  border-radius: 6px 6px 0 0;
}

/* Header Row */
.div_table_row_header {
  display: grid;
  grid-template-columns: 30% 70%;
  background-color: #343a40;
  font-weight: bold;
  border-bottom: 1px solid #e9ecef;
  color: #fff;
  padding: 12px 15px;
  align-items: center;
  text-align: center;
}

/* Body Row */
.div_table_row {
  display: grid;
  grid-template-columns: 30% 70%;
  border-bottom: 1px solid #eee;
  padding: 0; /* Reset padding, handled by cells */
  align-items: stretch; /* Make cells equal height */
  background-color: #fff;
}
.div_table_row:last-child {
  border-bottom: none;
}

/* Cells */
.div_table_cell {
  padding: 10px 15px;
  display: flex;
  align-items: center;
  min-width: 0;
  word-break: break-word;
}

/* Label Cell (Left Column) */
.div_table_cell_label {
  padding: 10px 15px;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: bold;
  background-color: #f1f8ff; /* Light Blue */
  color: #004085;
  border-left: 1px solid #dee2e6; /* RTL Separator */
  text-align: right;
  min-width: 0;
  word-break: break-word;
}

/* Footer Row */
.div_table_row_footer {
  display: flex;
  justify-content: center;
  background-color: #e9ecef;
  font-weight: bold;
  border-top: 2px solid #ced4da;
  color: #333;
  padding: 15px;
}

/* =========================================
   6. FORMS & INPUTS
   ========================================= */
.main_div_container fieldset {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 15px;
  border: 2px solid #dee2e6;
  padding: 20px;
  margin-bottom: 25px;
  border-radius: 6px;
  background-color: #fcfcfc;
  width: 100%;
}

.main_div_container legend {
  font-size: 16px;
  font-weight: bold;
  padding: 0 10px;
  color: #007bff;
  background-color: #fff;
  border-radius: 4px;
}

.main_div_container label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
  color: #333;
  cursor: pointer;
}

/* Combined Input Styles */
.main_div_container input[type="text"],
.main_div_container input[type="email"],
.main_div_container input[type="password"],
.main_div_container input[type="number"],
.main_div_container input[type="url"],
.main_div_container input[type="date"],
.main_div_container input[type="time"],
.main_div_container input[type="search"],
.main_div_container input[type="tel"],
.main_div_container input[type="file"],
.main_div_container textarea,
.main_div_container select {
  width: 100%;
  padding: 10px;
  margin: 5px 0;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
  font-family: inherit;
  color: #333;
  background-color: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
}

/* Focus States */
.main_div_container input:focus,
.main_div_container textarea:focus,
.main_div_container select:focus {
  outline: none;
  border-color: #007bff;
  box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);
}

/* Select Arrow Fix (Left side for RTL) */
.main_div_container select {
  appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23333" d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position: left 10px center;
  background-size: 1em;
  padding-left: 30px;
}

/* =========================================
   7. BUTTONS (Corrected Width Logic)
   ========================================= */
.main_div_container input[type="submit"],
.main_div_container input[type="button"],
.main_div_container button {
  background-color: #007bff;
  color: #fff;
  border: none;
  padding: 12px 20px;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  border-radius: 4px;
  transition: background-color 0.3s ease;
  display: block; /* Ensure block behavior */
  min-width: 150px;
  width: 100%; /* Default to full width inside container */
  max-width: 400px; /* Limit width on large screens */
  margin: 10px auto; /* Center button */
  text-align: center;
}

.main_div_container input[type="submit"]:hover,
.main_div_container button:hover {
  background-color: #0056b3;
}

/* Special Reset for Footer Button to ensure it fills cell */
.general_table_classs tfoot button, 
.general_table_classs tfoot input[type="submit"],
#submit_insert_aa_vendors {
    width: 100%; /* Fill the footer cell */
    max-width: 400px; /* keep limit */
    margin: 0 auto;
}

/* =========================================
   8. RESPONSIVE MEDIA QUERIES (Mobile)
   ========================================= */
@media (max-width: 768px) {
  
  .main_div_container {
    padding: 15px;
    width: 95%;
  }

  /* --- HTML Tables Mobile Card View --- */
  .general_table_classs,
  .general_table_classs tbody,
  .general_table_classs tr,
  .general_table_classs td {
    display: block;
    width: 100%;
  }

  .general_table_classs thead {
    display: none;
  }

  .general_table_classs tr {
    margin-bottom: 15px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  }

  .general_table_classs td {
    display: flex;
    justify-content: space-between;
    align-items: right;
    text-align: right;
    padding-right: 1px; /* Space for the label */
    position: relative;
    border: none;
    border-bottom: 1px solid #eee;
    min-height: 45px;
  }
  
  .general_table_classs td:last-child {
    border-bottom: none;
  }

  /* Labels via data-label */
  .general_table_classs td::before {
    content: attr(data-label);
    position: absolute;
    right: 10px;
    font-weight: bold;
    color: #555;
    text-align: right;
    /*width: 40%;*/
  }

  /* --- Footer Fix for Mobile --- */
  .general_table_classs tfoot,
  .general_table_classs tfoot tr,
  .general_table_classs tfoot td {
      display: block;
      width: 100%;
      border: none;
  }
  
  .general_table_classs tfoot td {
      padding: 10px !important; /* Reset padding */
      padding-right: 10px !important; /* Override label spacing */
      text-align: center;
  }

  .general_table_classs tfoot td::before {
      content: none !important; /* Remove label logic for footer */
      display: none;
  }

  /* --- Div Tables Mobile --- */
  .div_table_row_header { display: none; }

  .div_table_row {
    display: flex;
    flex-direction: column;
    border: 1px solid #dee2e6;
    margin-bottom: 15px;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    background-color: #fff;
  }

  .div_table_cell_label {
    width: 100%;
    border-left: none;
    border-bottom: 1px solid #dee2e6;
    background-color: #f8f9fa;
    padding: 10px 15px;
  }

  .div_table_cell {
    width: 100%;
    padding: 15px;
    justify-content: flex-start;
  }
  
  /* Force Full Width Buttons on Mobile */
  .main_div_container input[type="submit"],
  .main_div_container button,
  #submit_insert_aa_vendors {
    max-width: 100%;
    width: 100% !important;
  }
}