custom-y-body {
margin: 0;
height: 100vh;
}

.custom-y-headerparent {
display: flex;
flex-direction: column;
}  

.custom-y-discoveryparent {
display: flex;
flex-direction: row;
} 

/* Container holding both sides */
.custom-y-container {
display: flex;
height: 100vh;
}

/* Shared styles for left & right */
.custom-y-panel {
flex: 1;                 /* equal width */
padding: 10px;
box-sizing: border-box;
overflow: auto;          /* scroll both x and y */
border: 1px solid #ccc;
}

/* Right side layout */
.custom-y-right {
display: flex;
flex-direction: column;
gap: 10px;
}

.custom-y-textarea-wrapper {
flex: 1;
}

custom-y-textarea {
width: 100%;
height: 150px;
resize: both;           /* allow resizing */
}

/* Fullscreen overlay */
.custom-y-spinner-overlay {
position: fixed;
inset: 0;
background: rgba(255, 255, 255, 0.7);
display: none; /* hidden by default */
justify-content: center;
align-items: center;
z-index: 9999;
}

/* Spinner circle */
.custom-y-spinner {
width: 50px;
height: 50px;
border: 5px solid #ddd;
border-top: 5px solid #006400; /* dark green */
border-radius: 50%;
animation: spin 0.8s linear infinite;
}

/* Rotation animation */
@keyframes spin {
to { transform: rotate(360deg); }
}

/* Presentations with a tag*/
.custom-y-btn-primary {
display: inline-block;
background-color: #006400;
color: white;
padding: 14px 20px;
font-size: 18px;
width:320px;
border-radius: 6px;
cursor:pointer;
text-decoration: none;
font-weight: bold;
text-align: center;
cursor: pointer;
transition: background-color 0.2s ease;
}

/* Presentations with a tag*/
.custom-y-btn-primary-maroon {
display: inline-block;
background-color: #800000;
color: white;
padding: 14px 20px;
font-size: 18px;
width:320px;
border-radius: 6px;
cursor:pointer;
text-decoration: none;
font-weight: bold;
text-align: center;
cursor: pointer;
transition: background-color 0.2s ease;
}                            

/* style="background-color:#006400; color:white;width:320px; padding:14px 20px;font-size:18px; border:none; border-radius:6px; cursor:pointer; font-weight:bold; white-space:nowrap; align-self: center;*/
.custom-y-btn-primary:hover {
background-color: #004d00;
}  

/* File containing div*/
.custom-y-file-container {
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: repeat(4, auto);
/*	gap: 10px;  */

    row-gap: 5px;
    column-gap: 5px;								

	overflow-x: auto;
	overflow-y: hidden;

	max-height: 160px;
	padding: 5px;
	border: 2px solid #ccc;
}


.custom-y-file-item {
    display: flex;
    align-items: center;
    font-size: 10px;
    gap: 6px;
    white-space: nowrap;
}

/*
.custom-y-file-link {
    position: relative;
    padding-left: 14px;
    text-decoration: none;
    font-size: 12px;
}

    content: "\1F517";  for below
*/


.custom-y-file-link {
    position: relative;
    padding-left: 24px;
}

.custom-y-file-link::before {   
    content: "🔗";    
    position: absolute;
    left: 0;
}


.custom-y-file-size {
    font-size: 8px;
    color: #777;
}

.custom-y-delete-file {
    cursor: pointer;
    color: #cc0000;
    font-size: 12px;
}

.custom-y-delete-file:hover {
	color: #ff0000;
}

.custom-y-file-icon{
    display:inline-block;
    width:20px;
    text-align:center;
    margin-right:6px;
}
     
/*
.custom-y-file-pdf::before { content: "📕"; position: absolute; left: 0; } 
.custom-y-file-doc::before,
.custom-y-file-docx::before { content: "📘"; position: absolute; left: 0; }
.custom-y-file-xls::before,
.custom-y-file-xlsx::before { content: "📗"; position: absolute; left: 0; }
.custom-y-file-png::before,
.custom-y-file-jpg::before,
.custom-y-file-jpeg::before { content: "🖼"; position: absolute; left: 0; }
// \F640

*/

.custom-y-file-pdf::before { content: "📕"; position:absolute; left:0; }
.custom-y-file-doc::before,
.custom-y-file-docx::before { content: "📘"; position:absolute; left:0; }

.custom-y-file-xls::before,
.custom-y-file-xlsx::before { content: "📗"; position:absolute; left:0; }

.custom-y-file-png::before,
.custom-y-file-jpg::before,
.custom-y-file-jpeg::before { content: "🖼"; position:absolute; left:0; }

.custom-yz-file_column{
    float:right;
    display:flex;
    align-items:center;
    gap:2px;
}

#edu_levels_ul li{
    overflow:hidden;
}

#edu_levels_ul li .float_left:first-child{
    width:250px;
}