/*屏東客運網頁通用設定*/

/*表格及定位*/
table {
    border-collapse: collapse;
}

p{
    clear:both;
    margin:0;
}
ul{
    clear:both;
    list-style:none;
}
a{
    text-decoration:none;
    clear:both;
    margin:0;
}
a:hover{
    border-bottom:1px dashed #111;
}

/* input 設定 */
/* 文字輸入框（可編輯） */
input[type="text"], input[type="password"]{
    border: 1px solid #444;
    font-family: "原俠正楷", "芫荽", "標楷體", "微軟正黑體";
    background-color: #fffdf0;
    color: #1e1e1e;
    padding: 2px 8px;
    transition: border-color 0.2s, box-shadow 0.2s;
    width: auto;             /* ✅ 根據 size 調整寬度 */
    max-width: 100%;         /* ✅ 防止在小螢幕時破版 */
    box-sizing: border-box;  /* ✅ 包含 padding */
    white-space: nowrap;     /* ✅ 避免被系統壓縮斷行 */
}

textarea {
    border: 1px solid #444;
    font-family: "原俠正楷", "芫荽", "標楷體", "微軟正黑體";
    background-color: #fffdf0;
    color: #1e1e1e;
    padding: 2px 8px;
    transition: border-color 0.2s, box-shadow 0.2s;
    width: auto;             /* ✅ 根據 size 調整寬度 */
    max-width: 100%;         /* ✅ 防止在小螢幕時破版 */
    box-sizing: border-box;  /* ✅ 包含 padding */
    white-space: pre-wrap;     /* ✅ 避免被系統壓縮斷行 */
}


/* 聚焦樣式強化 */
input[type=text]:focus {
    border-color: #0074d9;  /* 明亮藍邊框 */
    box-shadow: 0 0 4px #0074d9;
    outline: none;
}

/* 只讀樣式：用淡藍區分 */
input:read-only, textarea:read-only {
    background-color: #e0f7ff;
    color: #444;
    border: 1px dashed #999;
}

/* 按鈕通用設定 */
input[type=button],
input[type=reset],
input[type=submit] {
    background-color: #3399ff;  /* 清爽藍 */
    color: #ffffff;
    border: none;
    border-radius: 5px;
    padding: 6px 14px;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(51, 153, 255, 0.5);
    transition: background-color 0.2s ease, transform 0.1s ease;
}

/* 按鈕 hover 效果 */
input[type=button]:hover,
input[type=reset]:hover,
input[type=submit]:hover {
    background-color: #267dd6;
    transform: scale(1.03);
}

/* 按鈕 disabled 樣式 */
input[type=button]:disabled,
input[type=reset]:disabled,
input[type=submit]:disabled {
    background-color: #cccccc;
    color: #888888;
    cursor: not-allowed;
    box-shadow: none;
}


/*文字大小*/
.cbord{
    font-weight:bold;
}
.rbord{
    font-weight:bold;
}
.ctitle{
    font-size:32px;
    font-family:"標楷體";
}
.ctitle2{
    font-size:28px;
    font-family:"標楷體";
}
.rtitle{
    font-size:34px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword{
    font-size:28px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword2{
    font-size:26px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword3{
    font-size:24px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword4{
    font-size:20px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword45{
    font-size:18px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword5{
    font-size:16px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword55{
    font-size:15px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.rword6{
    font-size:12px;
    font-family:"原俠正楷","芫荽","標楷體","微軟正黑體";
}
.oword{
    font-size:28px;
    font-family:"華康中圓體","微軟正黑體";
}
.ooword{
    font-size:28px;
    font-family:"華康粗圓體","微軟正黑體";
}
.oword2{
    font-size:26px;
    font-family:"華康中圓體","微軟正黑體";
}
.oword3{
    font-size:24px;
    font-family:"華康中圓體","微軟正黑體";
}
.oword4{
    font-size:20px;
    font-family:"華康中圓體","微軟正黑體";
}
.chead{
    font-size:18px;
    font-family:"微軟正黑體";
}
.chead2{
    font-size:18px;
    font-family:"標楷體";
}
.cword{
    font-size:16px;
    font-family:"微軟正黑體";
}
.cword2{
    font-size:16px;
    font-family:"標楷體";
}
.mword{
    font-size:14px;
    font-family:"微軟正黑體";
}
.sword{
    font-size:12px;
    font-family:"微軟正黑體";
}
.tword{
    text-decoration:line-through;
}
.shadow{
    text-shadow:-1px 0 #101,    /*向左阴影*/  0 -1px #101,    /*向上阴影*/  1px 0 #101,     /*向右阴影*/  0 1px #101;     /*向下阴影*/
}

/*文字顏色*/
/* 黑、白、灰系 */
.cblack  {
    color: #333333;
}  /* 柔和黑 */
.cwhite  {
    color: #f8f8f8;
}  /* 柔和白 */
.cgray   {
    color: #a0a0a0;
}  /* 柔和灰 */

/* 藍色系 */
.cblue   {
    color: #4a78a4;
}  /* 柔和藍 */
.ccfblue {
    color: #7aa8d8;
}  /* 柔和矢車菊藍 */
.cpowderblue    {
    color: #b0cbe9;
}  /* 柔和粉藍 */
.crb_blue{
    color: #0392cf;
}  /* 專用藍（CRB用） */

/* 綠色系 */
.cgreen  {
    color: #6ea36b;
}  /* 柔和綠 */
.cgr     {
    color: #74a07d;
}  /* 柔和森林綠 */
.clightgreen    {
    color: #a8d8a2;
}  /* 柔和淺綠 */
.crb_green      {
    color: #a2fba2;
}  /* 專用綠（CRB用） */

/* 紅色系 */
.cred    {
    color: #d86b6b;
}  /* 柔和紅 */
.ccrimson{
    color: #b85d68;
}  /* 柔和深紅 */
.clightcoral    {
    color: #e08c88;
}  /* 柔和珊瑚紅 */
.crb_red {
    color: #ee4035;
}  /* 專用紅（CRB用） */

/* 黃色 / 黃褐色系 */
.cyellow {
    color: #c28e0e;
}  /* 金棕黃 */
.clightyellow   {
    color: #f5e3ac;
}  /* 柔和淡黃 */
.ctan    {
    color: #d4a984;
}  /* 柔和黃褐 */

/* 棕色系 */
.cchoco  {
    color: #a66d54;
}  /* 巧克力棕 */

/* 粉色系 */
.clightpink     {
    color: #f3b0c3;
}  /* 柔和粉紅 */



/* 底色：MIS 友善調整版 */
.textbox      {
    background-color: #cccccc;
}
.textboxb     {
    background-color: #7dafff;
}
.textboxccf   {
    background-color: #a0c4ff;
}
.textboxdg    {
    background-color: #c4e1c1;
}
.textboxlgn   {
    background-color: #b8e0c8;
}
.textboxg     {
    background-color: #d6f5d6;
}
.textboxg2    {
    background-color: #b6fcb6;
}
.textboxle    {
    background-color: #fff9c4;
}
.textboxle2   {
    background-color: #fffce6;
}
.textboxlg    {
    background-color: #dddddd;
}
.textboxlgg   {
    background-color: #eeeeee;
}
.textboxls    {
    background-color: #ffd9c0;
}
.textboxlv    {
    background-color: #ede7f6;
}
.textboxp0    {
    background-color: #ffc9d2;
}
.textboxp     {
    background-color: #ffe1e9;
}
.textboxp1    {
    background-color: #eebac1;
}
.textboxpa    {
    background-color: #ffe8bb;
}
.textboxpw    {
    background-color: #d2ecf5;
}
.textboxr     {
    background-color: #ffb3b3;
}
.textboxrm    {
    background-color: #9ecbff;
}
.textboxlr    {
    background-color: #ffd6d6;
}
.textboxlr2   {
    background-color: #ffe2e2;
}
.textboxt     {
    background-color: #d2b48c;
}
.textboxth    {
    background-color: #e5d2f2;
}
.textboxy     {
    background-color: #fff5e1;
}
.textboxwh    {
    background-color: #f9f3e5;
}
.textboxw     {
    background-color: #ffffff;
}
.textboxbgr   {
    background-color: #dceeff;
}
.textboxrgby  {
    background-color: #f1f1fb;
}
.textbox_crb_blue    {
    background-color: #0074d9;
}
.textbox_crb_green   {
    background-color: #b2f7b2;
}
.textbox_crb_gr2     {
    background-color: #e6fce6;
}
.textbox_crb_red     {
    background-color: #ff5c5c;
}
.Lineboxth    {
    border-Top:2px solid #e5d2f2;
}

/*底色--花格*/
.TagColorBlue1 {
    background-image: linear-gradient(rgba(160, 200, 230, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(160, 200, 230, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorBlue2 {
    background-image: linear-gradient(rgba(190, 220, 240, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(190, 220, 240, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorBlue3 {
    background-image: linear-gradient(45deg, rgba(150, 200, 230, 0.2) 50%, transparent 0),
        linear-gradient(135deg, rgba(150, 200, 230, 0.2) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorGreen1 {
    background-image: linear-gradient(rgba(180, 230, 200, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(180, 230, 200, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorGreen2 {
    background-image: linear-gradient(rgba(170, 220, 190, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(170, 220, 190, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorTan {
    background-image: linear-gradient(rgba(225, 210, 180, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(225, 210, 180, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorPink {
    background-image: linear-gradient(rgba(245, 200, 210, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(245, 200, 210, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorPurple {
    background-image: linear-gradient(rgba(220, 200, 240, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(220, 200, 240, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorYellow {
    background-image: linear-gradient(rgba(250, 240, 180, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(250, 240, 180, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorRed {
    background-image: linear-gradient(rgba(240, 190, 190, 0.25) 50%, transparent 0),
        linear-gradient(90deg, rgba(230, 160, 160, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}

.TagColorRed2 {
    background-image: linear-gradient(25deg, rgba(235, 180, 180, 0.25) 50%, transparent 0),
        linear-gradient(115deg, rgba(230, 170, 170, 0.25) 50%, transparent 0);
    background-size: 30px 30px;
}


/*清除浮動放在外框用*/
.clearfix{
    display:inline-block;
}
.clearfix:after{
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}

/*文字--定位*/
.wcn{
    text-align:center;
}
.wln{
    text-align:left;
    padding-left: 5px;
}
.wln2{
    text-align:left;
    padding-left: 8px;
}
.wln3{
    text-align:left;
    padding-left: 10px;
}
.wrn{
    text-align:right;
    padding-right: 5px;
}
.wjn{
    text-align:justify;
    padding-left: 5px;
    padding-right: 5px;
}
.wtn{
    vertical-align:text-top;
}
.wvn{
    vertical-align:middle;
}
.text_oline{
    margin-left : 3em;
    text-indent : -3em ;
}
.text_ofline{
    margin-left : 2em;
    text-indent : -2em ;
}
.text_fline{
    margin-left : 3em;
}

/*清除浮動放在外框用*/
.clearfix{
    display:inline-block;
}
.clearfix:after{
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}

/*分隔*/
hr {
    border: none;
    border-top: 1px solid #ddd;
    margin: 5px 0;
}

.CC {
    cursor: pointer;
}

/*列印用*/
/*紙張大小設定*/
.A5paper{
    width:200mm;
    height:138mm;
    border:0px solid;
} /* 長寬尺寸均減少10mm */
.A4paper{
    width:287mm;
    height:200mm;
    border:0px solid;
}
.A4paperP{
    width:200mm;
    height:287mm;
    border:0px solid;
}
.B5paperP{
    width:172mm;
    height:247mm;
    border:0px solid;
}
.B5paper{
    width:247mm;
    height:172mm;
    border:0px solid;
}
.A3paper{
    width:410mm;
    height:287mm;
    border:0px dotted;
}
.A3paperReal{
    width:420mm;
    height:297mm;
    border:0px dotted;
}
.A3paperP{
    width:287mm;
    height:415mm;
    border:0px solid;
}
.A3paperPReal{
    width:297mm;
    height:420mm;
    border:0px solid;
}
.pages{
    page-break-after:always;
}/*分頁*/
.noPrint{
    display:none;
}
.paper {
    float:left;
    clear: both;
}

.tabs UL {
    width:96%;
    list-style: none outside none;
    margin: 5px 0;
    border-bottom: 4px double #68a697;
}
.tabs LI {
    width:130px;
    background: white;
    border-radius:5px;
    border-bottom: 4px solid #ACACAC;
    margin: 0 5px 5px 0;
    display: inline-block;
}
.tabs A {
    text-align:center;
    color: #9C9C9C;
    display: block;
    font-size: 20px;
    font-family: "原俠正楷", "芫荽", "標楷體", "微軟正黑體";
    font-weight:bold;
    padding: 4px ;
    text-decoration: none;
}
.tabs LI:hover {
    background: #a0cac0;
    border-bottom: 4px solid #68a697;
}
.tabs LI:hover A {
    color: white;
}

/* 通用 fieldset 設定 */
fieldset {
    margin: 0 auto 20px auto;
    border-radius: 6px;
    border: 1px solid #ccc;
    padding: 10px 5px;
    background-color: #fdfdfd;
}

/* legend 標題格式 */
legend {
    padding: 6px 16px;
    font-weight: bold;
    border-radius: 6px;
    font-size: 18px;
}

/* 建單區（翠綠） */
.fieldset-data {
    border-left: 6px solid #10b981;
}
.fieldset-data legend {
    background-color: #d1fae5;
    color: #065f46;
}

/* A區（天藍） */
.fieldset-ListA {
    border-left: 6px solid #3b82f6;
}
.fieldset-ListA legend {
    background-color: #dbeafe;
    color: #1e40af;
}

/* B區（琥珀） */
.fieldset-ListB {
    border-left: 6px solid #f59e0b;
}
.fieldset-ListB legend {
    background-color: #fef3c7;
    color: #92400e;
}

/* C區（紫羅蘭） */
.fieldset-ListC {
    border-left: 6px solid #8b5cf6;
}
.fieldset-ListC legend {
    background-color: #ede9fe;
    color: #5b21b6;
}

/* D區（玫瑰） */
.fieldset-ListD {
    border-left: 6px solid #ec4899;
}
.fieldset-ListD legend {
    background-color: #fce7f3;
    color: #9f1239;
}

/* E區（青色） */
.fieldset-ListE {
    border-left: 6px solid #06b6d4;
}
.fieldset-ListE legend {
    background-color: #cffafe;
    color: #0e7490;
}

/* F區（靛藍） */
.fieldset-ListF {
    border-left-color: #6366f1;
}
.fieldset-ListF legend {
    background-color: #e0e7ff;
    color: #3730a3;
}

/* 共用：小圖示底樣式 */
.bus-tag {
    display: inline-block;
    min-width: 18px;
    padding: 0 4px;
    height: 16px;
    line-height: 16px;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    border-radius: 3px;
    vertical-align: middle;
    margin-right: 2px;
}

/* 高客：紅色系 */
.bus-KT {
    background-color: #c0392b;   /* 主色紅 */
    border: 1px solid #962d22;   /* 深一階紅邊框 */
}

/* 屏客：綠色系 */
.bus-PT {
    background-color: #27ae60;   /* 主色綠 */
    border: 1px solid #1e8449;   /* 深一階綠邊框 */
}

.text-icon {
    font-size: 0.85em; /* 稍微縮小，避免佔用標頭過多空間 */
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 12px; /* 增加圓角，使其看起來更像一個標籤或徽章 */
    display: inline-block;
    line-height: 1; /* 保持垂直對齊 */
}

/* 屏客 (PT) 標籤 */
.PT-text-icon {
    color: white; /* 白色字體 */
    background-color: #2ECC71; /* 使用屏客綠作為填充色 */
    box-shadow: 0 1px 3px rgba(46, 204, 113, 0.4); /* 增加綠色陰影 */
}

/* 高客 (KT) 標籤 */
.KT-text-icon {
    color: white; /* 白色字體 */
    background-color: #E74C3C; /* 使用高客紅作為填充色 */
    box-shadow: 0 1px 3px rgba(231, 76, 60, 0.4); /* 增加紅色陰影 */
}