﻿/*
 * Production Styles for Body-Only Content Display
 * 
 * MINIMAL VERSION - Contains ONLY styles for HTML that CKEditor actually produces
 * Cumulative cascade extracted from master-old.css for .clsContentText area
 * 
 * USE CASES:
 * - CKEditor iframe editing (editor.css uses these styles)
 * - Email templates (no wrapper div possible)
 * - Single-content landing pages
 * - Print versions
 * 
 * USAGE: <body>content</body> (no wrapper div needed)
 * 
 * NOTE: This is identical to editor.css but WITHOUT .cke_editable selectors.
 *       Styles are applied directly to elements for use in <body> context.
 * 
 * MAINTENANCE: Keep in sync with editor.css
 * LAST UPDATED: December 2024 - Added Arial enforcement
 */

/* ============================================================================
   BASE STYLES - CKEditor always produces these elements
   ============================================================================ */

/* Base body styles - merged body + .clsContentText from master-old.css */
body {
    text-align: right;
    direction: rtl;
    color: #000000;
    font-family: Arial; /* Primary font - all elements inherit from this */
    font-size: 15px;    /* From .clsContentText - bumped from 13px */
    line-height: 20px;  /* From .clsContentText */
    background-color: #fdfbf4;
    max-width: 660px;   /* From .clsContentText */
    margin: auto;
    padding: 25px;
}

/* Headings - CKEditor produces h1, h2, h3 */
h1 {
    color: #781f23;
    font-size: 18px;
    font-weight: bold;
    margin: 3px 0 5px 0;
}

h2 {
    color: #977b1a;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 10px 0;
}

h3 {
    color: #847b50;
    font-size: 15px;
    font-weight: bold;
    margin: 0 0 3px 0;
}

/* Paragraphs - CKEditor produces <p> */
p {
    padding: 0;
    margin: 0;
}

/* Links - CKEditor produces <a> (no classes). Removed pseudo classes because styles inlining for email ignores them */
a {
    color: #700308;
    text-decoration: underline;
}

/* Lists - CKEditor produces <ul> and <li> */
ul {
    padding: 0;
    margin: 5px 0 0 0;
}

li {
    padding: 0;
    margin-right: 17px;
}

/* Tables - CKEditor produces <table>, <tr>, <td> */
table, tr, td {
    color: #000000;
    font-family: Arial;  /* Needed: tables don't always inherit font correctly */
    font-size: small;
    vertical-align: top;
    border: 0;
    padding: 0;
    margin: 0;
    border-collapse: collapse;
    border-spacing: 0;
}

table {
    border: unset;
    border-collapse: collapse;
}

table td {
    padding: 5px;
    border: 1px solid #9E9E9E;
}

/* Horizontal rule - CKEditor produces <hr> */
hr {
    clear: both;
    height: 1px;
    color: #E5DFBB;
    font-size: 0;
    border: 0;
    border-top: 1px solid #E5DFBB;  /* Explicit border for visibility */
    background: transparent;
}

/* Images - CKEditor produces <img> (no classes) */
img {
    border: 0 none;
}

/* ============================================================================
   ARIAL FONT ENFORCEMENT - Prevent Times New Roman on bold formatting
   ============================================================================ */

/* Critical: Enforce Arial on bold/strong elements to prevent browser defaults */
strong, b {
    font-family: Arial;  /* Needed: some browsers change font on bold */
}

/* ============================================================================
   CUSTOM COLOR CLASSES - Applied via styleswitcher plugin
   These are the ONLY classes CKEditor can actually apply
   ============================================================================ */

.darkYellow, .efratDarkYellow {
    color: #847b50;
}

.lightYellow, .efratLightYellow {
    color: #977b1a;
}

.bordeaux, .efratBordeaux {
    color: #781f23;
}

/* ============================================================================
   HIGHLIGHTING - May be applied by search functionality
   ============================================================================ */

.marker {
    background-color: Yellow;
}

.searchTextSpan, .clsCorrect {
    background-color: #FDB458;
}
