/*
Theme Name: DoctorsIndia
Theme URI: https://doctorsindia.com
Author: I.Dsign
Author URI: https://idsign.in
Description: A public directory + professional network for doctors in India — IMDb × LinkedIn for doctors. Custom post types (di_doctor, di_hospital, di_review), doctor/patient front-end dashboards, admin-moderated verification & reviews, Contact Form 7 driven forms, and a fully Customizer-driven design system. Built for the free version of ACF.
Version: 1.0.0
Requires at least: 6.2
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: doctorsindia
*/

/* ============================================================
   DESIGN TOKENS
   Every token is a CSS custom property so the WordPress
   Customizer (Appearance > Customize > DoctorsIndia Colors /
   Typography) can override any of them live. Nothing here is
   hardcoded into PHP — templates only use these variables.
   The defaults below mirror the design handoff tokens.
   ============================================================ */
:root {
  /* Brand blues */
  --di-primary: #1256A0;
  --di-primary-dark: #0C3D73;
  --di-primary-darkest: #0A2E57;

  /* Ink / text */
  --di-ink: #0A1B2E;
  --di-body: #33465C;
  --di-muted: #5A6B7B;
  --di-faint: #8A98A6;

  /* Backgrounds */
  --di-bg-content: #F7F9FC;
  --di-bg-app: #EDF0F4;
  --di-bg-card: #FFFFFF;
  --di-fill: #F1F4F8;
  --di-fill-2: #F7F9FC;

  /* Borders */
  --di-border: #E3E9F0;
  --di-border-inner: #EEF2F7;
  --di-border-blue: #CBD9EA;

  /* Success / verified */
  --di-success: #1E7A4C;
  --di-success-2: #1E8E5A;
  --di-success-bg: #E7F6EE;
  --di-success-border: #B6E3C9;

  /* Pending / amber */
  --di-amber: #8A6A1E;
  --di-amber-text: #7A5A12;
  --di-amber-bg: #FFF3DF;
  --di-amber-bg-2: #FFF9EC;
  --di-amber-border: #F0DFB5;

  /* Danger */
  --di-danger: #B4423F;
  --di-danger-2: #E5484D;
  --di-danger-border: #EBC9C8;

  /* Accents */
  --di-star: #F2C24B;
  --di-chip-bg: #EAF1FA;
  --di-chip-text: #0C3D73;

  /* Radius */
  --di-radius-card: 14px;
  --di-radius-input: 10px;
  --di-radius-btn: 8px;
  --di-radius-pill: 999px;

  /* Shadow */
  --di-shadow-rest: 0 1px 2px rgba(10,27,46,0.05);
  --di-shadow-hover: 0 18px 40px -20px rgba(10,27,46,0.4);
  --di-shadow-sticky: 0 10px 30px -18px rgba(10,27,46,0.25);

  /* Fonts */
  --di-font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
  --di-font-body: 'Public Sans', system-ui, -apple-system, sans-serif;

  /* Layout widths */
  --di-w-content: 1200px;
  --di-w-profile: 1128px;
  --di-w-browse: 1280px;
}

/* ============================================================
   BASE
   ============================================================ */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--di-font-body);
  color: var(--di-ink);
  background: var(--di-bg-content);
  -webkit-font-smoothing: antialiased;
  font-size: 15px;
  line-height: 1.5;
}
body.di-app { background: var(--di-bg-app); }

a { color: var(--di-primary); text-decoration: none; }
a:hover { color: var(--di-primary-dark); }
img { max-width: 100%; height: auto; }
button { font-family: var(--di-font-body); }

h1, h2, h3, h4 { font-family: var(--di-font-display); letter-spacing: -0.01em; }

.di-container { max-width: var(--di-w-content); margin: 0 auto; padding-left: 32px; padding-right: 32px; }

/* Animations */
@keyframes diFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes floaty { from { transform: translateY(6px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.di-fade { animation: diFade .25s ease; }

/* Screen-reader only */
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute; word-wrap: normal !important;
}

/* WP required alignment classes */
.alignleft { float: left; margin-right: 1.5em; }
.alignright { float: right; margin-left: 1.5em; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}
