/* Color Palette:
   - Primary (Clinical Blue): #007bff
   - Secondary (Soft Gray): #f8f9fa
   - Text/Border: #495057
   - Success/Highlight: #28a745
*/

/* --- Hero Section Improvement --- */
.shifa-hero{
  height: 280px; /* Increased height */
  border: 1px solid #dee2e6; /* Solid, lighter border */
  border-radius: 8px; /* Slightly rounded corners */
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e9ecef; /* Very light gray background */
  color: #495057; /* Darker text for contrast */
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 20px; /* Increased margin */
  padding: 12px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1); /* Subtle shadow for depth */
}

/* --- Content Box Improvement --- */
.shifa-box{
  background: #fff;
  padding: 20px; /* Increased padding */
  border-radius: 10px; /* More rounded corners */
  border-left: 5px solid #007bff; /* Accent color on the left */
  box-shadow: 0 2px 4px rgba(0,0,0,0.05); /* Soft shadow */
  margin-bottom: 20px;
}

/* --- Doctor Circle Image Improvement --- */
.shifa-circle{
  width: 160px; /* Slightly larger */
  height: 160px;
  border-radius: 50%;
  display: block;
  margin: 0 auto 20px; /* Increased bottom margin */
  object-fit: cover;
  background: #f8f9fa; /* Soft background */
  border: 4px solid #007bff; /* Primary color border */
  box-shadow: 0 0 0 8px rgba(0, 123, 255, 0.1); /* Glow effect with primary color */
}

/* --- Gallery Layout Improvement --- */
.shifa-gallery{
  display: flex;
  flex-wrap: wrap;
  gap: 15px; /* Increased gap */
  padding: 10px;
  background: #f8f9fa; /* Soft gray background for the gallery area */
  border-radius: 8px;
}

/* --- Video Consultation Box Improvement --- */
.shifa-video{
  height: 400px; /* Increased height for better video view */
  background: #343a40; /* Darker, more professional background */
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  font-size: 1.2em;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); /* Inner shadow for depth */
}

/* --- General Form and Typography Enhancements (for consistency) --- */
/* Targeting elements in shortcodes for a cleaner look */
.shifa-about h2, .shifa-about h3, .shifa-about a {
    color: #007bff; /* Primary color for headings and links */
}

form#shifa-book-form, form#shifa-comment-form {
    background: #fff;
    padding: 20px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

form#shifa-book-form input[type="text"],
form#shifa-book-form input[type="email"],
form#shifa-book-form input[type="date"],
form#shifa-book-form select,
form#shifa-comment-form input[type="text"],
form#shifa-comment-form input[type="email"],
form#shifa-comment-form select,
form#shifa-comment-form textarea {
    width: 100%;
    padding: 10px;
    margin-top: 5px;
    margin-bottom: 10px;
    border: 1px solid #ced4da;
    border-radius: 4px;
}

form#shifa-book-form button[type="submit"],
form#shifa-comment-form button[type="submit"] {
    background-color: #28a745; /* Success/Highlight color for buttons */
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1em;
    transition: background-color 0.3s ease;
}

form#shifa-book-form button[type="submit"]:hover,
form#shifa-comment-form button[type="submit"]:hover {
    background-color: #218838;
}