body {
    font-size: 16px !important;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

h1, h2 {
    margin-top: 0px !important;
}

    h1 span, h2 span {
        font-size: 12px !important;
    }
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.mar-t20 {
    margin-top: 20px;
}

.mar-t5 {
    margin-top: 5px;
}

.topbar {
    background-color: #428bca;
    color: white;
}

    .topbar a {
        color: #f0f0f0 !important;
    }

        .topbar a:hover {
            color: white !important;
        }

    .topbar .active {
        background-color: #428bca !important;
    }

.open > a {
    background-color: #428bca !important;
    color: white !important;
}

.open > .dropdown-menu {
    background-color: #428bca !important;
    color: white !important;
}

.lblstt-orange {
    background-color: #ff6a00;
}

.lblstt-blue {
    background-color: #428bca;
}

.lblstt-green {
    background-color: #01ac2c;
}

.lblstt-flexhouse {
    background-color: rgba(161, 128, 27, 1);
}

.lblstt-grey {
    background-color: #cccccc;
}

.lblstt-notstart {
    background-color: #add8e6;
    color: #303030;
}

.tabstt-organe {
    background-color: #ff6a00;
    border-color: #ff6a00;
    color: white;
}

.tabstt-blue {
    background-color: #428bca;
    border-color: #428bca;
    color: white;
}

.tabstt-green {
    background-color: #01ac2c;
    border-color: #01ac2c;
    color: white;
}

.tabstt-grey {
    background-color: #cccccc;
    border-color: #cccccc;
    color: black;
}

.tabstt-flexhouse {
    background-color: rgba(161, 128, 27, 1);
    border-color: rgba(161, 128, 27, 1);
    color: white;
}

.tab-active {
    border-width: 3px !important;
    padding: 6px !important;
    border-color: black;
}

.trhead {
    background-color: #f5f5f5 !important;
    font-weight: bold;
}

.active-leftmenu {
    background-color: #f5f5f5 !important;
}

.flex-2col {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

    .flex-2col .left {
        text-align: left;
    }

    .flex-2col .right {
        text-align: right;
    }

/* Khi màn hình nhỏ hơn 768px (mobile/tablet), xếp dọc */
@media (max-width: 768px) {
    .flex-2col {
        flex-direction: column;
    }

        .flex-2col .right {
            text-align: left;
        }
}

.txtarea-maxwid {
    max-width: 95% !important;
}

.lblstt-drop-txt {
    font-size: 95% !important;
}

    .lblstt-drop-txt .caret {
        border-top: 4px solid white !important;
    }

@media (max-width: 768px) {
    .table-responsive {
        overflow: visible !important; /* Cẩn thận: mất scroll ngang nếu bảng quá rộng */
    }
}

.hiddenspin {
    display: none !important;
}

/* quill editor*/

/* Kiểm tra nếu bạn đã thêm style cho ảnh */
.ql-editor img {
    display: inline-block;
    max-width: 100%;
    cursor: pointer;
}

/* Thêm style cho resize handle */
.ql-image-resize-handle {
    width: 12px;
    height: 12px;
    background-color: blue;
    position: absolute;
    bottom: 0;
    right: 0;
    cursor: se-resize;
}

/* end quill*/


#newPreview img {
    max-width: 100px;
    max-height: 100px;
    margin: 5px;
    border: 1px solid #ccc;
}

#existingPreview {
    display: flex;
}

    #existingPreview img {
        max-height: 100px;
        max-width: 100px;
        margin: 5px;
    }

.dl-horizontal dt {
    text-align: left !important;
    width: 140px !important;
}

.dl-horizontal dd {
    margin-left: 140px !important;
}

.dl-horizontal {
    margin-top: 0 !important;
}
.mar-t40{
    margin-top: 40px !important;
}
.clear-mart{
    margin-top: 0px !important;
}
.border-content{
    border: 1px solid #ccc;
    border-radius:20px;
    padding: 20px;
}
.mt-40{
    margin-top: 40px;
}

/*hack css select2*/
.select2-container--default .select2-selection--single {
    height: 34px !important; /* chuẩn form-control Bootstrap 3 */
    padding: 3px 12px !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    background-color: #fff !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 21px; /* text alignment cho đẹp */
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 32px;
    top: 1px;
    right: 10px;
}

@media (max-width: 468px) {
    .select2-container--default .select2-selection--single { {
        max-width: 280px !important; /* Cẩn thận: mất scroll ngang nếu bảng quá rộng */
    }
}

/*end select2*/
.mobiMenu { padding: 10px !important;}
.mobiMenu a{
    background-color: #428bca !important;
    padding:10px;
}