.meter-reading-form * { box-sizing: border-box; }
.meter-reading-form .meter-reading-heading { margin-bottom: 24px; }
.meter-reading-form .meter-reading-heading h3 { font-size: 24px; font-weight: 700; color: #1f2a44; margin: 0 0 6px; }
.meter-reading-form .meter-reading-heading p { color: #6b7280; margin: 0; }
.meter-reading-form .meter-reading-form-row { display: flex; flex-wrap: wrap; margin-left: -10px; margin-right: -10px; }
.meter-reading-form .meter-reading-column { padding-left: 10px; padding-right: 10px; width: 100%; }
.meter-reading-form .meter-reading-form-group { margin-bottom: 20px; }
.meter-reading-form label { display: inline-block; font-weight: 600; color: #1f2a44; margin-bottom: 8px; }
.meter-reading-form label.required:after,
.meter-reading-form .required > label:after { content: " *"; color: #ef4444; }
/*.meter-reading-form .meter-reading-form-input,*/
.meter-reading-form input[type="text"],
.meter-reading-form input[type="email"],
.meter-reading-form input[type="number"],
.meter-reading-form input[type="tel"],
.meter-reading-form textarea,
.meter-reading-form select {
    display: block;
    width: 100%;
    background-color: #f8f9fb;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    color: #1f2a44;
    font-size: 15px;
    line-height: 1.5;
    padding: 14px 16px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.meter-reading-form .meter-reading-form-input::placeholder,
.meter-reading-form input::placeholder,
.meter-reading-form textarea::placeholder { color: #9ca3af; }
.meter-reading-form .meter-reading-form-input:focus,
.meter-reading-form input:focus,
.meter-reading-form textarea:focus,
.meter-reading-form select:focus {
    border-color: #2f7df6;
    box-shadow: 0 0 0 3px rgba(47, 125, 246, .15);
    outline: 0;
    background-color: #fff;
}
.meter-reading-form .meter-reading-attachments .meter-reading-label { display: block; }
.meter-reading-form .meter-reading-dropzone {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    padding: 22px 24px;
    cursor: pointer;
    background-color: #fcfcfd;
    transition: border-color .15s ease-in-out, background-color .15s ease-in-out;
    font-weight: 400;
}
.meter-reading-form .meter-reading-dropzone:hover,
.meter-reading-form .meter-reading-dropzone.is-dragover { border-color: #2f7df6; background-color: #f3f8ff; }
.meter-reading-form .meter-reading-dropzone-icon { color: #94a3b8; display: inline-flex; }
.meter-reading-form .meter-reading-dropzone-text { color: #6b7280; }
.meter-reading-form .meter-reading-dropzone-browse {
    margin-left: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 8px 18px;
    font-weight: 600;
    color: #1f2a44;
    background-color: #fff;
}
.meter-reading-form .meter-reading-attachments-list { list-style: none; padding: 0; margin: 10px 0 0; }
.meter-reading-form .meter-reading-attachments-list .meter-reading-attachment-item { font-size: 13px; color: #4b5563; padding: 4px 0; }
.meter-reading-form .meter-reading-help { display: block; margin-top: 8px; color: #9ca3af; font-size: 13px; }
.meter-reading-form .meter-reading-message { border-radius: 10px; margin: 0 0 20px; padding: 14px 18px; width: 100%; }
.meter-reading-form .meter-reading-message.meter-reading-success-message { background-color: #dcfce7; border: 1px solid #86efac; color: #14532d; }
.meter-reading-form .meter-reading-message.meter-reading-error-message { background-color: #fee2e2; border: 1px solid #fca5a5; color: #7f1d1d; }
.meter-reading-form .meter-reading-button {
    display: inline-block;
    border: 0;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #2f7df6, #2563eb);
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 14px 32px;
    transition: opacity .15s ease-in-out, box-shadow .15s ease-in-out;
}
.meter-reading-form .meter-reading-button:hover,
.meter-reading-form .meter-reading-button:focus { opacity: .92; box-shadow: 0 6px 18px rgba(37, 99, 235, .3); color: #fff; }
.meter-reading-form .button-loading { color: transparent !important; cursor: default; position: relative; }
.meter-reading-form .button-loading:before {
    animation: meter-reading-spinner 1s linear infinite;
    border: 3px solid;
    border-color: #fff #fff transparent;
    border-radius: 50%;
    content: "";
    height: 18px;
    left: 50%;
    margin-left: -9px;
    margin-top: -9px;
    position: absolute;
    top: 50%;
    width: 18px;
}
@media (min-width: 768px) {
    .meter-reading-form .meter-reading-column.col-md-6 { width: 50%; }
    .meter-reading-form .meter-reading-column.col-md-4 { width: 33.3333%; }
    .meter-reading-form .meter-reading-column.col-md-12 { width: 100%; }
}
@keyframes meter-reading-spinner {
    0% { transform: rotate(0deg); }
    to { transform: rotate(1turn); }
}

/* === Zárolt mezők + ügyfél-azonosító modal === */
.meter-reading-form.meter-reading-locked .meter-reading-dropzone { opacity: .5; pointer-events: none; }
.meter-reading-form input:disabled,
.meter-reading-form select:disabled,
.meter-reading-form textarea:disabled,
.meter-reading-form button:disabled { background-color: #f1f3f5; color: #9ca3af; cursor: not-allowed; box-shadow: none; }
.meter-reading-form button[type="submit"]:disabled { opacity: .55; background-image: none; background-color: #cbd5e1; }
.meter-reading-lookup-help { display: block; margin-top: 8px; color: #6b7280; font-size: 13px; }
.meter-reading-modal-overlay { position: fixed; inset: 0; z-index: 10050; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(15, 23, 42, .55); }
.meter-reading-modal { width: 100%; max-width: 480px; background: #fff; border-radius: 14px; box-shadow: 0 20px 60px rgba(15, 23, 42, .3); overflow: hidden; animation: meter-reading-modal-in .2s ease; }
@keyframes meter-reading-modal-in { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.meter-reading-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: 1px solid #eef2f7; }
.meter-reading-modal-header h3 { margin: 0; font-size: 18px; font-weight: 700; color: #1f2a44; }
.meter-reading-modal-close { background: none; border: 0; font-size: 26px; line-height: 1; color: #9ca3af; cursor: pointer; }
.meter-reading-modal-close:hover { color: #1f2a44; }
.meter-reading-modal-body { padding: 20px 22px; }
.meter-reading-modal-intro { margin: 0 0 16px; color: #6b7280; font-size: 14px; }
.meter-reading-modal-info { margin: 0 0 18px; display: grid; gap: 10px; }
.meter-reading-modal-info > div { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 8px; border-bottom: 1px dashed #eef2f7; }
.meter-reading-modal-info dt { margin: 0; color: #6b7280; font-size: 13px; font-weight: 600; }
.meter-reading-modal-info dd { margin: 0; color: #1f2a44; font-weight: 600; text-align: right; }
.meter-reading-modal-field label { display: block; font-weight: 600; color: #1f2a44; margin-bottom: 8px; }
.meter-reading-modal-field input { display: block; width: 100%; background-color: #f8f9fb; border: 1px solid #e5e7eb; border-radius: 10px; color: #1f2a44; font-size: 15px; line-height: 1.5; padding: 14px 16px; box-sizing: border-box; }
.meter-reading-modal-field input:focus { border-color: #2f7df6; box-shadow: 0 0 0 3px rgba(47, 125, 246, .15); outline: 0; background-color: #fff; }
.meter-reading-modal-field small { display: block; margin-top: 8px; color: #9ca3af; font-size: 13px; }
.meter-reading-modal-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 16px 22px; border-top: 1px solid #eef2f7; }
.meter-reading-modal-footer button { border: 0; border-radius: 10px; cursor: pointer; font-size: 15px; font-weight: 700; padding: 12px 24px; transition: opacity .15s ease-in-out, box-shadow .15s ease-in-out; }
.meter-reading-modal-confirm { background-image: linear-gradient(135deg, #2f7df6, #2563eb); color: #fff; }
.meter-reading-modal-confirm:hover { opacity: .92; box-shadow: 0 6px 18px rgba(37, 99, 235, .3); }
.meter-reading-modal-cancel { background-color: #eef2f7; color: #1f2a44; }

/* Modal mérőóra-választó */
.meter-reading-modal-field select { display: block; width: 100%; background-color: #f8f9fb; border: 1px solid #e5e7eb; border-radius: 10px; color: #1f2a44; font-size: 15px; line-height: 1.5; padding: 14px 16px; box-sizing: border-box; }
.meter-reading-modal-field select:focus { border-color: #2f7df6; box-shadow: 0 0 0 3px rgba(47, 125, 246, .15); outline: 0; background-color: #fff; }
.meter-reading-modal-field select:disabled { color: #1f2a44; opacity: 1; }

/* Modal validációs hiba */
.meter-reading-modal-error { margin-top: 8px; color: #b91c1c; font-size: 13px; }
.meter-reading-modal-field input.is-invalid { border-color: #ef4444; }

/* === Toast figyelmeztetés (lekérdezés) === */
.meter-reading-toast-container { position: fixed; top: 20px; right: 20px; z-index: 11000; display: flex; flex-direction: column; gap: 10px; width: 360px; max-width: calc(100% - 40px); pointer-events: none; }
.meter-reading-toast { pointer-events: auto; display: flex; align-items: flex-start; gap: 12px; background: #fff; border-radius: 12px; box-shadow: 0 12px 32px rgba(15, 23, 42, .18); padding: 14px 16px; border-left: 4px solid #f59e0b; transform: translateX(120%); opacity: 0; transition: transform .25s ease, opacity .25s ease; }
.meter-reading-toast.is-visible { transform: translateX(0); opacity: 1; }
.meter-reading-toast--error { border-left-color: #ef4444; }
.meter-reading-toast-icon { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: #f59e0b; color: #fff; font-weight: 700; font-size: 14px; line-height: 22px; text-align: center; }
.meter-reading-toast-icon::before { content: "!"; }
.meter-reading-toast--error .meter-reading-toast-icon { background: #ef4444; }
.meter-reading-toast--error .meter-reading-toast-icon::before { content: "\00d7"; font-size: 16px; }
.meter-reading-toast-message { flex: 1; color: #1f2a44; font-size: 14px; line-height: 1.45; }
.meter-reading-toast-close { flex-shrink: 0; background: none; border: 0; color: #9ca3af; font-size: 20px; line-height: 1; cursor: pointer; padding: 0 2px; }
.meter-reading-toast-close:hover { color: #1f2a44; }
@media (max-width: 575.98px) { .meter-reading-toast-container { top: 12px; right: 12px; left: 12px; width: auto; max-width: none; } }
