@import url(../../css/cckm-box.css);
/* @import url(../../css/cmn/pagenav.css); */

/** **************************** **/ 
/** ***      schedule               *** **/
/** **************************** **/ 

/** 背景 **/
.cust-schedule > .bg-container {
	background-image:url(https://d1r4509tniam8v.cloudfront.net/img/crm-cust-bg.png);
    background-size: cover; background-position: center 70%; background-repeat: no-repeat; opacity: 0.1;
	position: absolute; height: 200px; width: 100%; border-bottom-left-radius: 50% 30%; border-bottom-right-radius: 50% 30%;
} 
@media (max-width:767px) {
	.cust-schedule > .bg-container { height: 230px; background-position:center left; border-bottom-left-radius: 50% 20%; border-bottom-right-radius: 50% 20%; }
}

.cust-schedule { margin-bottom: 50px;  }

.cust-schedule .form-label { font-size: 85%; font-weight:normal; }
.cust-schedule .input-amt { min-width: 180px; text-align: right; }

.cust-schedule .box { margin-top: 15px; }
.cust-schedule .box .box-body { padding: 15px; }
.cust-schedule small { color:#aaa; }
.cust-schedule .choice .media { margin: 0; padding: 8px; border: 1px dashed #ccc; }
.cust-schedule .choice .media .media-left { position: relative; }
.cust-schedule .choice .media .medal { width: 18px; position: absolute; right: 0; bottom: 0; }
.cust-schedule .choice .media .cust-img { width: 32px; height: 32px } 
.cust-schedule .choice .media .media-body .media-heading { margin-bottom: 0; } 

.cust-schedule .choice .search *[class^="col-"] { padding-left: 0; padding-right: 0; }

.cust-schedule .choice .search  { padding: 0 8px 0 0; }
@media (max-width: 767px) { .cust-schedule .choice .search { padding: 0; } }
.cust-schedule .choice .search .condition { background: #f4f4f4; margin: -15px -15px 15px; padding: 15px 15px 15px; }
.cust-schedule .choice .search .condition .form-input:first-child { padding-right: 10px; }
@media (max-width: 767px) { 
	.cust-schedule .choice .search .condition .form-input { padding:0 0 10px !important; } 
	.cust-schedule .choice .search .condition .add-cust { vertical-align: top; }
}

.cust-schedule .choice .search .result .heading { margin-bottom: 1.2rem; }
@media (max-width: 767px) { .cust-schedule .choice .search .result .heading { font-size: 1.5rem; } }
/* 直接使用 choice-cust.css 
.cust-schedule .choice .search .result .search-data { margin-bottom: 1.2rem; }
.cust-schedule .choice .search .result .search-data .cust .media { margin: 3px; padding: 5px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; height: 60px; }
.cust-schedule .choice .search .result .search-data .cust .media .media-heading { font-size:85%; }
.cust-schedule .choice .search .result .search-data .cust a { cursor:pointer; color:#273900; display: block; visibility: visible; position: relative; overflow: hidden; padding-bottom: 100%;}
.cust-schedule .choice .search .result .search-data .cust a:hover:before,
.cust-schedule .choice .search .result .search-data .cust a.selected:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; background: rgba(37,34,39,.3); }
.cust-schedule .choice .search .result .search-data .cust a:hover:after,
.cust-schedule .choice .search .result .search-data .cust a.selected:after { position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0); z-index: 2; content: '\f067'; font-size: 20px; line-height: 1; color: #fff; }
.cust-schedule .choice .search .result .search-data .cust a.selected:hover:after { content:"\f014"; color:red }
.cust-schedule .choice .search .result .search-data .cust a.selected:after { content:"\f00c" }

@media (max-width:374px) { .cust-schedule .choice .search .result .search-data .cust { width: 100%; } }
.cust-schedule .choice .search .result .search-btn { background: #f4f4f4; margin: 0 -15px -15px; padding: 20px 15px; }
*/
.cust-schedule .choice .selected  { padding: 0 0 0 8px; }
@media (max-width: 767px) { .cust-schedule .choice .selected { padding: 0; } }
.cust-schedule .choice .selected .box-body { padding-bottom: 2.5rem !important; }
.cust-schedule .choice .selected .heading { margin-bottom: 1.2rem; }
@media (max-width: 767px) { .cust-schedule .choice .selected .heading { font-size: 1.5rem; } }
.cust-schedule .choice .selected .media { border-width : 0 0 1px 0; }
.cust-schedule .choice .selected .media:last-child { border-width: 0; }
.cust-schedule .choice .selected .media:nth-child(even) { background-color: #f8f8f8; }
.cust-schedule .choice .selected .media:hover { background-color: rgba(37,34,39,.3); }
.cust-schedule .choice .selected .media:hover a.remove { color: red !important; }

/* 交談紀錄 */
.cust-schedule .chat-record .cc-div-table { display: block; max-height: 120px;overflow: hidden; overflow-y: auto; border: 1px dashed rgba(var(--default-color), 0.5); border-radius: 10px; }
.cust-schedule .chat-record .cc-div-table .content { white-space: pre-line; }

/* 活動項目說明 */
.cust-schedule .active-desc { font-size: 95%; }
.cust-schedule .activity-item { padding: 5px 8px; margin-right:5px; margin-bottom: 5px; border-radius: 10px; background:rgba(var(--default-color), 0.3); font-size: 85%;}
.cust-schedule .activity-item.reach { background:rgba(var(--success-color), 0.3)}
/** 週期 ICON **/
.cust-schedule .timeline .timeline_element .inner-block .inner.cycle:after {
	content: ''; background-image: url(https://d1r4509tniam8v.cloudfront.net/img/svg/calendar-repeat.svg);
	width: 80px; height: 80px; background-position: center; background-size: cover; position: absolute; top: 20px; right: calc(50% - 40px); opacity: 0.08; /* transform: rotate( 90deg ); */ 
}
.cust-schedule .timeline .timeline_element .drop-menu { position: absolute; right: 10px; top: 10px; } 

/** **************************** **/ 
/** ***      edit schedue        *** **/
/** *************************** **/ 
.modal-content { overflow: hidden; } /** 一定要設定，才能讓超出的圖樣隱藏起來 **/
.edit-schedule:before { 
	content: "\f073"; background: rgba(var(--default-color), 0.15); top: -40px; right: -30px; 
	position: absolute; font-size: 100px; width: 200px; height: 200px; text-align: center; line-height: 230px; border-radius: 100%; color: #fff; opacity: 0.8;
}
.edit-schedule.visited { background: rgba(var(--success-color), 0.1) }
.edit-schedule.visited:before { content: "\f091"; background: rgba(var(--success-color), 0.15); }

.edit-schedule .nav-tabs>li>a,
.edit-schedule .nav-tabs>li>a:focus,
.edit-schedule .nav-tabs>li>a:hover { color: #888; }
.edit-schedule .nav-tabs>li>a:focus,
.edit-schedule .nav-tabs>li>a:hover { background: #f5f5f5; }
.edit-schedule .nav-tabs>li.active>a, 
.edit-schedule .nav-tabs>li.active>a:focus, 
.edit-schedule .nav-tabs>li.active>a:hover { background: #eee; color: #333; border-bottom: 1px solid #ddd; }
.edit-schedule .nav-tabs.nav-justified>li>a {  border-bottom: 1px solid #ddd; border-radius: 4px 4px 0 0; }
.edit-schedule .nav-tabs.nav-justified>li { display: table-cell;  width: 1%; } /* 小裝置仍要在一排不換行*/
@media (max-width:767px) { .edit-schedule .nav-tabs .nav-link { font-size: 14px; } }

.edit-schedule .alert { padding: 15px 35px 15px 15px; margin-bottom: 10px; }

.edit-schedule .modal-header .modal-title { margin-right: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.edit-schedule .modal-header .visit-mark {position: absolute; right: 30px; top: 30px; }
@media (max-width:374px) { 
	.edit-schedule .modal-header .modal-title { margin-right: 0; }
	.edit-schedule  .modal-header .visit-mark { position: relative; right: 10px; top: 0; margin: 5px 0;} 
}

.edit-schedule .p-lr-0 { padding-left: 0; padding-right: 0 }
.edit-schedule .p-lr-6 { padding-left: 6px; padding-right: 6px }
.edit-schedule .p-r-5 { padding-right: 5px}
.edit-schedule .p-r-12 { padding-right: 12px}
.edit-schedule .m-b-10 { margin-bottom: 10px !important}
.edit-schedule .m-b-15 { margin-bottom: 15px !important}
.edit-schedule .year .input-lg, .edit-schedule .month .input-lg, .edit-schedule .day .input-lg, 
.edit-schedule .hour .input-lg, .edit-schedule .minu .input-lg { padding: 10px 3px; text-align: center; text-align-last: center;  }
.edit-schedule .datetime { padding-right: 30px }
.edit-schedule .datetime:before { position: absolute; content: ""; right: 6px; top: 10px; }
.edit-schedule .year:before { content: "年"; }
.edit-schedule .month:before { content: "月"; }
.edit-schedule .day:before { content: "日";  }
.edit-schedule .hour:before { content: "時";  }
.edit-schedule .minu:before { content: "分";  }
.edit-schedule .control-label {font-size: 14px; }
/* @media (min-width: 768px) { .modal-dialog { width: 700px; } } */

.edit-schedule .activity-item { margin-bottom: 8px; }
.edit-schedule .activity-item:last-child { margin-bottom: 0px }
.edit-schedule .activity-item .title { font-size: 11pt; margin-top: 5px; color: #648420;}
.edit-schedule .activity-item .title:before { content: "\f02c"; padding-right: 5px; }

.edit-schedule .activity-item .item-group { margin-top: 5px; min-height: 195px; overflow: hidden; overflow-y: auto; }
.edit-schedule .activity-item .item { padding: 7px 5px; border-bottom: 1px dotted #ddd; }
.edit-schedule .activity-item .item:last-child { border-bottom: none; }

/* 為了與 toggle 同一排 */
.edit-schedule .activity-item .item .checkbox { display: inline-block; margin-top: 0; margin-bottom: 0;  }
.edit-schedule .activity-item .item .checkbox label { padding-left: 0; }

.edit-schedule .cust-schedule, 
.edit-schedule .cust-schedule .choice .search .result .search-data { margin-bottom: 0px}
.edit-schedule .cust-schedule .choice .search { max-height: 200px; overflow: hidden; overflow-y: auto; padding: 0 }
.edit-schedule .cust-schedule .choice .search .result .search-data,
.edit-schedule .cust-schedule .choice .search-keyword { background: rgba(var(--default-color),0.2); }
.edit-schedule .cust-schedule .choice .search .result .search-data .cust .media { height: 45px; background:white; }
.edit-schedule .cust-schedule .choice .search-keyword { position:relative; padding: 5px }
.edit-schedule .cust-schedule .choice .choice-cust { text-align:center; margin-bottom: 15px; }
.edit-schedule .cust-schedule .choice .choice-cust .title { padding: 5px; font-size: 14px; color: white; background: #aaa; }
.edit-schedule .cust-schedule .choice .choice-cust .name { padding: 10px; border: 1px dashed #ccc; border-top: none; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; }
@media (max-width:767px) { 
	.edit-schedule .cust-schedule .choice .search { max-height: 250px }
}

/** target **/

@media (max-width: 767px) {
	.cust-schedule .target .active .cc-div-table-row > .cc-div-table-cell {
    	display: inline-block;
	}
	.cust-schedule .target .active .cc-div-table-row > .cc-div-table-cell:first-child {
    	border-bottom: none; font-size: 85%; padding-bottom: 0; padding-top: 10px;
	}
	.cust-schedule .target .active .cc-div-table-row > .cc-div-table-cell input {
		min-width: auto;
	}
}