/*
Theme Name: Urdu Coverage
Theme URI: https://www.urducoverage.com
Author: Urdu Coverage
Author URI: https://www.urducoverage.com
Description: Custom RTL Urdu portal theme for Urdu Coverage
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Private
Text Domain: urducoverage
Tags: rtl-language, urdu, news, portal
*/

/* =============================================
   URDU COVERAGE — MAIN STYLESHEET
   All section-specific styles are in /css/
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic:wght@400;500;700&display=swap');

/* ---- CSS Variables ---- */
:root {
    --font-main: 'Noto Naskh Arabic', serif;

    /* Base colors */
    --color-black:     #1a1a1a;
    --color-white:     #ffffff;
    --color-grey-1:    #f5f5f5;
    --color-grey-2:    #e0e0e0;
    --color-grey-3:    #aaaaaa;
    --color-text:      #1a1a1a;
    --color-text-light:#555555;

    /* Accent — one color for whole site */
    --color-accent:    #c0392b;
    --color-accent-hover: #a93226;

    /* Section colors */
    --color-news:      #c0392b;
    --color-islam:     #1D9E75;
    --color-poetry:    #7F77DD;
    --color-library:   #BA7517;
    --color-jobs:      #378ADD;
    --color-education: #639922;

    /* Spacing */
    --header-height:   52px;
    --container-width: 1200px;
    --gap:             16px;
    --radius:          6px;

    /* Typography */
    --font-size-xl:    28px;
    --font-size-lg:    22px;
    --font-size-md:    18px;
    --font-size-base:  16px;
    --font-size-sm:    14px;
    --font-size-xs:    12px;
    --line-height:     1.9;
}

/* ---- Reset ---- */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    direction: rtl;
    lang: ur;
}

body {
    font-family: var(--font-main);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-white);
    line-height: var(--line-height);
    -webkit-font-smoothing: antialiased;
}

a {
    color: var(--color-text);
    text-decoration: none;
}

a:hover {
    color: var(--color-accent);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

ul, ol {
    list-style: none;
}

/* ---- Container ---- */
.uc-container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--gap);
    width: 100%;
}

/* ---- Typography ---- */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-main);
    font-weight: 700;
    line-height: 1.7;
    color: var(--color-black);
}

p {
    line-height: var(--line-height);
    margin-bottom: 1rem;
}