/**
 * Kingwork Typography System
 * Unified font sizes across all pages (Homepage, HRM, CRM, WMS)
 * 
 * Font Size Scale:
 * - H1: 40px
 * - Subtitle: 18px
 * - H2: 36px
 * - H3: 30px
 * - Label: 18px
 * - Body: 14px
 */

/* ================================
   Base Typography Reset
   ================================ */
.kw-page-wrapper,
.kw-crm-page-wrapper,
.kw-hrm-page-wrapper,
.kw-wms-page-wrapper,
.home-page-template {
    font-size: 14px;
    line-height: 1.6;
}

/* ================================
   H1 - Main Title (40px)
   ================================ */
.kw-page-wrapper h1,
.kw-crm-page-wrapper h1,
.kw-hrm-page-wrapper h1,
.kw-wms-page-wrapper h1,
.home-page-template h1,
.kw-h1,
.section-title-h1,
.hero-title,
.kw-hero-title,
.title-overview,
.kw_overview .title-overview {
    font-size: 40px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
}

/* ================================
   Subtitle (18px)
   ================================ */
.kw-subtitle,
.section-subtitle,
.hero-subtitle,
.kw-hero-subtitle,
.description-overview,
.kw_overview .description-overview,
.kw-page-wrapper .section-header p,
.kw-crm-page-wrapper .section-header p,
.kw-hrm-page-wrapper .section-header p,
.kw-wms-page-wrapper .section-header p {
    font-size: 18px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
}

/* ================================
   H2 - Section Title (36px)
   ================================ */
.kw-page-wrapper h2,
.kw-crm-page-wrapper h2,
.kw-hrm-page-wrapper h2,
.kw-wms-page-wrapper h2,
.home-page-template h2,
.kw-h2,
.section-title,
.kw-section-title,
.title_why_choose p,
.title_new_benefit {
    font-size: 36px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

/* ================================
   H3 - Card/Item Title (30px)
   ================================ */
.kw-page-wrapper h3,
.kw-crm-page-wrapper h3,
.kw-hrm-page-wrapper h3,
.kw-wms-page-wrapper h3,
.home-page-template h3,
.kw-h3,
.card-title,
.kw-card-title {
    font-size: 30px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
}

/* ================================
   Label (18px)
   ================================ */
.kw-label,
.form-label,
.kw-form-label,
.stat-label,
.kw-stat-label,
.badge,
.kw-badge {
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
}

/* ================================
   Body Text (14px)
   ================================ */
.kw-page-wrapper p,
.kw-crm-page-wrapper p,
.kw-hrm-page-wrapper p,
.kw-wms-page-wrapper p,
.home-page-template p,
.kw-body,
.kw-text,
.card-text,
.kw-card-text,
.description_box_why_choose {
    font-size: 14px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
}

/* ================================
   Responsive Adjustments
   ================================ */
@media screen and (max-width: 768px) {

    /* H1 - Mobile */
    .kw-page-wrapper h1,
    .kw-crm-page-wrapper h1,
    .kw-hrm-page-wrapper h1,
    .kw-wms-page-wrapper h1,
    .home-page-template h1,
    .kw-h1,
    .section-title-h1,
    .hero-title,
    .kw-hero-title,
    .title-overview {
        font-size: 28px !important;
        line-height: 1.3 !important;
    }

    /* Subtitle - Mobile */
    .kw-subtitle,
    .section-subtitle,
    .hero-subtitle,
    .kw-hero-subtitle,
    .description-overview {
        font-size: 16px !important;
    }

    /* H2 - Mobile */
    .kw-page-wrapper h2,
    .kw-crm-page-wrapper h2,
    .kw-hrm-page-wrapper h2,
    .kw-wms-page-wrapper h2,
    .home-page-template h2,
    .kw-h2,
    .section-title {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }

    /* H3 - Mobile */
    .kw-page-wrapper h3,
    .kw-crm-page-wrapper h3,
    .kw-hrm-page-wrapper h3,
    .kw-wms-page-wrapper h3,
    .home-page-template h3,
    .kw-h3,
    .card-title {
        font-size: 22px !important;
    }

    /* Label - Mobile */
    .kw-label,
    .form-label,
    .stat-label,
    .badge {
        font-size: 16px !important;
    }

    /* Body - Mobile */
    .kw-page-wrapper p,
    .kw-crm-page-wrapper p,
    .kw-hrm-page-wrapper p,
    .kw-wms-page-wrapper p,
    .home-page-template p,
    .kw-body,
    .kw-text,
    .card-text {
        font-size: 14px !important;
    }
}

/* ================================
   Utility Classes for quick use
   ================================ */
.kw-text-h1 {
    font-size: 40px !important;
}

.kw-text-h2 {
    font-size: 36px !important;
}

.kw-text-h3 {
    font-size: 30px !important;
}

.kw-text-subtitle {
    font-size: 18px !important;
}

.kw-text-label {
    font-size: 18px !important;
}

.kw-text-body {
    font-size: 14px !important;
}

/* Font Weight Utilities */
.kw-font-normal {
    font-weight: 400 !important;
}

.kw-font-medium {
    font-weight: 500 !important;
}

.kw-font-semibold {
    font-weight: 600 !important;
}

.kw-font-bold {
    font-weight: 700 !important;
}