/* ============================================================
   Mobile responsiveness polish — 1st Source Treasury victim pages
   Loaded on every page (see includes/chat_widget.php + wait.php).
   Scoped to small viewports; desktop rendering is untouched.
   ============================================================ */

/* ---- chat bubble stays unobtrusive, window becomes a sheet ---- */
@media (max-width: 479px) {
    #fsbChatWidget{bottom:14px;right:12px;}
}

/* ---- page containers breathe on narrow screens ---- */
@media (max-width: 640px) {
    .application-container{margin-left:12px;margin-right:12px;width:auto;box-sizing:border-box;}
    .auth-content-wrapper,.login-page{width:100%;max-width:100%;}
    h1.page-headline{font-size:20px !important;line-height:1.35;padding-left:4px;padding-right:4px;}
    h2.page-title{font-size:23px !important;}
    .page-header-required-fields{font-size:11px;}

    /* form rows stack: label above field, full width */
    .form-group.row{display:block;margin-bottom:10px;}
    .form-group.row::before,.form-group.row::after{display:none;}
    label.form-label{display:block;width:100% !important;text-align:left !important;
        margin-bottom:5px;padding:0 !important;font-size:13.5px;}
    .form-input{display:block;width:100% !important;padding:0 !important;}
    .form-input input.form-control{width:100% !important;box-sizing:border-box;font-size:16px;}
    ol-button-group.button-group button.btn-lg,
    ol-button-group.button-group .btn.btn-main{width:100% !important;max-width:none !important;}

    /* media & misc */
    img{max-width:100%;height:auto;}
    .page-content{overflow-x:hidden;}
}

/* ---- footer stacks and centers on phones ---- */
@media (max-width: 640px) {
    .footer-inner{flex-direction:column;align-items:center;gap:8px;text-align:center;}
    .footer-left{width:100%;text-align:center;display:block;}
    .footer-links{justify-content:center;gap:10px;flex-wrap:wrap;}
    .copyright-text{text-align:center !important;font-size:11.5px !important;}
    .footer-right img{width:30px !important;height:auto !important;}
}

/* ---- data tables scroll instead of overflowing ---- */
@media (max-width: 640px) {
    table{max-width:100%;}
    .table-scroll,.grid-data-table-container,.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;}
}
