﻿/* Shared slim controls for every FLMS page. Change these variables once. */
.flms-controls { --flms-control-height: 30px; --flms-button-height: 30px; --flms-control-font: 12px; }
.flms-controls input.flms-input.flms-input,
.flms-controls select.flms-select.flms-select {
    box-sizing: border-box;
    width: 100%;
    height: var(--flms-control-height);
    min-height: var(--flms-control-height);
    margin: 0;
    padding: 4px 9px;
    border-radius: 4px;
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: var(--flms-control-font);
    line-height: 20px;
}
.flms-controls textarea.flms-input.flms-input {
    box-sizing: border-box;
    width: 100%;
    height: 56px;
    min-height: 56px;
    margin: 0;
    padding: 5px 9px;
    border-radius: 4px;
    font: 12px/18px 'Segoe UI', Arial, sans-serif;
    resize: vertical;
}
.flms-controls .flms-btn.flms-btn {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--flms-button-height);
    min-height: var(--flms-button-height);
    margin: 0;
    padding: 4px 12px;
    border-radius: 4px;
    font: 600 12px/20px 'Segoe UI', Arial, sans-serif;
    white-space: nowrap;
    vertical-align: middle;
}
.flms-controls .login-input.flms-input.flms-input { padding-left: 42px; padding-right: 42px; }
.flms-controls .password-toggle { width: 26px; height: 26px; margin-top: -13px; }
.flms-controls .flms-record-pager { gap: 10px; }
@media (max-width: 550px) {
    .flms-controls input.flms-input.flms-input,
    .flms-controls select.flms-select.flms-select { font-size: 16px; }
}
@media print {
    .flms-controls input.flms-input.flms-input,
    .flms-controls select.flms-select.flms-select,
    .flms-controls textarea.flms-input.flms-input { border: 0; background: transparent; }
}
/* One GridView class for Dashboard, Entry, Saved Records and Reports. */
.flms-controls table.flms-grid {
    border-collapse: collapse;
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 12px;
    color: #234a3b;
}
.flms-controls table.flms-grid th,
.flms-controls table.flms-grid td {
    height: auto;
    padding: 4px 8px;
    border: 1px solid #e0eae3;
    font-size: 12px;
    line-height: 18px;
    vertical-align: middle;
}
.flms-controls table.flms-grid th { background: #f0f7f2; color: #315841; font-weight: 600; }
.flms-controls table.flms-grid .flms-btn.flms-btn {
    height: 24px;
    min-height: 24px;
    padding: 2px 8px;
    font-size: 11px;
    line-height: 18px;
}
.flms-controls table.flms-grid a { padding-top: 2px; padding-bottom: 2px; }
.flms-controls .flms-label { display: block; margin: 0 0 4px; font: 600 12px/18px 'Segoe UI', Arial, sans-serif; color: #315841; }
.flms-controls input.flms-input.flms-input,
.flms-controls select.flms-select.flms-select,
.flms-controls textarea.flms-input.flms-input { border: 1px solid #c4d5cb; }
.flms-controls .flms-input:focus,
.flms-controls .flms-select:focus { outline: 2px solid #89b99b; outline-offset: 1px; }
.flms-controls .flms-input[readonly],
.flms-controls .flms-select:disabled { background-color: #f3f6f4; color: #5b7267; }
@media print {
    .flms-controls input.flms-input.flms-input,
    .flms-controls select.flms-select.flms-select,
    .flms-controls textarea.flms-input.flms-input { border: 0; background: transparent; }
}
