/* ==========================================================================
   Additions for the editable home page message, services note,
   and the online intake form. Loaded after main.css.
   ========================================================================== */

/* ---------- Home page message (edited in /admin) ---------- */
.announcement {
    border: 3px solid #1c9898;
    border-radius: 6px;
    background: #f1fafa;
    padding: 18px 24px;
    margin: 30px 0 10px;
    max-width: 85%;
    box-sizing: border-box;
    text-align: center;
}
.content-1 .announcement h3 {
    font-family: 'FrederickatheGreat-Regular', serif;
    color: #1c9898;
    font-size: 2.6em;
    margin: 0 0 8px;
}
.content .announcement p {
    padding: 0;
    margin: 0 0 10px;
    line-height: 1.2;
}
.content .announcement p:last-child { margin-bottom: 0; }

/* ---------- Services page note (edited in /admin) ---------- */
.services-note {
    max-width: 85%;
    margin-top: 20px;
    text-align: center;
}
.services-note p { line-height: 1.2; }

/* ---------- Intake form ---------- */
.intake {
    width: 100%;
    max-width: 900px;
    font-size: 18px;
    line-height: 1.4;
    color: #262626;
}
.content .intake p { font-size: 18px; line-height: 1.45; padding: 0; margin: 0 0 14px; }
.content .intake p.intake-intro { font-size: 21px; margin: 20px 0 10px; }
.intake a { color: #1c9898; font-weight: bold; }
.intake form { margin-top: 10px; }
.intake-section {
    border: 0;
    border-top: 3px solid #1c9898;
    margin: 30px 0 0;
    padding: 12px 0 0;
    min-width: 0;
}
.intake-section legend {
    font-family: 'FrederickatheGreat-Regular', serif;
    color: #1c9898;
    font-size: 32px;
    padding: 0 12px 0 0;
}
.intake-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 4px 18px;
}
.intake-grid .fld { grid-column: span 6; margin: 8px 0; }
.intake-grid .fld.half { grid-column: span 3; }
.intake-grid .fld.third { grid-column: span 2; }
.intake-grid .fld.is-hidden { display: none; }
.intake-grid .fld[data-if] { padding-left: 22px; border-left: 3px solid #d7eeee; }

.intake form label,
.intake .q {
    display: block;
    font-family: 'UniversCom-67BoldCond', arial, sans-serif;
    font-weight: normal;
    color: #393939;
    font-size: 19px;
    margin: 0 0 4px;
}
.intake form label.opt {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'UniversCom-47LightCond', arial, sans-serif;
    font-weight: bold;
    font-size: 18px;
    color: #262626;
    margin: 4px 22px 4px 0;
    cursor: pointer;
}
.intake form label.opt input { width: 22px; height: 22px; margin: 0; accent-color: #1c9898; flex: none; }
.intake .checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.intake form label.agree { display: flex; align-items: flex-start; margin: 10px 0 16px; line-height: 1.35; }
.intake form label.agree input { margin-top: 2px; }

.content-1 .intake input[type=text],
.content-1 .intake input[type=email],
.content-1 .intake input[type=tel],
.content-1 .intake input[type=date],
.content-1 .intake textarea {
    font-family: arial, sans-serif;
    font-weight: normal;
    font-size: 18px;
    width: 100%;
    box-sizing: border-box;
    padding: 9px 10px;
    margin: 0;
    border: 2px solid #9a9a9a;
    border-radius: 4px;
    background: #fff;
}
.content-1 .intake textarea { height: auto; min-height: 80px; }
.content-1 .intake input:focus,
.content-1 .intake textarea:focus { outline: 2px solid #1c9898; border-color: #1c9898; }
.intake .req { color: #c22527; }

.intake-send { margin-top: 30px; border-top: 3px solid #1c9898; padding-top: 16px; }
.intake-buttons { display: flex; flex-wrap: wrap; gap: 14px; margin: 18px 0 10px; }
.intake-btn {
    font-family: 'FrederickatheGreat-Regular', serif;
    font-size: 30px;
    color: #fff;
    background: #1c9898;
    border: 0;
    padding: 14px 28px;
    cursor: pointer;
}
.intake-btn.alt { background: #393939; }
.intake-btn:hover { opacity: .9; }
.content .intake p.intake-small { font-size: 15px; color: #555; }
.content .intake p.intake-error {
    background: #fbeaea;
    border: 2px solid #c22527;
    color: #8f1b1d;
    padding: 12px 14px;
    font-weight: bold;
}
.print-only { display: none; }

@media (max-width: 700px) {
    .intake-grid .fld.half,
    .intake-grid .fld.third { grid-column: span 6; }
    .intake-section legend { font-size: 26px; }
    .intake-btn { font-size: 24px; flex: 1 1 100%; }
    .content .intake p.intake-intro { font-size: 18px; }
    .announcement { max-width: 100%; padding: 14px; }
}

/* ---------- Printing the intake form ---------- */
@media print {
    .header, .footer, #cta, .no-print, .toggle, #side, .content h2 { display: none !important; }
    .print-only { display: block; }
    a[href]:after { content: "" !important; }
    .content, .content-1 { display: block; margin: 0; }
    .intake { max-width: none; font-size: 11pt; }
    .content .intake p { font-size: 10.5pt; margin: 0 0 6px; }
    .intake-intro { display: none; }
    .intake::before {
        content: "Moonstone Massage & Bodyworks - Intake Form";
        display: block;
        font-size: 16pt;
        font-weight: bold;
        margin-bottom: 4pt;
    }
    .intake-section { margin-top: 10pt; padding-top: 4pt; border-top: 1.5pt solid #000; page-break-inside: auto; }
    .intake-section legend { font-size: 13pt; font-family: arial, sans-serif; font-weight: bold; }
    .intake-grid { gap: 0 12pt; }
    .intake-grid .fld { margin: 3pt 0; page-break-inside: avoid; }
    .intake form label, .intake .q { font-size: 9.5pt; margin-bottom: 1pt; font-family: arial, sans-serif; font-weight: bold; }
    .intake form label.opt { font-size: 10pt; margin: 1pt 14pt 1pt 0; font-weight: normal; }
    .intake form label.opt input { width: 11pt; height: 11pt; }
    .intake .checks { grid-template-columns: repeat(4, 1fr); }
    .content-1 .intake input[type=text], .content-1 .intake input[type=email],
    .content-1 .intake input[type=tel], .content-1 .intake input[type=date], .content-1 .intake textarea {
        border: 0 !important; border-bottom: 1pt solid #000 !important; border-radius: 0;
        padding: 1pt 2pt; font-size: 10.5pt; min-height: 0;
    }
    .content-1 .intake textarea { min-height: 36pt; resize: none; }
    .therapist-sig { margin-top: 14pt; font-size: 10.5pt; }
    @page { margin: 0.5in; }
}