/* Machine Documents Dashboard — front-end styles */

.mdoc-dashboard {
	font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: #000;
}
.mdoc-documents-panel{
    width:100%;
    max-width:824px;
}
div#mdoc-service-policy .mdoc-header-text,div#mdoc-warranty-guidelines .mdoc-header-text  {
    padding: 25px 0 15px 36px;

}

.mdoc-container {
	display: flex;
	gap: 37px;
	align-items: flex-start;
	max-width: 1102px;
	margin: 0 auto;
	flex-wrap: wrap;
}

/* Panels */
.mdoc-panel {
    background: #fff;
    border: 1.5px solid #AEAEAE;
    border-radius: 14px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}

/* Sidebar */
.mdoc-sidebar {
    flex: 0 0 241px;
    max-width: 241px;
    padding: 0;
    min-height: 341px;
}
.mdoc-documents-panel{
	min-height:341px;
}


.mdoc-machine-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mdoc-machine-item {
	padding: 7.5px 14px;
	cursor: pointer;
	font-weight: 500;
	font-size: 14px;
	transition: background-color 0.15s ease, color 0.15s ease;
	background:none;
}

.mdoc-machine-item:hover {
	background: #ececec;
}

.mdoc-machine-item.active {
	background: #ef5e07;
	color: #fff;
}

/* Content area */
.mdoc-content {
	flex: 1 1 824px;
	min-width: 300px;
	min-height:341px;
}

.mdoc-documents-panel {
	display: none;
}

.mdoc-documents-panel.active {
	display: block;
}

.mdoc-panel-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 16px;
}

.mdoc-header-thumb {
    padding-left: 32px;
}

.mdoc-header-thumb .mdoc-header-img {
    display: block;
    width: auto;
    height: 100%;
    max-height: 64px;
    object-fit: contain;
    border-radius: 6px;
}

.mdoc-header-text {
	flex: 1 1 auto;
}

.mdoc-panel-header h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
}

.mdoc-header-subtitle {
	margin: 2px 0 0;
	font-size: 14px;
	color: #000;
	font-weight: 400;
}

/* Table */
.mdoc-documents-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.mdoc-documents-table th {
    text-align: left;
    padding: 10px 12px;
    padding-left: 36px;
    border: none;
    font-weight: 700;
    color: #000000;
    background: #F1F1F1;
	    width: 33%;
}

.mdoc-documents-table td {
    padding-top: 5px;
    padding-bottom: 6px;
	padding-left:36px;
	border:none;
    border-bottom: 1.5px solid #C8C8C8;
    vertical-align: middle;
	font-weight:500;
}

.mdoc-action-cell {
	display: flex;
	gap: 8px;
	white-space: nowrap;
}

/* Buttons */
.mdoc-btn {
    display: inline-block;
    padding: 8px 13px 8px 14px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 600;
    text-decoration: none;
    line-height: 1;
    transition: background-color 0.15s ease;
    align-self: center;
	text-transform:uppercase;
}

.mdoc-btn-preview {
    color: #000;
    border: 1px solid #ddd;
    display: flex;
    gap: 4px;
	font-weight:600;
}

.mdoc-btn-preview:hover {
	background: #e4e4e4;
	color:#000;
}
.mdoc-btn-download {
    background: #ef5e07;
    color: #fff;
    padding: 6px 6px !important;
    display: flex;
    align-items: center;
    gap: 4px;
}


.mdoc-btn-download:hover {
	background: #d94e06;
}

.mdoc-no-file,
.mdoc-empty {
	color: #999;
	font-size: 13px;
	font-style: italic;
}
.mdoc-panel-header{
    margin-bottom:0px;
}

.mdoc-header-text{
    display:flex;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
}

.mdoc-header-thumb img{
    width:80px;
    height:80px;
    object-fit:contain;
    display:block;
}

.mdoc-header-text h3{
    margin:0;
    font-size:15px;
    line-height:160%;
}

.mdoc-header-subtitle{
    width:100%;
    margin-top:3px;
}

/* Responsive */
/* =========================
   TABLET (1024px and below)
========================= */
@media (max-width: 1024px){

    .mdoc-container {
    flex-direction: column;
    gap: 20px;
    padding: 0 20px;
}
	.mdoc-content {
    flex: 1;
    min-width: 300px;
    min-height: auto;
}

    .mdoc-sidebar{
        flex:0 0 220px;
        max-width:220px;
    }

    .mdoc-content,
    .mdoc-documents-panel{
        width:auto;
    }

    .mdoc-documents-table th,
    .mdoc-documents-table td{
        padding-left:20px;
        padding-right:20px;
    }

    .mdoc-header-thumb{
        padding-left:20px;
    }

    div#mdoc-service-policy .mdoc-header-text,
    div#mdoc-warranty-guidelines .mdoc-header-text{
        padding-left:20px;
    }
}


/* =========================
   MOBILE (768px and below)
========================= */
@media (max-width: 768px){

    .mdoc-container{
        flex-direction:column;
        gap:20px;
    }

    .mdoc-sidebar{
        width:100%;
        max-width:100%;
        flex:100%;
        min-height:auto;
    }

    .mdoc-content{
        width:100%;
        min-width:100%;
    }

    .mdoc-documents-panel{
        width:100%;
/*         overflow:hidden; */
    }

    .mdoc-panel-header{
        padding:20px;
        gap:12px;
    }

    .mdoc-header-thumb{
        padding-left:0;
    }

    .mdoc-header-thumb img{
        width:60px;
        height:60px;
    }

    .mdoc-header-text{
        gap:8px;
    }

    .mdoc-header-text h3{
        font-size:12px;
        line-height:1.4;
    }

    .mdoc-header-subtitle{
        font-size:12px;
    }
	

    div#mdoc-service-policy .mdoc-header-text,
    div#mdoc-warranty-guidelines .mdoc-header-text{
        padding:0;
    }

    /* table horizontal scroll */
/*     .mdoc-documents-panel{
        overflow-x:auto;
    } */

    .mdoc-documents-table{
        min-width:100%px;
    }

    .mdoc-documents-table th,
    .mdoc-documents-table td{
        padding-left:16px;
        padding-right:16px;
        font-size:12px;
    }
	.mdoc-header-thumb .mdoc-header-img {
    /* display: block; */
   
    max-height: 41px;
    
}

    .mdoc-btn{
        font-size:10px;
        white-space:nowrap;
    }
	td.mdoc-action-cell {
    flex-direction: column;
}
}


/* =========================
   SMALL MOBILE (480px and below)
========================= */
@media (max-width: 480px){
	.mdoc-sidebar h2 {
    font-size: 13px;
   
    padding: 8px 32px 11px 15px;
   
}

    .mdoc-machine-item{
        font-size:12px;
        padding:7px;
		        padding-left: 16px;
    }
	.mdoc-header-thumb .mdoc-header-img {
    /* display: block; */
    
    max-height: 41px;
   
}
	td.mdoc-action-cell {
    flex-direction: column;
}

    .mdoc-panel-header{
        padding:15px;
		        min-height: 70px;
    }


    .mdoc-header-thumb img{
        width:50px;
        height:50px;
    }

    .mdoc-header-text h3{
        font-size:12px;
    }

    .mdoc-documents-table{
        min-width:100%px;
    }

    .mdoc-btn-preview,
    .mdoc-btn-download{
        gap:3px;
    }
}
