@media all{

	#detail_1, #detail_2, #detail_3, #detail_4, #detail_5, #detail_6 {
	    display: none;
	}
	.charts-combobox {
	    display: none;
	}
	.charts-inline-block {
	    display: none;
	}
	.label-input-label {
	    display: none;
	}
	.goog-combobox {
	    display: none;
	}
	.no-border {
	    border: 0px solid white;
	    border-bottom: 1px solid #BDBDBD;
	    align-self: left;
	    padding: 10px 10px 10px 10px !important;
	}
	.bold-font {
	    font-weight: bold;
	}
	.column_1 {
	    text-align: right !important;
	}
	.google-visualization-table-th {
	    text-align: left !important;
	    padding: 10px 10px 10px 10px !important;
	    font-size: 14px !important;
	    border-color: #fff !important;
	}
	.large-font {
	    font-size: 12px;
	    padding: 5px !important;
	}
	.google-visualization-table {
		font-size: 12px !important;
	}
	.google-visualization-table table {
		font-size: 12px !important;
	}
	.google-visualization-table th {
		font-size: 12px !important;
	}
	.google-visualization-table tbody tr {
		font-size: 12px !important;
	}
	.white-font {
	    color: white;
	}
	.google-visualization-table {
	    float: left !important;
	}
	#table_div_1 th:hover {
	    cursor: default;
	}
	#table_div_1 td:hover {
	    cursor: pointer;
	}
	#table_div_2 th:hover {
	    cursor: default;
	}
	#table_div_2 td:hover {
	    cursor: pointer;
	}
	#table_div_3 th:hover {
	    cursor: default;
	}
	#table_div_3 td:hover {
	    cursor: pointer;
	}
	#table_div_4 th:hover {
	    cursor: default;
	}
	#table_div_4 td:hover {
	    cursor: pointer;
	}
	#table_div_5 th:hover {
	    cursor: default;
	}
	#table_div_5 td:hover {
	    cursor: pointer;
	}
	#table_div_6 th:hover {
	    cursor: default;
	}
	#table_div_6 td:hover {
	    cursor: pointer;
	}
	#chart_div_1, #chart_div_2, #chart_div_3, #chart_div_4, #chart_div_5, #chart_div_6 {
	    margin: 10px;
		height: 240px;
	}
	#table_td_1, #table_td_2, #table_td_3, #table_td_4, #table_td_5, #table_td_6 {
	    vertical-align: top;
	    padding: 10px 0 0 40px;
	}
	#breadcrumb_div_1, #breadcrumb_div_2, #breadcrumb_div_3, #breadcrumb_div_4, #breadcrumb_div_5, #breadcrumb_div_6 {
	    height: 30px;
	}
	#backbutton_div_1, #backbutton_div_2, #backbutton_div_3, #backbutton_div_4, #backbutton_div_5, #backbutton_div_6 {
	    height: 30px;
	    padding-left: 10px;
	    position: absolute;
	    float: left;
	    z-index: 99;
	}
	#exportbutton_div_1, #exportbutton_div_2, #exportbutton_div_3, #exportbutton_div_4, #exportbutton_div_5, #exportbutton_div_6 {
	    padding-left: 10px;
	    position: relative;
	    float: left;
		top: -40px;
	    z-index: 99;
		display: none;
	}
	.select_div {
	    padding: 0;
	    position: absolute;
	    right: 10px;
		top: 10px;
	    z-index: 99;
	}
	#selectyear_div_6 {
		float: right;
		margin-top: -8px;
		margin-right: 0px;
	}
	.backButtonContainer_1, .backButtonContainer_2, .backButtonContainer_3, .backButtonContainer_4, .backButtonContainer_5, .backButtonContainer_6 {
	    text-align: left !important;
	}
	.exportButtonContainer_1, .exportButtonContainer_2, .exportButtonContainer_3, .exportButtonContainer_4, .exportButtonContainer_5, .exportButtonContainer_6 {
	    text-align: left !important;
		 height: 0px;
	}
	.breadcrumbContainer_1, .breadcrumbContainer_2, .breadcrumbContainer_3, .breadcrumbContainer_4, .breadcrumbContainer_5, .breadcrumbContainer_6 {
	    font-family: Arial, Helvetica, sans-serif;
	    font-size: 14px;
	    font-weight: bold;
	}
	svg > g > g:last-child {
	    pointer-events: none
	}
	#dbWrapper #ui-tabs-1 {
	    padding: 0;
	}
	.chart_detail {
		font-weight: bold;
	}
	#detail_1 td, #detail_2 td, #detail_3 td, #detail_4 td, #detail_5 td, #detail_6 td {
		/*white-space: nowrap;*/
		/*height: 20px;*/
		text-align: left;
		vertical-align: top;
	}
	#dashboard_1_div a, #dashboard_2_div a, #dashboard_3_div a, #dashboard_4_div a, #dashboard_5_div a, #dashboard_6_div a {
		color: black;
		text-decoration: none;
		cursor: default; 
	}

	#candiDashboard_wrapper{
		margin: 0 auto;
		padding-bottom: 40px;
		width: 1330px;
		max-width: 100%;
	}

	#candiDashboard{
		margin: 0 auto;
		display: grid;
		grid-gap: 11px;
		grid-template-columns: 1fr 1fr;
		grid-auto-rows: min-content;
		align-items: start;
        justify-items: center;
	}

	/* Modern card styling matching XE dashboard */
	#candiDashboard .candi-card {
		background-color: #eee;
		border-radius: 14px;
		overflow: visible;
		display: flex;
		flex-direction: column;
		min-width: 350px;
		width: 100%;
	}

	#candiDashboard .candi-header {
		background-color: #eee;
		color: #000;
		font-size: 14pt;
		font-family: Helvetica, Arial, sans-serif;
		font-weight: normal;
		padding: 15px 20px;
		text-align: center;
		border-bottom: 1px solid #ddd;
		border-radius: 14px 14px 0 0;
	}

	#candiDashboard .candi-title {
		display: block;
		text-transform: uppercase;
		letter-spacing: 0.5px;
	}

	#candiDashboard .candi-content {
		display: grid;
		grid-template-columns: 300px 360px;
		grid-gap: 10px;
		padding: 10px;
	}

    #candiDashboard .breadcrumb{
		padding: 5px 15px;
		background-color: #eee;
		font-size: 12px;
		color: #666;
		min-height: 20px;
    }

    #candiDashboard .chartBox{
		width: 300px;
		position: relative;
    }

    #candiDashboard .legendBox{
        width: 325px;
        max-height: 241px;
        overflow: auto;
		padding: 10px 0 10px 10px;
	}

	/* Modern detail panel styles */
    #candiDashboard .detailsBox{
		padding: 15px;
		background-color: #f8f9fa;
		margin-top: auto;
		border-radius: 0 0 14px 14px;
    }

	#candiDashboard .detail-panel {
		background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
		border-radius: 8px;
		padding: 20px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
		display: none;
	}

	#candiDashboard .detail-grid {
		display: flex;
		flex-direction: column;
		gap: 12px;
	}

	#candiDashboard .detail-row {
		display: grid;
		grid-template-columns: 140px 1fr 140px 1fr 100px 1fr;
		gap: 10px;
		align-items: start;
		font-size: 11px;
	}

	#candiDashboard .detail-label {
		font-weight: 600;
		color: #333;
		white-space: nowrap;
	}

	#candiDashboard .chart_detail {
		color: #555;
		font-weight: 500;
	}

	#candiDashboard .detail-fullwidth {
		grid-column: 2 / -1;
	}

	#candiDashboard .detail-span2 {
		grid-column: span 3;
	}
}

@media only screen and (max-width: 1300px) {
	#candiDashboard_wrapper{
		margin: 0 auto;
		width: 100%;
		padding: 0 10px;
	}
    #candiDashboard{
		display: flex;
		flex-direction: column;
		grid-gap: 15px;
	}

	#candiDashboard .candi-card {
		width: 100%;
		max-width: 700px;
	}

	#candiDashboard .candi-content {
		grid-template-columns: 1fr;
	}

	#candiDashboard .chartBox,
	#candiDashboard .legendBox {
		width: 100%;
	}
}

@media only screen and (max-width: 760px) {
    #candiDashboard{
		display: flex;
		flex-direction: column;
		padding: 0 5px;
	}

    #candiDashboard .candi-card {
		min-width: 100%;
		margin-bottom: 15px;
	}

	#candiDashboard .candi-content {
		grid-template-columns: 1fr;
		padding: 5px;
	}

	#candiDashboard .chartBox,
	#candiDashboard .legendBox {
		width: 100%;
		max-height: 55vh;
	}

	#candiDashboard .google-visualization-table{
		width: 100%;
	}

	#candiDashboard .exportButton{
		display: none !important;
	}

	#candiDashboard .detail-row {
		grid-template-columns: 1fr;
		gap: 5px;
	}

	#candiDashboard .detail-label {
		font-weight: bold;
		margin-top: 8px;
	}

	#candiDashboard .detail-fullwidth,
	#candiDashboard .detail-span2 {
		grid-column: 1;
	}
}