/**** new 2-column layout for oudnad and naji **/
@font-face {
font-family: 'Noto Naskh Arabic';
src: url('../polices/noto-naskh-arabic-v36-arabic_latin-regular.woff2') format('woff2');
font-display: swap;
}
body {

font-family: 'Noto Naskh Arabic', serif;
text-align: justify;
line-height: 1.55;
}
.sommaire_pg {
margin: auto;
text-align: center;
width: 960px;
}
main {
display: grid;
grid-template-columns: 73% 27%;
gap: 1rem;
overflow: hidden; /* Contains floats */
}
/* Optional: Ensure children inherit box-sizing */
main * {
box-sizing: inherit;
}
.wrapper {
display: contents; /* Key magic - makes grid "skip" this element */
}
aside {
float: none !important;   /* Disable SPIP’s float */
width: auto !important;  /* Let Grid control width */
margin: 0 !important;    /* Remove any SPIP margins */
padding: .8rem;
}
/** css by claud **/
/* Literary Magazine Theme - Classic & Respectable */
.page {
background: #f0e6d2; /** #f9f6f1; refined off-white, warm tone */
border: 1px solid #ccc;
padding: .5rem;
}
.header {
background: #e6e1dc; /* parchment-like tone */
text-align: center;
padding: .5rem;
}
.main {
background: #ffffff;
padding: .5rem;
}
.wrapper {
background: #f4f1ed;
padding: .5rem;
}
.content {
background: #ffffff;
padding: .5rem;
}
.aside {
background: #f5f3ef;
padding: .5rem;
}
.footer {
background: #e6e1dc;
text-align: center;
padding: 1rem;
}
.footer_onmag {
margin: .25rem;
}
/* ======== Banner Mast =============== */
.mag-title {
color: coffee;
font-size: 2.9rem;
margin-bottom: 0.4rem;
text-align: center;
text-shadow: 1px 1px 2px gold, 0 0 1rem brown, 0 0 0.2rem brown;
}
.mag-subtitle, .mag-issn, .mag-publisher {
text-align: center;
margin-bottom: 0.4rem;
}
.mag-subtitle {
font-size: 1.50rem;
}
.mag-issn {
font-size: 1.1rem;
}
.mag-publisher {
font-size: 1.25rem;
margin-bottom: 0.5rem;
}
/* ========== TOP Navigation Under Header ========== */
.topnav {
background-color: #2d2d2d;
overflow: hidden;
padding: .25rem;
}
.topnav a {
color: #f0f0f0;
font-size: 17px;
font-weight: bold;
padding: 14px 16px;
text-align: center;
text-decoration: none;
}
.topnav a:hover {
background-color: #dcdcdc;
color: #000;
}
.topnav a.active {
background-color: #5a9475;
color: white;
}


/* Mobile stacking */
@media (max-width: 767px) {
main {
display: flex;          /* Switch to flexbox for mobile */
flex-direction: column; /* Vertical stack */
}
aside {
order: 1;              /* Forces aside below content */
margin-top: 1rem;      /* Adds space between content/aside */
}
footer {
order: 2;              /* Ensures footer stays at bottom */
}
}

.error::before {
content: ''; /* Default: no symbol */
margin-inline-start: 0.5em;
}
.error.valid::before {
content: '✔'; /* Green check */
color: green;
font-size: 1.25rem;
}
.error.invalid::before {
content: '✖'; /* Red X */
color: red;
font-size: 1.25rem;
}
.form_outer_container {
background: #3b1b08;
border: 1px solid black;
margin: auto;
padding: .5rem;
text-align: center;
width: 100%;
}
/* Force RTL alignment for info section */
.basic_info,
.form_info {
background: mintcream;
border: 2px dotted black;
color: black;
direction: rtl;
text-align: right; /* Fallback */
margin-inline-start: 0; /* Reset any left margin */
margin-inline-end: auto; /* Push to right */
margin-bottom: 1rem;
padding: 1rem;
}
.form_wrapper {
text-align: right;
}
fieldset.form_group_basic_info {
background-color: white;
margin-bottom: 1rem;
}
fieldset.form_group_sender {
background-color: azure;
}
fieldset.form_group_salute,
fieldset.form_group_checkbox {
background-color: #f5f5dc;
}
fieldset.form_group_message {
background-color: #ffe5f5;
}
fieldset.form_group_uploads {
background-color: linen;
}
fieldset.form_group_submit {
background-color: mintcream;
}
fieldset.form_group_math {
background-color: lavender;
margin-bottom: 1rem;
}
fieldset {
background-color: whitesmoke;
margin: 1rem;
}
legend {
background-color: navy;
border: solid 2px green;
color: white;
padding: 5px 10px;
}
.form_group_info {
text-align: right;
}
.field_block, upload_notice {
color: black;

}
textarea {
  overflow: auto;
}
/* Style inputs, select elements and textareas */
input[type=text],
input[type=email], 
select, 
input[type=file] {
width: 94%;
color: #444;
padding: 1rem;
background: #fff;
border: 1px solid #555;
}
.salute_editor {
background: whitesmoke;
border: 2px dotted #cc0000;
border-radius: .5rem;
color: navy;
font-size: 1.2rem;
font-weight: 700;
height: 4rem;
line-height: 1.5;
outline: none;
padding: .75rem;
resize: vertical;
width: 94%;
}
.salute_editor:hover {
cursor: pointer;
background: azure;
}
.salute_editor:focus {
color: black;
}
.message_brief {
background: whitesmoke;
border: 2px dotted #cc0000;
border-radius: .5rem;
color: navy;
font-size: 1.2rem;
font-weight: 700;
height: 15rem;
line-height: 1.5;
outline: none;
padding: .75rem;
resize: vertical;
width: 94%;
}
.message_brief:hover {
cursor: text;
background: azure;
}
.message_brief:focus {
color: black;
cursor: text;
}
.counter {
color: black;
}
.policy_terms {
background: whitesmoke;
border: 2px dotted #cc0000;
border-radius: .5rem;
color: navy;
font-size: 1rem;
font-weight: 700;
height: 360px;
line-height: 1.5;
outline: none;
overflow: auto;

padding: .75rem;
resize: vertical;
width: 94%;
}
.policy_terms:hover {
cursor: pointer;
background: azure;
}
.policy_terms:focus {
color: black;
}
.upload {
height: 3rem;
}
input[type=file]::file-selector-button {
margin-right: 20px;
border: solid 2px red;
background: maroon;
padding: 10px 20px;
border-radius: 10px;
color: #fff;
cursor: pointer;
}
input[type=file]::file-selector-button:hover {
background: #0d45a5;
}
input {
height: 2rem;
width: 100%;
}
label.inline_label {
display: inline-flex;
align-items: right;
gap: 0.5em; /* This gives breathing room between checkbox and text */
}
/* Checkbox styling */
.form_field_checkbox {
margin: 20px 0;
}
input[type="checkbox"] {
width: auto;
margin-left: 10px;
transform: scale(1.2);
}
.checkbox_label {
font-size: 1.2rem;
color: #333;
cursor: pointer;
display: inline-block;
line-height: 1.4;
text-align: right;
direction: rtl;
}
.checkbox_instruction {
display: block;
font-size: 14px;
color: #666;
margin-top: 5px;
text-align: right;
direction: rtl;
}
label {
display: block;
margin-bottom: .5rem;
}
.submit_btn {
/* Existing styles (keep these) */
background: green;
color: white;
border: none;
padding: 12px 25px;
font-size: 1.1em;
cursor: pointer;
/* New enhancements */
min-width: 200px; /* Wider minimum size */
padding: 15px 30px; /* Taller + wider */
font-size: 1.3em; /* Bigger text */
font-weight: bold; /* Bold Arabic */
letter-spacing: 1px; /* Better Arabic spacing */
transition: all 0.3s; /* Smooth hover effects */
}
.submit_btn:hover {
background: #990000; /* Darker red on hover */
transform: scale(1.02); /* Subtle grow effect */
}