strong { font-weight: 700; }
body { background-color: #f6f6f6; font-size: 14px; color: #351611; font-family: Helvetica Neue, Arial, Helvetica, sans-serif; }
body.home-index-index, body.register-index-index  { background-color: #fff; }

* { box-sizing: border-box; }
.fl { float: left; }
.fr { float: right; }
.tal { text-align: left !important; }
.tac { text-align: center !important; }
.strong { font-weight: bold; }
.clear { clear: both; }
.clearfix:after { content: ''; display: table; clear: both; }
.pointer { cursor: pointer; }

input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset !important; }

a { text-decoration: none; color: #351611; }
a:hover { text-decoration: underline; }
img { height: auto; }
img.filetype { width: 30px; height: 30px; }
.logo img { width: 260px; }

.rptis-hidden { display: none !important; }

.gray { color: #999; }
.blod { font-weight: 700; }
.eighteen { line-height: 18px; }
.thirtytwo { line-height: 32px; }
.border-right { border-right: 1px solid #ddd; }

.relative { position: relative; }
.ofh { overflow: hidden; }
.bg-white { background: #fff; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.justify-between { justify-content: space-between; }
.w-5 { width: 2rem; }
.h-5 { height: 2rem; }
.px-4 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.leading-5 { padding-left: 1.5rem; }

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

.red { color: #ff0000; }
.underline { text-decoration: underline; }

.col1 { width: 9%; }
.col2 { width: 19%; }
.col4 { width: 39%; }
.col5 { width: 49%; }
.col6 { width: 59%; }
.col8 { width: 79%; }
.col9 { width: 89%; }

.right-column>.page { margin: 30px 0 50px; }
.pagination { text-align: center; }
.pagination li { display: inline-block; }
.pagination li span, .pagination li a { display: inline-block; padding: 8px 0; border-radius: 5px; min-width: 30px; margin: 10px; color: #ab9b7f; }
.pagination li.active span { background-color: #ab9b7f; color: #fff; }
.page a, .page span { line-height: 30px; background: #fff; }
.page > span span { font-weight: bold; text-decoration: underline; }
.page p { background: #fff; }

input::placeholder, textarea::placeholder {  font-size: 14px; color: #ddd; }
input[disabled], textarea[disabled] { border: none; background-color: #eef3f7; }
input.hidden { display: none; }
select { background: #fff; }
input { padding: 5px 10px; }
textarea { padding: 10px; font-family: Helvetica Neue, Arial, Helvetica, sans-serif; }
input, select, textarea { line-height: 17px; border-radius: 3px; border-color: #ddd; min-width: 200px; }
input[type="radio"] { min-width: initial; }
table input, table select { min-width: 0; }
select { height: 29px; }

h1 { padding: 10px 0px 40px 20px; font-size: 24px; }
h2 { font-size: 18px; margin-bottom: 10px; }
.right-column .block { margin-bottom: 30px; }
.right-column h1 { font-size: 18px; line-height: 30px; border-bottom: 1px solid #ddd; color: #351611; background: #fff; padding: 10px 30px; text-transform: uppercase; }
.right-column h1 i { font-style: italic; }
.right-column h1 a { margin-left: 10px; }
.right-column h1 .inbox-container { position: absolute; top: 10px; right: 30px; }
.right-column h1 a.header-icon { margin: 0; }
.right-column h1 a.header-icon:hover { text-decoration: none; font-weight: bold; }

.btn { display: inline-block; background-color: #351611; color: #fff; transition: .1s all ease-in-out; padding: 5px 10px; font-size: 14px; line-height: 20px; border-radius: 3px; text-transform: uppercase; cursor: pointer; }
.btn:hover, .btn-set .btn-login:hover, .btn-set .btn-submit:hover { opacity: 0.8; text-decoration: none; }
.btn-set .btn-login, .btn-set .btn-submit {  font-size: 14px; width: 100px; text-align: center; border-radius: 3px; }
.btn.disabled { opacity: 0.5; pointer-events: none; }

:root { --spinner-icon: '\e600'; }

@keyframes spin {
    from { transform: rotateZ(0); }
    to { transform: rotateZ(360deg); }
}
.btn-loading { pointer-events: none; position: relative; text-indent: -200%; opacity: 0.8; }
.btn-loading:before { content: var(--spinner-icon); position: absolute; left: 0; right: 0; font-size: 20px; text-indent: 0; text-align: center; font-family: "iconfont" !important; transform-origin: 50% 49%; animation-duration: 2s; animation-name: spin; animation-iteration-count: infinite; }

.loading-report { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.loading-report .spinner { display: inline-block; font-size: 18px; animation: spin 2s linear infinite; }
.loading-report .spinner:before { content: var(--spinner-icon); font-family: "iconfont" !important; display: block; }
.loading-error { color: #c00; }

.left-sidebar { transition: all .1s ease-in-out; width: 60px; position: fixed; top: 0; bottom: 0; left: 0; background-color: #351611; z-index: 100; box-shadow: 0 0 3px #000000; }
.left-sidebar .iconfont { font-size: 24px; }
.left-sidebar nav { position: relative; }
.left-sidebar nav > ul > li .submenu { display: none; position: absolute; top: 0; left: 90px; padding: 30px 90px 30px 30px; background: #fff; box-shadow: 0 0 3px #ddd; width: 370px; min-height: 700px; }
.left-sidebar nav > ul > li.item-marketing .submenu { width: 550px; }
.left-sidebar nav > ul > li.item-marketing .submenu > ul > li { width: 50%; }
.left-sidebar:hover nav > ul > li .submenu.active { display: block; }
.left-sidebar nav > ul > li .submenu .submenu-title { font-size: 24px; font-weight: bold; padding: 0 15px; }
.left-sidebar nav > ul > li .submenu .btn-close { position: absolute; right: 30px; top: 30px; font-size: 36px; color: #351611;  }
.left-sidebar nav > ul > li .submenu .btn-close:hover { opacity: 0.8; }
.left-sidebar nav > ul > li .submenu > ul { margin: 40px 0 0; display: flex; flex-direction: row; flex-wrap: wrap; }
.left-sidebar nav > ul > li .submenu > ul > li.title { padding: 12.5px 15px; font-weight: bold; font-size: 16px; width: 100% !important; }
.left-sidebar nav > ul > li .submenu > ul > li { width: 100%; }
.left-sidebar nav > ul > li .submenu > ul > li > a { display: block; padding: 12.5px 15px; text-align: left; }
.left-sidebar nav > ul > li .submenu > ul > li > a:hover { background-color: #f8f3f0; }
.left-sidebar nav > ul > li > a { text-align: center; color: #aaa6a0; padding: 17px 0; display: block; }
.left-sidebar nav > ul > li > a:hover { text-decoration: none; }
.left-sidebar .title { margin-top: 10px; font-size: 12px; letter-spacing: -0.2px; display: none; }
.left-sidebar nav > ul > li:hover > a,
.left-sidebar nav > ul > li.active > a,
.left-sidebar .logout a:hover { color: #fcfcfc; }
.left-sidebar nav > ul > li:hover > a .title,
.left-sidebar nav > ul > li.active > a .title,
.left-sidebar .logout a:hover .title { font-weight: bold; }
.left-sidebar nav > ul > li.active { background-color: #351611; }

.left-sidebar .logout { position: absolute; bottom: 0; left: 0; width: 100%; }
.left-sidebar .logout span { display: none; }
.left-sidebar .logout a { text-align: center; color: #aaa6a0; padding: 17px 0; display: block; }
.left-sidebar .logout a:hover { text-decoration: none; }

.left-sidebar:hover { width: 90px; }
.left-sidebar:hover .title { display: block; }
.left-sidebar:hover .logout span { display: block; }

.tip { margin: 5px 0; }

.right-column { width: calc(100% - 60px); position: absolute; top: 0; left: 60px; background-color: #fff; }
.right-column>.logo { padding: 10px 30px; text-align: left; border-bottom: 1px solid #ddd; background-color: #fff; }
.right-column>.logo .welcome { padding-top: 10px; display: flex; justify-content: space-between; }
.right-column>.logo .title { font-size: 30px; }
.right-column>.logo .content { font-size: 16px; font-weight: 400; }
.right-column .new-season { padding: 20px; min-width: 966px; }
.right-column .new-season .btn-add { background-color: #ab9b7f; padding: 12px 20px; border-radius: 5px; }
.right-column .list-items table { width: 100%; min-width: 900px; text-align: left; border: 1px solid #ddd; }
.right-column .list-items table.fix-header { position: relative; }
.right-column .list-items table.dataTable { margin-top: 10px; }
.right-column .list-items thead { border-bottom: 1px solid #ddd; }
.right-column .list-items table.fix-header > thead { position: sticky; top: 0; z-index: 1; background: #fff; border-bottom: 1px solid #333; box-shadow: 1px 0px 30px 1px #ddd; }
.right-column .list-items .order .desc, .right-column .list-items .order .asc { background-color: #f9f8f3; }
.right-column .list-items .order .desc:after { content: "\eb04"; font-family: 'iconfont' !important; }
.right-column .list-items .order .asc:after { content: "\eb05"; font-family: 'iconfont' !important; }
.right-column .list-items .order .no { pointer-events: none; }

.right-column .list-items table tr { border-top: 1px solid #ddd; }
.right-column .list-items table tr:first-child { border-top: none; }
.right-column .list-items table tr:nth-child(odd) { background-color: #fff; }
.right-column .list-items table tr:nth-child(even) { background-color: #f8f3f0;  }
.right-column .list-items table tr.total { background: #ddd; }
.right-column .list-items table tr.default { background: #ffe8e8; }
.right-column .list-items table tr.archived { opacity: 0.5; }
.right-column .list-items table td.actions a { margin-right: 10px; }
/*.right-column .list-items table tr:hover, .right-column .list-items table tr th:hover { background-color: #f9f8f3; }*/
/*.right-column .list-items table tr:first-child:hover { background-color: #fff; }*/
.right-column .list-items table th, .right-column .list-items table td { padding: 20px 5px; text-align: center; vertical-align: middle; position: relative; }
.right-column .list-items table th { font-weight: bold; }
.right-column .list-items table tr.filters th { font-weight: normal; }
/*.right-column .list-items .order .no.status { padding-left: 30px; }*/

.right-column .btn-set { padding: 10px 0; }

.ms-options { text-align: left; }
.right-column .list-items table .ms-options-wrap { width: 90px; margin: 0 auto; }
.right-column .list-items table .col-warehouse .ms-options-wrap { width: 200px; }

.right-column .list-items table .col-warehouse { width: 9%; }
.right-column .list-items table .col-article { width: 9%; }
.right-column .list-items table .col-color { width: 9%; }
.right-column .list-items table .col-size { width: 9%; }
.right-column .list-items table .col-season { width: 9%; }

.right-column .list-items .packing-details input[type="text"] { width: 50px; text-align: center; }
.right-column .list-items .packing-details input.ipt-article { width: 100px; }

.right-column .list-items .border-left { border-left: 1px solid #ddd; }

.right-column .list-items input[type="text"] { width: 110px; height: 36px; }
.right-column .list-items select { width: 50px; height: 36px; line-height: 18px; border-radius: 3px; border-color: #ddd; padding-left: 5px;}
.right-column .list-items #customer-select { width: 160px;}

.right-column .list-items .filters select { width: 200px; }

.right-column .content { padding: 30px; background: #f6f6f6; }
.right-column .form-holder .entry { padding-bottom: 10px; }
.right-column .form-holder .entry label { margin-bottom: 10px; width: 100%; float: left; }

.col-country { width: 10%; }
.col-qty { width: 10%; }
.col-invoiced { width: 6%; }

.right-column .item-info { width: 66.66666%; position: relative; }
.right-column .item-info .entry { width: 50%; float: left; margin-bottom: 20px; }
.right-column .item-info .entry.thumbnail { position: absolute; top: 0; right: 0; width: 74px; border: 1px solid #ddd; padding: 5px; }
.right-column .item-info .entry.thumbnail img { width: 100%; }
.right-column .item-info .entry .label { font-weight: bold; margin-bottom: 5px; }
.right-column .item-info .entry .value { width: 50%; }
.right-column .item-info .entry .value input, .right-column .item-info .entry .value select { width: 100%; }

.right-column .info-details p { padding-top: 20px; }
.right-column .info-details h2 { line-height: 30px; }

/* Replacment report Date editor */
.right-column .open-write { position: absolute; top: 0; right: 60px; z-index: 101; border: 1px solid #ddd; background: #fff; }
.right-column .comment { padding: 5px; }
.right-column .comment textarea { width: 100%; min-height: 200px; padding: 12px; border-radius: 5px; line-height: 18px; }
.right-column .comment .links { display: flex; justify-content: space-around; margin-top: 5px; }
.right-column .comment .links .btn { width: 100px; text-align: center; cursor: pointer; }
.right-column .comment .links .btn.cancel { background-color: #ddd; color: #351611; }
.right-column .open-write.remarks .comment { display: none; }
.right-column .open-write.remarks .comment.active { display: block; }
.right-column td.date-edit:hover { background-color: #ddd; }

.btn-set .btn-submit.active, .btn-set .btn-login.active { background-color: #eee; pointer-events: none; }
.btn-set .btn-submit.service-add { position: relative; }

.home-index-index { width: 600px; margin: 130px auto; }

.home-form { box-shadow: 0px 3px 10px 3px #ccc; border-radius: 8px; }
.home-form .title { padding: 50px; text-align: center; }
.home-form h1 { font-size: 32px; }
.home-form .form-holder { width: 420px; margin: auto; }
.home-form .form-group { margin-bottom: 32px; }
.home-form .form-group:nth-child(2) { margin-bottom: 15px; }
.home-form .form-group.has-error input { border-color: #ce1d25;  font-size: 14px; }
.form-group.has-error .with-errors { margin-top: 4px; color: #ce1d25; }
.home-form .form-group label { display: block; margin-bottom: 15px; }
.home-form .form-group input { display: block; width: 100%; padding: 8px 10px; border-radius: 5px; margin-bottom: 10px; }
input:focus, textarea:focus, select:hover { border-color: #7bd4f4; }
.home-form .links .link {  font-size: 14px; color: #bdbdbd; text-decoration: underline; }
.home-form .links .link:hover { color: #7bd4f4; }
.home-form .btn-set { text-align: right; padding: 40px 0; position: relative; }

.order-uploads { margin-bottom: 10px; }

.report-menu ul li { line-height: 24px; }
.report-menu ul li a { opacity: 0.3; }
.report-menu ul li a.active, .report-menu ul li a:hover { opacity: 1; }
.report-content { display: none; }
.report-content.active { display: block; }

.alert.messages { position: fixed; width: 80%; text-align: center; bottom: 50px; margin: 0 auto; left: 0; right: 0; background: #fff8f8; opacity: 0.7; }
.alert.messages ul li { padding: 10px 0; font-size: 18px; border: 1px solid #ff6965; background: #ff6965; color: #fff; border-radius: 3px; margin-top: 10px; }
.alert.messages ul li.success-msg { background: #5AB643; border-color: #5AB643; }

.maker-index .col-id,
.maker-index .col-code,
.maker-index .col-rule,
.maker-index .col-action { width: 40px; }
.maker-index .col-fob, .maker-index .col-payment-terms { width: 150px; }
.maker-index .col-name { width: 150px; }

.maker-index .col-rule { position: relative; }
.maker-index .col-rule .rule-container { display: none; position: absolute; background: #fff; right: 0; top: 0; border: 1px solid #ddd; z-index: 1; padding: 4px; }
.maker-index .col-rule:hover .rule-container { display: block; }

.btn-collapse { text-align: center; position: relative; cursor: pointer; }
.btn-collapse:hover { opacity: 1; }
.btn-collapse > ul { display: none; width: 100%; position: absolute; left: 0; top: 30px; background: #fff; z-index: 10; border-style: solid; border-color: #ddd; border-width: 0 1px 1px; line-height: 30px; padding: 5px; }
.btn-collapse:hover > ul { display: block; }

.sales-widget { border: 1px solid #ddd; width: 100%; padding: 10px; }

.rptis-chart { display: none; width: 100%; }
.dropdown { position: relative; }
.dropdown:hover .dropdown-menu { display: block; }
.dropdown .dropdown-menu { display: none; position: absolute; width: 200%; background: #fff; z-index: 10; border: 1px solid #ddd; }
.dropdown .dropdown-menu a { font-size: 12px; width: 100%; display: block; padding: 20px; background: #fff; color: #351611; transition: .1s all ease-in-out; }
.dropdown .dropdown-menu a:hover { background: #351611; color: #fff; text-decoration: none; }
.ui-widget-overlay { opacity: 0.7 !important; }

.block.new .block-title { border-bottom: 1px solid #ddd; padding-bottom: 10px; margin-bottom: 10px; cursor: pointer; }
.block.new .block-content { display: none; }
.block.new.active .block-content { display: block; }

.stockmanagement-moveIndex .entry-radio { float: left; margin-right: 10px; margin-bottom: 10px; }
.table-stock-move { float: left; min-width: initial !important; width: auto !important; clear: both; }
.table-stock-move.table-header { margin-top: 10px; margin-bottom: 10px; }
.table-stock-move.table-shops { height: 400px; display: block; overflow:scroll; }
.table-stock-move tbody tr.shop { display: none; }
.table-stock-move tbody tr.shop.active { display: revert; }
.table-stock-move tbody td.active:hover,
.table-stock-move tbody td.selected { background: #5AB643; color: #fff; }
.table-stock-move tbody td.warning { background: #DC472F; color: #fff; }
.table-stock-move tbody td .difference { display: none; }
.table-stock-move tbody td.selected .difference { display: revert; }
.table-stock-move .col-code { width: 100px; }
.table-stock-move .col-warehouse { width: 200px !important; }
.table-stock-move .col-size { width: 100px !important; }
.table-stock-move th.statistics, .table-stock-move td.statistics { width: 50px; }

.quote-content { display: none; font-size: 14px; line-height: 20px; text-transform: none; position: fixed; width: 300px; height: 100%; top: 0; right: 0; background: #fff; padding: 20px 0; box-shadow: 0 0 5px 2px rgb(0 0 0 / 15%); z-index: 100; }
.quote-content .btn-close { position: absolute; top: 10px; right: 10px; }
.quote-content .btn-submit { margin: 0; width: 100%; text-align: center; position: absolute; bottom: 20px; }
.quote-content .btn-submit.disabled { opacity: 0.5; cursor: no-drop; }
.quote-content.active { display: block; }
.quote-content p.title { text-align: center; margin-bottom: 20px; font-weight: bold; }
.quote-content .items { padding: 10px 0; height: calc(100% - 100px); overflow: scroll; }
.quote-content .items .item { position: relative; border-bottom: 1px solid #ddd; padding: 10px 20px; }
.quote-content .items .item.back-to-nvp { background: #eee; }
.quote-content .items .item .article { font-weight: bold; margin-bottom: 5px; }
.quote-content .items .item .to { font-weight: bold; }
.quote-content .status { position: absolute; top: 10px; right: 20px; }
.quote-content .status.pending { color: red; }
.quote-content .status.sent { color: green; }
.quote-content .status.cancelled { color: #aaa; }
.quote-content .item .action { margin-top: 5px; }
.quote-content .item .action a { margin: 0; text-decoration: underline; }
.btn-add-to-buffer { float: left; display: block; }

@media screen and (max-height: 720px) {
    .left-sidebar .title { display: none; }
}

/* Hitparade */
tr.cancelled td { background: #ff7c7c63; }

/* Specs */
span.status { border: 1px solid #ddd; padding: 10px; display: block; width: 130px; text-align: center; }
span.status.empty { background: #f6f6f6; }
span.status.status-pending { background: #ffe59a; }
span.status.status-processing, span.status.draft { background: #ffe9d3; }
span.status.status-complete, span.status.approved { background: #e5fbdb; }
span.status.status-4 { background: #e16666; }
span.status.published { background: #ddddff; }

/* Marketing */
.medium-container { display: flex; flex-wrap: wrap; width: 100%; }
.medium-container .medium-section { width: 100%; margin-bottom: 20px; }
.medium-container .medium-section h2 { font-size: 18px; margin-bottom: 10px; border-bottom: 1px solid #ddd; padding-bottom: 10px; font-weight: bold; }
.medium-container .media-container { display: flex; flex-wrap: wrap; }
.medium-container .media-container .img-container, .medium-container .media-container .video-container { position: relative; }
/* .medium-container .media-container .img-container .icon-tags, .medium-container .media-container .video-container .icon-tags { position: absolute; bottom: -20px; right: 0; padding: 5px; } */
/* .medium-container .media-container .video-container .icon-tags { bottom: -10px; } */
.medium-container .media-container .actions { margin-bottom: 10px; }
.medium-container .media-container .actions a.fl { margin-right: 5px; }
.medium-container .media-container .actions a.fr { margin-left: 5px; }
.medium-container .media-container .img-container a, .medium-container .media-container .video-container a { text-decoration: none; }
.medium-container .media { padding: 5px; width: 200px; margin-right: 10px; margin-bottom: 10px; position: relative; }
.medium-container .media .dimension { opacity: 0.7; position: absolute; top: 10px; left: 30px; background: #fff; padding: 0; z-index: 10; }
.medium-container .media.duplicate { opacity: 0.5; }
.medium-container .media .placeholder-processing { width: 100%; border: 1px solid #ddd; padding: 50px 20px; text-align: center; margin-bottom: 10px; }
.medium-container .media img { width: 100%; margin-bottom: 5px; }
.medium-container .media video { width: 100%; margin-bottom: 5px; }
.medium-container .media .tags { margin-top: 10px; }
.medium-container .media .tags .tag { width: 100%; line-height: 24px; list-style: disc inside; text-indent: -1em; padding: 0 0 0 1em; text-transform: uppercase; }
.medium-container .media .filename { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; position: relative; }
.medium-container .media .filename input { padding: 5px 10px 5px 25px; width: 100%; min-width: initial; }
.medium-container .media .filename .icon-edit, .medium-container .media .filename .icon-ok { display: none; position: absolute; top: 5px; left: 5px; padding: 2px; font-size: 12px; font-weight: bold; text-decoration: none; }
.medium-container .media .filename .icon-ok { color: green; }
.medium-container .media .filename .icon-edit.active, .medium-container .media .filename .icon-ok.active { display: block; }
.medium-container .media:hover .btn-remove-media { display: block; opacity: 1; }
.medium-container .media .icon-featured.icon-star { display: block; }
.medium-container .media .icon-featured.icon-star-full { display: none; }
.medium-container .media.featured { background: repeating-linear-gradient( -45deg, #eb5b003c 2px, #eb5b001c 3px, #eb5b001c 4px, #eb5b003c 7px); }
.medium-container .media.featured .icon-featured.icon-star { display: none; }
.medium-container .media.featured .icon-featured.icon-star-full { display: block; }
.medium-container .media .icon-featured.icon-star-full { color: #EB5B00; }
.medium-container .media .btn-remove-media { padding: 5px; background: rgba(255, 255, 255, 1); position: absolute; top: 0; right: 0; z-index: 1; opacity: 0; transition: all .1s ease-in-out; }
.medium-container .media .btn-remove-media:hover { text-decoration: none; }

.media-planner { background: #fff !important; padding: 0 !important; height: 100%; display: flex; }
.media-planner h2 { margin-bottom: 10px; position: relative; }
.media-planner .section-media { border-right: 1px solid #ddd; background: #eee; padding: 30px 0 30px 30px; }
.media-planner .section-workzone { padding: 30px 30px 30px 30px; }
.media-planner .filters { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #ddd; }
.media-planner .filters select { width: 220px !important; }
.media-planner .filters .fields { display: flex; flex-wrap: wrap; flex-direction: row; width: 90%; justify-content: left; }
.media-planner .filters .entry { margin-bottom: 10px; width: 46%; }
.media-planner .section-workzone .filters .fields .entry { width: 33%; }
.media-planner .filters .entry .label { margin-bottom: 5px; font-weight: bold; }
.media-planner .ms-options-wrap { position: relative; }
.media-planner .ms-options-wrap input[type="checkbox"] { min-width: initial !important; }
.media-planner .ms-options-wrap > button { padding: 10px !important; border-radius: 3px; border: 1px solid #ddd !important; }
.media-planner .ms-options-wrap > .ms-options > ul label { padding: 6px 4px 4px 25px; }
.media-planner .medium-container { margin-top: 20px; width: 95%; overflow: scroll; height: calc(100% - 324px); }

.media-planner .event-content .drop.drop-final { background: repeating-linear-gradient(-45deg, #eee 2px, #79dfff 3px, #eee 4px, #79dfff 7px) }
.media-planner .event-content .drop.drop-final form { min-height: inherit; background: none; border: none; padding: 0; width: 100%; clear: both; }
.media-planner .event-content .drop.drop-final form .dz-message { text-decoration: underline; margin: 0; }

.media-planner .planfile-container { position: relative; }

.media-planner .planfile-container .toolbar { padding: 10px; margin-bottom: 20px; border: 1px solid #ddd; }
.media-planner .planfile-container .toolbar h3 { font-weight: bold; float: left; margin-right: 20px; line-height: 20px; }
.media-planner .planfile-container .toolbar .iconfont { font-size: 20px; cursor: pointer; }

.planner-index .right-column { overflow: hidden; height: 100%; }
.media-planner .workfile-container .event-content { overflow-y: scroll; overflow-x: scroll; height: 600px; }
.media-planner .workfile-container h2 { background: #ddd; padding: 10px; }
.media-planner .workfile-container h2.event-status-1 { background: #ffe9d3;}
.media-planner .workfile-container h2.event-status-2 { background: #94c47e; }
.media-planner .workfile-container h2.event-status-3 { background: #ddddff; }
.media-planner .event-content table { overflow: auto; border-collapse: collapse; height: 1px; width: 100%; min-width: auto; }
.media-planner .event-content table th { border-top: 1px solid #ddd; position: sticky; top: 0; z-index: 2; background: #eee; }
.media-planner .event-content table th a.iconfont { text-decoration: none; }
.media-planner .event-content table td { padding: 10px 5px; }
.media-planner .event-content table .col-date { width: 150px; }
.media-planner .event-content table input[type="text"] { width: 200px; }
.media-planner .event-content table input[type="radio"] { display: none; }
.media-planner .event-content .iconfont { text-decoration: none; color: #333; opacity: 0.8; font-size: 20px; }
.media-planner .event-content table .btn-remove-row { display: none; }
.media-planner .event-content .iconfont:hover { text-decoration: none; opacity: 1; }
.media-planner .event-content .drop { border: 1px solid #ddd; width: 100%; height: 100%; min-width: 150px; min-height: 40px; overflow: hidden; position: relative; background: repeating-linear-gradient( -45deg, #eee 2px, #ccc 3px, #eee 4px, #ccc 7px); }
.media-planner .event-content .drop.flex { display: flex; }
.media-planner .event-content .entry .drop { width: 100%; margin-bottom: 10px; }
/* .media-planner .event-content .entry .drop .dropzone { width: 50%; float: right; } */
.media-planner .event-content .drop span { position: absolute; left: 0; right: 0; bottom: 0; color: #351611; display: block; text-align: center; }
.media-planner .event-content .drop.active, .media-planner .event-content .drop:hover { border: 1px solid #351611; }
.media-planner .event-content .drop.active span, .media-planner .event-content .drop:hover span { color: #333; }
.media-planner .event-content .drop .media { background: #fff; overflow: hidden; width: 150px; float: left; margin-right: 1px; position: relative; border: 1px solid #ddd; padding: 2px; }
.media-planner .event-content .drop .media .icon-adobe { width: 80px; height: 110px; font-size: 80px; margin: 0 auto; }
.media-planner .event-content .drop .media a.remove { position: absolute; padding: 5px; background: rgba(255, 255, 255, 0.5); top: 0; right: 0; z-index: 1; }
.media-planner .event-content .drop .media a.remove:hover { background: rgba(255, 255, 255, 1); text-decoration: none; }
.media-planner .event-content .drop .media img { width: 100%; }
.media-planner .event-content .drop .media video { width: 100%; }
.media-planner .event-content .drop .media .filename { display: block; background: #fff; color: #333; }
.media-planner .event-content .drop .media .tags { display: none; }
.media-planner .event-content .drop .media .remove { position: absolute; right: 0; top: 0; background: #fff; padding: 5px; opacity: 0.5; text-decoration: none; }
.media-planner .event-content .drop .media:hover .remove { opacity: 1; }
/* .media-planner .event-content .drop .dropzone.dz-clickable { height: 100%; border: none; } */
.media-planner .event-content .group { background: #f8f3f0; padding: 20px; border: 1px solid #ddd; margin-bottom: 20px; }
.media-planner .event-content .entry { margin-bottom: 10px; }
.media-planner .event-content .entry .label { margin-bottom: 10px; font-weight: bold; }
.media-planner .event-content .entry .value input[type="text"] { width: 100%; }
.media-planner .event-content .entry .value textarea { width: 100%; height: 80px; font-family: Helvetica Neue, Arial, Helvetica, sans-serif !important; }
.media-planner .event-content .entry .sub-entry { margin-bottom: 10px; }
.media-planner #calendar { display: none; position: absolute; right: 0; top: 0; width: 70%; top: 100%; background: #fff; border: 1px solid #ddd; padding: 20px; z-index: 100; box-shadow: 3px 3px 10px 5px #ddd; }
.media-planner #calendar.active { display: block; }
.media-planner .input-tagline { font-weight: bold; width: 100% !important; text-align: center; padding: 10px; margin-bottom: 20px; text-transform: uppercase; }
.fc .fc-daygrid-event-harness a { cursor: pointer; }

.tags-container { position: absolute; background: #fff; padding: 10px; z-index: 100; border: 1px solid #ddd; top: calc(100% + 20px); box-shadow: 1px 1px 5px 0px #ddd; }
.tags-container > .btn-close { position: absolute; right: 10px; top: 10px; }
.tags-container .tags { margin-bottom: 10px; }
.tags-container .tags .tag { width: 100%; line-height: 24px; display: block; position: relative; }
.tags-container .tags .tag a { float: right; }
.tags-container .input-holder { position: relative; }
.tags-container .input-holder input { margin-bottom: 10px; }
.tags-container .input-holder .hints { position: absolute; background: #fff; padding: 10px; border: 1px solid #ddd; z-index: 100; width: 100%; top: 28px; display: none; }
.tags-container .input-holder .hints.active { display: block; }
.tags-container .input-holder .hints .tag { display: block; padding: 5px 10px; }
.tags-container .input-holder .hints .tag:hover { text-decoration: underline; }
.tags-container .input-holder .btn-close-hints { position: absolute; right: 10px; top: 6px; display: none; }
.tags-container .input-holder .hints.active + .btn-close-hints { display: block; }

.workfile-index .status { display: inline-block; font-weight: 500; }
.workfile-index .event-action { display: block; width: 100%; margin-top: 1px; }

.group.collapsable .entry { position: relative; padding: 10px; }
.group.collapsable .entry > .value { display: none; }
.group.collapsable .entry { margin-bottom: 0 !important; }
.group.collapsable .entry .label { margin-bottom: 0 !important; cursor: pointer; }
.group.collapsable .entry .btn-collapse { position: absolute; top: 10px; right: 10px; }
.group.collapsable .entry .btn-collapse a { text-decoration: none; display: inline-block; transition: .1s all ease-in-out; }
.group.collapsable .entry .btn-collapse a:hover { rotate: 90deg; }

.group.collapsable .entry.active > .value { display: block; }
.group.collapsable .entry.active .label { margin-bottom: 10px !important; }
.group.collapsable .entry.active .btn-collapse a { rotate: 90deg; }

.group .entry.done { background: #f2ffeb; }