/* ===========================
   Modern Teal & Terra Theme
=========================== */

:root {

  
            --primary: #0F766E;       /* Deep Teal (المحافظة على الثيم السابق) */
            --primary-light: #14B8A6;
            --accent: #EA580C;        /* Terra Cotta Orange */
            --accent-hover: #C2410C;
            --bg-body: #F8FAFC;
            --text-main: #1E293B;
            --text-light: #64748B;
            --white: #ffffff;
               --secondary: #14B8A6;     /* Sand Orange */
            --secondary-light: #14B8A6;
            --shadow-sm: 0 4px 6px -1px rgba(15, 118, 110, 0.08);
            --shadow-lg: 0 20px 25px -5px rgba(15, 118, 110, 0.15);
            --shadow-card: 0 10px 15px -3px rgba(15, 118, 110, 0.08);
            --radius: 24px;
             --hero-bg: linear-gradient(135deg, #f0fdfa 0%, #ccfbf1 30%, #fff7ed 70%, #ffedd5 100%);
    --hero-shape-1: rgba(20, 184, 166, 0.35);
    --hero-shape-2: rgba(234, 88, 12, 0.2);
    --hero-shape-3: rgba(15, 118, 110, 0.12);
        }


       header {
 background: rgba(255,255,255, 0.9);
      }
         .btn-primary { background: var(--primary); color: var(--white); border: none; box-shadow: 0 4px 14px rgba(15, 118, 110, 0.3); }


        .subdomain-input-group {
            display: flex; align-items: center; background: var(--bg-body);
border: 2px dashed #cbd5e1; border-radius: 12px; padding: 0.8rem 1rem;        }