/**********************************

Use: Bootstrap 4 upgrade 5

維持 CSS 風格所使用的 所以這支 執行順序要在 Bootstrap.css 之後

Bootstrap 官方遷移文檔
https://getbootstrap.com/docs/5.0/migration/
***********************************/
:root { 
	--bs-dropdown-divider-margin-y: 0.5rem; /* 自定義上下邊距 因為沒定就會跑位 */
	--bs-body-text-align: left;
	--bs-breadcrumb-item-padding-x: .5rem;
}

.row>* {
    flex-shrink: 0;
    max-width: 100%;
    padding-right: 0rem; 
    padding-left: 0rem; 
    margin-top: var(--bs-gutter-y);
}

a {
    color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
    text-decoration: none;
}

label{
	/* display:flex; */
	margin-bottom: .5rem;
}

ol, ul {
    padding-left: 0rem; /* 覆寫調 bootstrap 預設的 2rem  */
}

.mr-auto, .mx-auto {
    margin-right: auto !important;
}

textarea.form-control {
    height: auto;
    min-height: 0rem;
}

hr {
	color: rgb(128, 128, 128);
    background-color: rgb(128, 128, 128);
}

.row {
    --bs-gutter-x: 2rem;
}

/* 
取代已改名的 mr-2 和 ml-2  
bootstrap 5 應該使用 me-2 和 ms-2
 **/
.mr-1, .mx-1 {
    margin-right: .25rem !important;
}

.mr-2, .mx-2 {
    margin-right: .5rem !important;
}
.mr-3, .mx-3 {
    margin-right: 1rem !important;
}
.ml-auto, .mx-auto {
    margin-left: auto !important;
}

.text-right {
    text-align: right !important;
}

.float-left {
    float: left !important;
}




.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5,
	.col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1,
	.col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4,
	.col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto,
	.col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2,
	.col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8,
	.col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11,
	.col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6,
	.col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1,
	.col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4,
	.col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
	position: relative;
	/* width: 100%; */
	padding-right: 15px;
	padding-left: 15px;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
    border-color: var(--bs-form-invalid-border-color);
    padding-right: calc(1.5em + .75rem);
    background-image: none !important;
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

