/**
 * Page - Custom CSS overrides
 */
.specialities-accordion .accordian-1{
	background-color: #2B286F!important;
}
.specialities-accordion .accordian-2{
	background-color: #3A3692;
}

.specialities-accordion .accordian-3{
	background-color: #4641B4;
}
.specialities-accordion .accordian-4{
	 background-color: #514CD0;
}
.specialities-accordion .accordian-5{
	background-color: #5B54EB;
}
.specialities-accordion .accordian-6{
	background-color: #6A63F9;
}
.specialities-accordion .accordian-7{
	background-color: #7E78FF;
}
.specialities-accordion .accordian-8{
	background-color: #918CFF;
}
.specialities-accordion .accordian-9{
	background-color: #A6A2FF;
}
.specialities-accordion .accordian-10{
	background-color: #A6A2FF;
}
#edit-gender label {
	color: #fff;
}
/* The design asked for justified body copy and the build carries `text-justify`
   in 27 places. In a column this narrow, justification opens rivers: measured
   word-space stretch within a single paragraph was 3.1px to 34.4px (11.1x) at
   375, 9.1x on International Patients, and still 7.7x at 1440.

   The `word-spacing: -1px` here was an attempt to compensate, but it shrinks the
   BASE space and so widens the contrast against a stretched line — it made the
   gaps read worse, not better. Dropped.

   Left-align instead. Arjun called the justified setting on 2026-08-12, so this
   deliberately overrides the design. Left align cannot overflow or clip, it only
   removes the line-length stretching.

   The selector is doubled on purpose. The Tailwind Play CDN loads AFTER this file
   and emits its utilities with `!important`, so a plain `.text-justify` here has
   the SAME specificity and loses the tie on cascade order — `!important` does not
   help. Repeating the class raises specificity to 0,2,0 and wins. Verified with
   getComputedStyle, not by reading the file back.

   RE-APPLIED 2026-08-25: this shipped on 2026-08-12 but never reached the server,
   which still served the word-spacing version. See RESPONSIVE-HOME-E2E.md F0. */
.text-justify.text-justify {
    text-align: left !important;
}
.about-hero{
	padding: 0px !important;
}
section:not(.blogs-search, .blog-summary, .blogs-hero, .innov-hero, .about-hero, .newsmedia-hero, .understanding-cataract){
	padding-top:20px !important;
	padding-bottom:20px !important;
	margin-top:0px !important;
	margin-bottom:0px !important;
}

button, a, .form-submit{
	cursor:pointer !important;
}
.page-node-type-city-hyperlocal table{
    background: #f6f6f6 !important;
    border: 1px solid #bbb !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
}

.page-node-type-city-hyperlocal table tr td {
    padding: 10px;
    text-align: left;
}

.page-node-type-city-hyperlocal .city-content {
	margin-top: 15px;
	margin-bottom: 15px;
	line-height: 46px;
	font-size: 25px;
}
.page-node-type-city-hyperlocal .wp-block-list {
  margin-left: 20px;
}
.page-node-type-city-hyperlocal h2 {
	line-height: 80px;
	font-weight: 300;
	font-size: 40px;
	margin-bottom: 20px;
	margin-top: 20px;
}

.city-content h3 {
	line-height: 39.6px;
	font-weight: 400;
	font-size: 33px;
}

.page-node-type-city-hyperlocal p strong, .page-node-type-city-hyperlocal p b {
  font-weight: 500 !important;
  font-size: 20px !important;
}

.page-node-type-city-hyperlocal table b, .page-node-type-city-hyperlocal table strong {
    font-weight: 600 !important;
}

/* Base Table Design */
.page-node-type-city-hyperlocaltable {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 15px;
  text-align: left;
  background-color: #ffffff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  border: 1px solid #e2e8f0;
  font-family: inherit;
}

/* Force Table to 100% Width */
.city-content table {
  width: 100% !important;
  max-width: 100% !important;
  display: table !important;
  table-layout: fixed; /* कॉलम को बराबर बांटने के लिए */
}

/* Drupal / CKEditor Wrappers Alignment */
.city-content figure.table,
.city-content .field--type-text-long table,
.city-content .field--name-body table {
  width: 100% !important;
  max-width: 100% !important;
}

/* Header Styling */
.city-content thead tr {
  background-color: #2b286f !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* Cell Padding & Borders */
.city-content th, td {
  padding: 14px 18px !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

/* Zebra Striping (Alternate Row Colors) */
.city-content tbody tr:nth-of-type(even) {
  background-color: #f8fafc !important;
}

/* Row Hover Effect */
.city-content tbody tr:hover {
  background-color: #f1f5f9 !important;
  transition: background-color 0.2s ease !important;
}

.engt {
    height: unset !important;
    padding: 0 !important;
    touch-action: pan-x pan-y;
}

.engt.engt-font-md {
    font-size: 14px;
    padding: 0 !important;
}

/* ==========================================
   Mobile Responsive Style (< 768px)
   ========================================== */
@media (max-width: 768px) {
  .city-content table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch !important; /* Smooth touch scrolling for iOS */
  }

  /* Fix: dono elements (.city-content th aur .city-content td) ko properly scope kiya gaya hai */
  .city-content th, 
  .city-content td {
    padding: 10px 14px;
    font-size: 14px;
    line-height: 20px;
    white-space: normal; /* cells ke andar multi-line text ko aapas mein overlap hone se rokega */
  }
}

@media (max-width: 1024px) {
	.spec-item h3.font-heading {
		display:none;
	}
	.innov-hero h1 {
		font-size: 24px !important;
		line-height: 32px !important;
	}
	.innov-hero p {
		font-size: 16px !important;
		line-height: 26px !important;
	}
}

/* This rule forces the why-card body text visible for the MOBILE stacked
   layout. Its bound was `max-width: 1024px`, which INCLUDES 1024 — the exact
   width where the card switches to the desktop layout and positions the title
   and the body absolutely at the same coordinates. The result was the title and
   the body drawn on top of each other (73px overlap) at 1024 only. It loads
   after custom.css with higher specificity, so it beat the hover rule there.
   Bound moved to 999px so it stops before the desktop layout begins.

   RE-APPLIED 2026-08-25: shipped 2026-08-12, never reached the server. */
@media (max-width: 999px) {
	.specialities-why-card .text-black.hidden {
		opacity: 1 !important;
		display:block;
	}
}