



/* input[type=submit] {
	background-color: blue;
	color:yellow;
} */

@media print {
	div.page { height: 1020px; }
}


@media screen{ .print-only {display:none;} }

html{height:100%;width:100%; font-family: Arial,Helmet,Freesans,sans-serif;
	font-size:16px; }
body{width:inherit;margin:0 auto;background:#ffffff; color: black; }
.dark body, .dark #content { background-color: black; color: #ffffff; }
#content{ min-width:90%;  min-height:500px;  margin: 0 auto;padding:10px 25px; }
.containered { width: 100%; }
@media print{ .screen{display:none;} } @media print{ div.portrait {size: portrait;}}
@media print{ div.landscape {size: landscape;}}
div#header a{padding-left:8px; }div#header img{outline:none; border:0;}
#header{ background-color:#0174DF;margin: 0 auto 0 auto;padding: 0px;width:100%;height:46px;	}
#smartlinks{background-color:#56A5EC;border-top:0px solid #ccc;margin: 0 auto 0 auto;padding: 0px;width:100%;height:32px;	}
#smartlinks tr td, #smartlinks tr td a { color: #fff;font-size: 1.1em; }
#footer{color:#3399FF;font-size:11px;padding-top:120px;font-family:Arial,Helvetica,sans-serif;	}
.logo { float: left;height: 120px;width: 700px;background:#000000;	}
.accordParent div {background-color:lightblue; width:200px;border-bottom:2px solid #cfc;padding:2px 20px;}
div.center,div.center > table,div.center > div {  margin-left: auto; margin-right: auto;}
div.page{ border:1px solid none; }
.pagebreak {page-break-after:always;} .textwide{width:100%;min-height:100px;}
tr.headrow > td,tr.headrow > th,tr.bgheadrow > th { }
.grayscale,.headrow,.current,.bg-blue2 {background: #ccc; color:#2f2f2f; }	/* #007bff*/

.dark .accorHeadrow, .dark .headrow { background-color: #3d3c3c; color: #ffffff; }


#hc{margin-left:700px;} .full,.clear{clear:both;}
div.divider {float:left;width:5px;padding:2px 2px;}
div.half {float:left;width:50%;padding:5px 3px;} div.third {float:left;width:25%;padding:3px 0;}
div.fourth {float:left;width:22%;padding:3px 0;} div.fifth{float:left;width:18%;padding:3px 0;}
.ht50{min-height:50px;} .ht100{min-height:100px;} .ht150{min-height:150px;}
.ht200{min-height:200px;} .ht300{min-height:300px;}  .ht500{min-height:500px;}
span.links{ display:inline-block; } /*makes links underline not touching the text */
.scroll{overflow:scroll; min-height:10px; border:1px solid black;}

/* fonts or font-sizes */
.rem1-25{ font-size:1.25rem; } 	.rem1-5{ font-size:1.5rem; }	.rem1-75{ font-size:1.75rem; }
.rem2-25{ font-size:2.25rem; }	.rem2-5{ font-size:2.5rem; }	.rem2-75{ font-size:2.75rem; }
.rem2{ font-size:2rem; }	.rem3{ font-size:3rem; }	.rem4{ font-size:4rem; }


/* general */
.text-left { text-align:left !important; }
div.left{float:left;} .left{text-align:left;}
div.right{float:right;} .right{text-align:right;}
table.center tr td, table.center tr th { text-align:center; }
table.right tr td, table.right tr th { text-align:right; }
table.left tr td, table.left tr th { text-align:left; }
td.left, th.left  { text-align: left; }

.center{text-align:center;margin:0 auto;}
tr.rc > td:first-child { width:20px;  }
.vc20{width:20px;}
.vc25{width:2.5rem !important; }
.vc30{width:3rem !important; }
.vc40{width:4rem !important; }
.vc50{width:5rem !important; }
.vc60{width:6rem !important; }
.vc70{width:7rem !important; }
.vc75{width:7.5rem !important; }
.vc80{width:8rem !important; }
.vc90{width:9rem !important; }
.vc100{width:10rem !important; }

.vc120{width:120px;}  .vc150{width:150px;} .vc250{width:250px;}
.iw200,.vc200{width:200px;} .iw250,.vc250{width:250px;} .vc300{width:300px;} .vc350{width:350px;}
.vc500{width:500px;} .vc1000{width:1000px;}	.vc1100{width:1100px;} 	.vc1200{width:1200px;}
.border-red{ border-color:red; } .bordered {border:1px solid #000;} .unbordered{border:none;}
/*  padding left, pdls padding right */
.pdl05 { padding-left: 5px;} .pdl10 { padding-left: 10px; margin-left:10;}
.pdr05 { padding-right: 5px;} .pdr10 { padding-right: 10px;}
/*  --- tables and divs --- */
.trleft th, .trleft td{ text-align:left; } td.tdhleft,th.tdhleft{text-align:left; }

.gis-table-bordered { border: 1px solid #ddd; } .gis-table-bordered th { }
.gis-table-bordered th, .gis-table-bordered td {
	border: 1px solid #ddd;
	padding:4px 10px;
}

.dark .gis-table-bordered th, .dark .gis-table-bordered td { color:white;  }

.gis-table-bordered thead th,.gis-table-bordered thead td { border-bottom-width: 2px; }

.table-bordered { border: 1px solid #ddd;  } .table-bordered th { }
.table-bordered th, .table-bordered td { border: 1px solid #ddd; padding:3px 10px; }
.table-bordered thead th,.table-bordered thead td { border-bottom-width: 2px; }

.table-padding-none th,.table-padding-none td{ padding:0;} .table-padding-lg th,.table-padding-lg td{ padding:0;}
.table-fx tr:not(:first-child):hover th, .table-fx tr:not(:first-child):hover td { background-color: #e8e8e8; }

.dark .table-fx tr:hover td, .dark.table-fx tr:hover th { background-color: #3d3c3c;  }
.highlightedRow{background: #E8E8E8; }
.dark .highlightedRow, .dark .colshading, .dark .tdscore {background: #00000f; color: white; }

tr.text-header td, tr.text-header th { color: #020202; }
.dark tr.text-header td, .dark tr.text-header th { color: #fff; }

.colshadingbg{  background-color:#E8E8E8;  }
.dark .colshadingbg{  background-color:#3d3c3c;  }


.table-altrow tr:nth-child(even) {background-color: #f9f9f9; } .odd{background-color:#ccc;}
/* .dark .table-altrow tr:nth-child(even) {background-color: #3F3F3F; }  */
.dark .odd{background-color: #38393B;}
.dark .table-altrow tr:nth-child(even) {background-color: #777; }
.dark .table-altrow tr:nth-child(odd) {background-color: #999; }


/* bg-colors rainbows: VIBGYOR */
.bg-violet{background-color:#9400D3; } .headrow-indigo {background-color:#4B0082; }
.bg-blue{background-color:#0000FF; } .headrow-green {background-color:#00FF00; }
.bg-yellow{background-color:#FFFF00; } .headrow-orange {background-color:#FF7F00; }
.bg-red {background-color:red; } .bg-pink {background-color:pink; }
.bg-gray {background-color:#E8E8E8; } .bg-lightgray{background-color:#E8E8E8; } .headrow-gray {background-color:#E8E8E8;; }
.bg-lightblue{background-color:lightblue;}  .bg-lightgreen{background-color:lightgreen;}
.bg-lightyellow{background-color:lightyellow;} .bg-white{background-color:white;}	.bg-black{background-color:black;}

table.tdbordered tr td, table.tdbordered tr th{border:1px solid black}
border-top: 1px solid #dddddd; padding:0px 3px; color:;}
.table-center th, .table-center td, .table-center td  input { text-align:center; }
.table-vcenter th, .table-vcenter td, .table-vcenter td { vertical-align:middle; }
.no-gis-table-bordered {border-left:0;border-top:0; } .no-gis-table-bordered th, .no-gis-table-bordered td { padding:3px 10px; }
tr.red > td,tr.red > th { color:#FF3300; }
tr.no-padding > th,tr.no-padding > td{ padding: 0px; }


tr.center > th,tr.center > td{text-align:center; }tr.right > th,tr.right > td {text-align:right; }
tr.b > td,tr.b > th,tr.bold > td,tr.bold > th { font-weight:bold; }
.unbordered{border:none;} .bold{font-weight:bold;}
.b{font-weight:bold;} .ub{font-weight:normal;} .i{font-style:italic;}
.u {text-decoration:underline;} .nu,.no-underline {text-decoration:none;}
.uc { text-transform: uppercase; }
.white{color:#fff;} .blue{color:blue;} .red{color:#FF3300;} .green{color:green;} .orange{color:orange;}	.pink{color:pink;}
.gray{color:gray;}	.brown{color:brown;} .yellow{color:yellow;}	.maroon{color:#800000;}  .gold{color:gold;} .black{color:black;}

.selected{font-weight:bold;}  .flashMessage{padding:0 50px;margin:0;}
table,tr,td,th{border-collapse:collapse;vertical-align:top;text-align:left;padding:0em .3em;}
/* etc */
h1,h2,h3,h4,h5,h6{margin:3;padding:3;}
a{ font-family:Arial,Helmet,sans-serif; } button{font-family:Arial,Helmet,sans-serif;color:#333; }


/*forms */


/* input[type='button'], input[type='submit']{min-width:50px;} input[type='file']{min-width:200px;} */


.checkbox{width:20px;check:true;} input.qty{width:50px;} input.memo{width:300px;height:60px;}
.full,textarea.full,input.full, select.full{width:100%;}
.checkbox tr td {border:1px solid ccc; } .checkbox tr td {min-width:16px;}
#names{overflow:auto;color:blue; }	/* scroll */

/* modal */


/* accordion */
.accorHeadrow{ height:38px; vertical-align:middle;text-align:center;width:256px;background-color:#007bff; color:white; }

/* filter names


*/
#names {
	background-color: #fff;
	color: #222;
	min-width:30%;
	position: absolute;
	top: 100px;
	left: 100px;
	padding: 1.2rem;
	border: 1px solid #ddd;
	border-radius: 8px;
	z-index: 100;
}


.dark #names {
	background: #ccc;
	color: #fff;
}


#error_message {
    color: red;font-size:3rem;padding: 2rem;
    border: 1px solid red;border-radius:1rem;
    width: 80%;margin: 0 auto;
}


.ucfirst { text-transform: capitalize; }
.bg-pula { background-color: red; }




/* default */



/* #2024 */



/* ------ */


.capsulebox > * {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px 16px;
}

.capsule {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px 16px;
}


.center { text-align:center; }
.b { font-weight: bold; }
.u { text-decoration: underline; }
.uc { text-transform: uppercase; }
.grayscale,.headrow {background: #ccc; color:#2f2f2f; }	/* #007bff*/


.action, .row-button, .row-action {
    background-color: #eee;
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 6px;
    cursor: pointer;

}

.info-wrapper {
    display:flex;
    flex-wrap: wrap;
    column-gap:2px;

}


.table-gap td, .table-gap th, .table-gap td, .table-gap th {
    padding-right:1.6rem;
}


input[type=checkbox]{
    width:1.2rem;
    height:1.2rem;
}

.flashMessage {
    border: 2px solid brown;
    width: 80%;
    margin: 1rem auto;
    text-align:center;
    border-radius:1rem;
    font-size:2rem;

}

.pagebreak {page-break-after:always;}
.textwide{width:100%;min-height:100px;}


.active_link {
    width: 100%;
    background-color: #ccc;
    font-weight: bold;
}


/* media  */
@media print{ .screen{display:none;} }
@media print{ div.portrait {size: portrait;}}
@media print{ div.landscape {size: landscape;}}


/* accordion table  */

.row-body { display: none; }





/* .buttons, button-group */

.text-important {
    font-size: 1rem;
    font-weight: bold;
}

.text-capitalize { text-transform: capitalize; }
.text-uppercase { text-transform: uppercase; }


.pageinfo {
    padding: 1rem 2rem;
    margin: 1rem auto;
    display:flex;
    justify-content:center;
}


/* not-underlined */
.nu { text-decoration: none; }
a.nu:hover { text-decoration: none; }


.pagebar, .mainbar {
    display: flex;
    flex-wrap: wrap;
    row-gap: 2rem;
    column-gap: 12px;
}



.pagebar span > a, .child-bordered > span {
    padding: 8px 16px;
    border: 1px solid #ccc;
    border-radius: 8px;
}

.button-group {
    display: flex;
    gap: 0.6rem;
}

.button-group * {
    padding: 8px 16px;
    border: 1px solid #ccc;
    border-radius: 8px;


}


.input-cols-width input {
    width: 100px;
}


.input-w-full input,
.input-w-full select {
    width: calc(100% - 1rem) ;
    padding: 10px;
    margin: 5px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;


}



.badge {
    border: 1px solid #000;
    padding: 3px 6px;
    border-radius: 3px;
}


/* Reset some default browser styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    /* color: #333;
    background-color: #f4f4f4; */

}


.dark * {
    background-color: #000;
    color: #fff;
}

.dark button {
    border: 1px solid #888;
    border-radius: 8px;
}



/* table */

.table-header th, .table-header td {
	color: black;
	background: #ccc;
}

.dark .table-header th, .dark .table-header td {
	color: white;
	background: black;
}

tr.text-top th,
tr.text-top td {
	vertical-align: top;
}


/* Headings */
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 1rem;
    color: #333;
}

.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
    color: #fff;
}



/* Paragraphs */
p {
    margin-bottom: 1rem;
}


.menu-table a {
    border: none;
}

a.unlink:hover {
    text-decoration: none;
    color: inherit;

}

.dark a {
    color: #fff;
    background-color: #000;

}


a:hover {
    text-decoration: underline;
}

/* Lists */
ul, ol {
    margin-bottom: 1rem;
}

/* Forms */



.form-w-full input, .form-w-full select, .form-w-full textarea, table.w-full  {
    width: 100%;
}

.custom input, .custom select  {
    padding: 8px 12px;
}

input.full, select.full, input.w-full, select.w-full {
    width: calc(100% - 1rem);
}

input,
input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
    font-size: 1rem;
    color: black;
    padding: 6px 12px;
    margin: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 8px;

}

textarea {
    width: 100%;

}

input[type="submit"].btn-danger  {
    background-color: red;
}

input[type="submit"],.a-btn, button, .gisbtn {
    /* background-color: #007bff; */
    background-color: #007bff;
    color: #fff;
    /* color: #fff !important; */
    border: 1px solid #ccc;
    padding: 4px 8px;
    cursor: pointer;
    border-radius: 8px;
    margin: 4px 8px 4px 0;
}


.btn-padding  {
    padding: 4px 8px;
}

.btn-primary  {
    color:#fff;
    background-color: #007bff;
}

.dark .btn-primary {
    color:#fff;
    background-color: #007bff;
}


.btn-secondary {
    background-color: #6c757d;
}

.dark .btn-secondary {
    background-color: #6c757d;
}

.btn-danger {
    background-color: #dc3545;
}

.btn-success, .btn-add, .btn-go  {
    background-color: #4CAF50;

    &:hover {
        background-color: #45A049;
    }
}

.btn-edit {
    background-color: #FFC107;

    &:hover {
        background-color: #FFB300;
    }
}

.btn {
    /* color:#fff; */
    border: none;
    padding: 4px 8px;
    cursor: pointer;
    border-radius: 8px;
    margin: 4px 8px 4px 0;
    transition: background-color 0.3s, box-shadow 0.3s;
    text-align: center;
}

.btn-b {
    border: 1px solid #ccc;
    border-radius: 8px;
}


input[type="submit"]:hover,
button:hover {

}

.dark input, .dark textarea, .dark select {
    background-color: #333;
    color: #fff;

}


/* Utility Classes */
.container {
    width: 100%;
    margin: auto;
    overflow: hidden;
}


.table-center * {
    text-align: center;
    vertical-align: middle;
}



.text-center {
    text-align: center;
}

/* Add more custom styles as needed */

/* custom-bordered-table, table-bordered, rounded-table */
.cbt {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    border:1px solid #ddd;
    border-radius: 1rem;
    overflow: auto; /* To ensure the rounded corners are respected */
}

.cbt th,
.cbt td {
    border-bottom: 1px solid #ddd;
    padding: 8px; /* Adjust padding as needed */
}

.cbt tr:last-child td { border-bottom: none; }

/* title and titlebar menuDesign */
.title, .page-title, .page-header, .gis-title, .gis-header {
    font-size: 1.0rem;
    margin-bottom: 1rem;
    display: flex;
    gap: 0.6rem;

}

.gis-header {
}

.dark .title {
    color: #fff;
}

.titlebar {
    display: flex;
    justify-content: flex-start;
}


.titlebar * {
    padding: 8px;
}

.dark .titlebar * {
    color: white;
    background-color: black;
}


.titlebar > *:last-child {
    flex-grow:1;
}



/* modal */

/* The Modal (background) */
.modal-backdrop {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-overlay {
    background-color: #fefefe;
    margin: 5% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    border-radius: 8px;
    max-width: 80%; /* Could be more or less, depending on screen size */
    height: 80%;
    overflow: auto;
}

.dark .modal-backdrop {
    background-color: darkgray;
}

.dark .modal-overlay {
    background-color: black;
    color: #fff;
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.modal-title {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 1rem;
}



/* flex-table  */

.outlined {
    border-width: 1px;
    border-style: solid;
    border-radius: 1rem;
    overflow: auto;
}

.flex-table { width: 100%; }
.flex-table tr { display: flex; flex-direction: column; }
.flex-table th, .flex-table td { width: 100%; text-align: left; padding: 4px 8px; }

@media (min-width: 768px) {
    .flex-table tr { flex-direction: row; }
    .flex-table th { width: 20%; }
    .flex-table td {  }

    .flex-table.bordered tr:not(:last-child), .flex-table.bordered tr:not(:last-child) {
        border-bottom: 1px solid #ccc;
    }
    .flex-table th, .flex-table td { padding: 8px 12px; }

}   /* media */


.flex-table.bordered {
    border: 1px solid #ccc;
}

/* .menu */

.menu > * {
    width: 100%; /* This makes any child of .menu to take full width of the menu */
    box-sizing: border-box; /* Ensures padding and border are included in the width */
}


.menu-div {
    border-radius: 0rem;
}

.dark .menu-div {
    background-color: #000;
}


.menu-table {
    border-radius: 0.5rem;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    border-radius: 0.8rem;
    overflow: hidden; /* Ensures the rounded corners are visible */
  }

  .menu-table th, .menu-table td {
    padding: 8px;
  }

  .menu-table th, .menu-table td {
    /* border-bottom: 1px solid #ccc; */
  }


  .menu-table tr:last-child td {
    border: none;
  }


.link-header:hover, .link-item:hover {
    background-color: #d3d3d3!important;
}

  tr.link-item td {
    border: none;

  }

  tr.align-bottom th {
    vertical-align: bottom;
}


  tr.link-group-css th, tr.link-group-css td {
    /* border-top: 2px solid #ccc; */
    /*
        #gold
        border-bottom: 2px solid #ffcd40;
        color: #ffcd40;

    */

    border-bottom: 2px solid #b3842b;
    color: #b3842b;

    text-transform: uppercase;
    text-align:center;

  }

  .indent {
    padding-left: 1.2rem !important;
  }


  .indent {
    padding-left: 1.2rem;
  }

  .indent-descendants * {
    padding-left: 1.2rem;
  }





/* gis-menu  */

.gismenu-dropdown {
    display: flex;
    justify-content: space-between;
}



/* next */
/* next */


/* next */
/* next */


/* grid */


/* sizes */
/* comment */
/* comment */
/* comment */


/* padding */


/* text-sizes */
.text-1 { font-size: 1rem; }
.text-2 { font-size: 2rem; }

/* heights */
.h-10px { height: 10px; }
.h-20px { height: 20px; }
.h-30px { height: 30px; }
.h-40px { height: 40px; }
.h-50px { height: 50px; }
.h-60px { height: 60px; }
.h-70px { height: 70px; }
.h-80px { height: 80px; }
.h-90px { height: 90px; }
.h-100px { height: 100px; }
.h-110px { height: 110px; }
.h-120px { height: 120px; }
.h-130px { height: 130px; }
.h-140px { height: 140px; }
.h-150px { height: 150px; }
.h-160px { height: 160px; }
.h-170px { height: 170px; }
.h-180px { height: 180px; }
.h-190px { height: 190px; }
.h-200px { height: 200px; }
.h-250px { height: 250px; }
.h-300px { height: 300px; }
.h-350px { height: 350px; }
.h-400px { height: 400px; }
.h-450px { height: 450px;}
.h-500px { height: 500px; }
.h-600px { height: 600px; }
.h-700px { height: 700px; }
.h-800px { height: 800px; }
.h-900px { height: 900px; }



/* widths */

.w-10px { width: 10px; }
.w-20px { width: 20px; }
.w-30px { width: 30px; }
.w-40px { width: 40px; }
.w-50px { width: 50px; }
.w-60px { width: 60px; }
.w-70px { width: 70px; }
.w-80px { width: 80px; }
.w-90px { width: 90px; }
.w-100px { width: 100px; }
.w-110px { width: 110px; }
.w-120px { width: 120px; }
.w-130px { width: 130px; }
.w-140px { width: 140px; }
.w-150px { width: 150px; }
.w-160px { width: 160px; }
.w-170px { width: 170px; }
.w-180px { width: 180px; }
.w-190px { width: 190px; }
.w-200px { width: 200px; }
.w-250px { width: 250px; }
.w-300px { width: 300px; }
.w-350px { width: 350px; }
.w-400px { width: 400px; }
.w-450px { width: 450px;}
.w-500px { width: 500px; }
.w-600px { width: 600px; }
.w-700px { width: 700px; }
.w-800px { width: 800px; }
.w-900px { width: 900px; }



/* comment filament */

/* Basic Table Styling */
.filament-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);  /* Soft shadow to mimic Filament's design */
}

/* Table Header */
.filament-table th {
    background-color: #f9fafb;  /* Light gray background */
    color: #4b5563;  /* Text color similar to Filament's headers */
    padding: 10px;
    text-align: left;
    font-weight: 600;
    font-size: 14px;
    border-bottom: 2px solid #e5e7eb;  /* Border between header and content */
}

/* Table Body */
.filament-table td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;  /* Light border between rows */
    font-size: 14px;
}

/* Alternate Row Colors */
.filament-table tr:nth-child(even) {
    background-color: #f9fafb;  /* Light gray alternate rows */
}

.filament-table tr:hover {
    background-color: #f1f5f9;  /* Hover effect for rows */
}

/* Table Button (for submission) */
.filament-table button {
    background-color: #2563eb;  /* Blue background for buttons */
    color: white;
    border: none;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.filament-table button:hover {
    background-color: #1d4ed8;  /* Darker blue on hover */
}

.filament-table button:focus {
    outline: none;  /* Remove outline when focused */
}

/* Table Cell Input Fields (input fields inside the table) */
.filament-table input[type="password"] {
    padding: 8px;
    font-size: 14px;
    border: 1px solid #d1d5db;  /* Light border around the input */
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
}

.filament-table input[type="password"]:focus {
    border-color: #2563eb;  /* Blue border when focused */
    outline: none;  /* Remove outline when focused */
}



/* filament-link */
.filament-link {
    text-decoration: none;
    color: #3b82f6; /* Primary blue color */
    font-weight: 500;
    transition: color 0.2s ease;

    /* Optional: Add underline on hover */
    position: relative;
}

.filament-link:hover {
    color: #2563eb; /* Darker blue on hover */
}

/* Optional: Underline animation */
.filament-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    height: 2px;
    width: 100%;
    background-color: #3b82f6; /* Matches the link color */
    transform: scaleX(0);
    transition: transform 0.2s ease;
    transform-origin: left;
}

.filament-link:hover::after {
    transform: scaleX(1);
}


/* filament-button */

.filament-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    font-size: 0.875rem; /* Matches Filament's text-sm */
    font-weight: 500;
    text-align: center;
    color: white; /* Button text color */
    background-color: #3b82f6; /* Primary blue */
    border: none;
    border-radius: 0.375rem; /* Matches Filament's rounded-md */
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); /* Subtle shadow */
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.filament-button:hover {
    background-color: #2563eb; /* Darker blue on hover */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Slightly stronger shadow */
}

.filament-button:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.4); /* Blue focus ring */
}

.filament-button:disabled {
    background-color: #d1d5db; /* Gray for disabled state */
    color: #9ca3af; /* Gray text for disabled state */
    cursor: not-allowed;
    box-shadow: none;
}





/* golds, gis */



/* #2024 */



/* ------ */


.capsulebox > * {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px 16px;
}

.capsule {
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px 16px;
}


.center { text-align:center; }
.b { font-weight: bold; }
.u { text-decoration: underline; }
.uc { text-transform: uppercase; }
.grayscale,.headrow {background: #ccc; color:#2f2f2f; }	/* #007bff*/


.action, .row-button, .row-action {
    background-color: #eee;
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 6px;
    cursor: pointer;

}

.info-wrapper {
    display:flex;
    flex-wrap: wrap;
    column-gap:2px;

}


.table-gap td, .table-gap th, .table-gap td, .table-gap th {
    padding-right:1.6rem;
}


input[type=checkbox]{
    width:1.2rem;
    height:1.2rem;
}

.flashMessage {
    border: 2px solid brown;
    width: 80%;
    margin: 1rem auto;
    text-align:center;
    border-radius:1rem;
    font-size:2rem;

}

.pagebreak {page-break-after:always;}
.textwide{width:100%;min-height:100px;}


.active_link {
    width: 100%;
    background-color: #ccc;
    font-weight: bold;
}


/* media  */
@media print{ .screen{display:none;} }
@media print{ div.portrait {size: portrait;}}
@media print{ div.landscape {size: landscape;}}


/* accordion table  */

.row-body { display: none; }





/* .buttons, button-group */

.text-important {
    font-size: 1rem;
    font-weight: bold;
}

.text-capitalize { text-transform: capitalize; }
.text-uppercase { text-transform: uppercase; }


.pageinfo {
    padding: 1rem 2rem;
    margin: 1rem auto;
    display:flex;
    justify-content:center;
}


/* not-underlined */
.nu { text-decoration: none; }
a.nu:hover { text-decoration: none; }


.pagebar, .mainbar {
    display: flex;
    flex-wrap: wrap;
    row-gap: 2rem;
    column-gap: 12px;
}



.pagebar span > a, .child-bordered > span {
    padding: 8px 16px;
    border: 1px solid #ccc;
    border-radius: 8px;
}

.button-group {
    display: flex;
    gap: 0.6rem;
}

.button-group * {
    padding: 8px 16px;
    border: 1px solid #ccc;
    border-radius: 8px;


}


.input-cols-width input {
    width: 100px;
}


.input-w-full input,
.input-w-full select {
    width: calc(100% - 1rem) ;
    padding: 10px;
    margin: 5px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;


}



.badge {
    border: 1px solid #000;
    padding: 3px 6px;
    border-radius: 3px;
}


/* Reset some default browser styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    /* color: #333;
    background-color: #f4f4f4; */

}


.dark * {
    background-color: #000;
    color: #fff;
}

.dark button {
    border: 1px solid #888;
    border-radius: 8px;
}



/* table */

.table-header th, .table-header td {
	color: black;
	background: #ccc;
}

.dark .table-header th, .dark .table-header td {
	color: white;
	background: black;
}

tr.text-top th,
tr.text-top td {
	vertical-align: top;
}


/* Headings */
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 1rem;
    color: #333;
}

.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
    color: #fff;
}



/* Paragraphs */
p {
    margin-bottom: 1rem;
}


.menu-table a {
    border: none;
}

a.unlink:hover {
    text-decoration: none;
    color: inherit;

}

.dark a {
    color: #fff;
    background-color: #000;

}


a:hover {
    text-decoration: underline;
}

/* Lists */
ul, ol {
    margin-bottom: 1rem;
}

/* Forms */



.form-w-full input, .form-w-full select, .form-w-full textarea, table.w-full  {
    width: 100%;
}

.custom input, .custom select  {
    padding: 8px 12px;
}

input.full, select.full, input.w-full, select.w-full {
    width: calc(100% - 1rem);
}

input,
input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
    font-size: 1rem;
    color: black;
    padding: 6px 12px;
    margin: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 8px;

}

textarea {
    width: 100%;

}

input[type="submit"].btn-danger  {
    background-color: red;
}

input[type="submit"],.a-btn, button, .gisbtn {
    /* background-color: #007bff; */
    background-color: #007bff;
    color: #fff;
    /* color: #fff !important; */
    border: 1px solid #ccc;
    padding: 4px 8px;
    cursor: pointer;
    border-radius: 8px;
    margin: 4px 8px 4px 0;
}


.btn-padding  {
    padding: 4px 8px;
}

.btn-primary  {
    color:#fff;
    background-color: #007bff;
}

.dark .btn-primary {
    color:#fff;
    background-color: #007bff;
}


.btn-secondary {
    background-color: #6c757d;
}

.dark .btn-secondary {
    background-color: #6c757d;
}

.btn-danger {
    background-color: #dc3545;
}

.btn-success, .btn-add, .btn-go  {
    background-color: #4CAF50;

    &:hover {
        background-color: #45A049;
    }
}

.btn-edit {
    background-color: #FFC107;

    &:hover {
        background-color: #FFB300;
    }
}

.btn {
    /* color:#fff; */
    border: none;
    padding: 4px 8px;
    cursor: pointer;
    border-radius: 8px;
    margin: 4px 8px 4px 0;
    transition: background-color 0.3s, box-shadow 0.3s;
    text-align: center;
}

.btn-b {
    border: 1px solid #ccc;
    border-radius: 8px;
}


input[type="submit"]:hover,
button:hover {

}

.dark input, .dark textarea, .dark select {
    background-color: #333;
    color: #fff;

}


/* Utility Classes */
.container {
    width: 100%;
    margin: auto;
    overflow: hidden;
}


.table-center * {
    text-align: center;
    vertical-align: middle;
}



.text-center {
    text-align: center;
}

/* Add more custom styles as needed */

/* custom-bordered-table, table-bordered, rounded-table */
.cbt {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    border:1px solid #ddd;
    border-radius: 1rem;
    overflow: auto; /* To ensure the rounded corners are respected */
}

.cbt th,
.cbt td {
    border-bottom: 1px solid #ddd;
    padding: 8px; /* Adjust padding as needed */
}

.cbt tr:last-child td { border-bottom: none; }

/* title and titlebar menuDesign */
.title, .page-title, .page-header, .gis-title, .gis-header {
    font-size: 1.0rem;
    margin-bottom: 1rem;
    display: flex;
    gap: 0.6rem;

}

.gis-header {
}

.dark .title {
    color: #fff;
}

.titlebar {
    display: flex;
    justify-content: flex-start;
}


.titlebar * {
    padding: 8px;
}

.dark .titlebar * {
    color: white;
    background-color: black;
}


.titlebar > *:last-child {
    flex-grow:1;
}



/* modal */

/* The Modal (background) */
.modal-backdrop {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-overlay {
    background-color: #fefefe;
    margin: 5% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    border-radius: 8px;
    max-width: 80%; /* Could be more or less, depending on screen size */
    height: 80%;
    overflow: auto;
}

.dark .modal-backdrop {
    background-color: darkgray;
}

.dark .modal-overlay {
    background-color: black;
    color: #fff;
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.modal-title {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 1rem;
}



/* flex-table  */

.outlined {
    border-width: 1px;
    border-style: solid;
    border-radius: 1rem;
    overflow: auto;
}

.flex-table { width: 100%; }
.flex-table tr { display: flex; flex-direction: column; }
.flex-table th, .flex-table td { width: 100%; text-align: left; padding: 4px 8px; }

@media (min-width: 768px) {
    .flex-table tr { flex-direction: row; }
    .flex-table th { width: 20%; }
    .flex-table td {  }

    .flex-table.bordered tr:not(:last-child), .flex-table.bordered tr:not(:last-child) {
        border-bottom: 1px solid #ccc;
    }
    .flex-table th, .flex-table td { padding: 8px 12px; }

}   /* media */


.flex-table.bordered {
    border: 1px solid #ccc;
}

/* .menu */

.menu > * {
    width: 100%; /* This makes any child of .menu to take full width of the menu */
    box-sizing: border-box; /* Ensures padding and border are included in the width */
}


.menu-div {
    border-radius: 0rem;
}

.dark .menu-div {
    background-color: #000;
}


.menu-table {
    border-radius: 0.5rem;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    border-radius: 0.8rem;
    overflow: hidden; /* Ensures the rounded corners are visible */
  }

  .menu-table th, .menu-table td {
    padding: 8px;
  }

  .menu-table th, .menu-table td {
    /* border-bottom: 1px solid #ccc; */
  }


  .menu-table tr:last-child td {
    border: none;
  }


.link-header:hover, .link-item:hover {
    background-color: #d3d3d3!important;
}

  tr.link-item td {
    border: none;

  }

  tr.align-bottom th {
    vertical-align: bottom;
}


  tr.link-group-css th, tr.link-group-css td {
    /* border-top: 2px solid #ccc; */
    /*
        #gold
        border-bottom: 2px solid #ffcd40;
        color: #ffcd40;

    */

    border-bottom: 2px solid #b3842b;
    color: #b3842b;

    text-transform: uppercase;
    text-align:center;

  }

  .indent {
    padding-left: 1.2rem !important;
  }


  .indent {
    padding-left: 1.2rem;
  }

  .indent-descendants * {
    padding-left: 1.2rem;
  }





/* gis-menu  */

.gismenu-dropdown {
    display: flex;
    justify-content: space-between;
}



/* next */
/* next */


/* next */
/* next */
