body{
	font-family: Arial, "Helvetica Neue",Helvetica,sans-serif;
	font-size: 14px;
	margin: 0 auto;
	background-color: #E3EFFF;
}


input {	font-size: 16px; font-family: arial;}
button {font-size: 16px; font-family: arial;}


.info{
	border: none;
	margin: 3px auto;
	text-transform: uppercase;
	font-size: 14px;
}

textarea {	font-family: arial;}

@media print {
	body {padding-left: 0px;}
	select{
	-moz-appearance: none;
	-webkit-appearance:none;
	}
	ul { display: none; border: none;}
    #key{display: none;}
    #table {display: none;}
    #thongke {display: none;}
}


select{
	overflow:hidden;
	font-size: 14px;
	font-family: arial;
	border: none;
    text-align: left;
}

#select {
    width: 30%;
}



/* Button */

.nutnhan{
	font-family: arial;
	font-size: 12px;	
    text-decoration:none;
    display:inline-block;
    border-right:1px solid #c4dbe7;
    border-left:1px solid #c4dbe7;
    border-top:1px solid #c4dbe7;
    border-bottom:2px solid #c4dbe7;
    background:  #E3EFFF;

}

#mabenhnhan{
	font-size: 16px;
	font-family: arial;
	color: black;
	overflow: hidden;
	resize:none;
	font-weight: bold;
	vertical-align: bottom;
	margin: 3px auto;

}


.hinhsa{
	clear: both;
    width: 160px;
    height: 120px;
    margin: 2px auto;
    background-color: white;
   	float: center;
	}

.snap{
		
    width: 100px;
    height: 120px;
    margin: 2px auto;
    background-color: yellow;
  
	}

#video {
	    width: 280px;
	    height: 210px;
	    background-color:#ffcc99;
	    border:1px solid;
	    border-color: green;
		
	}


#form_sa{
	float: left;
	font-size: 16px;
	font-family: arial;
	color: black;
	overflow: hidden;
	width: 60%;
	resize:none;
	border:1px solid #c4dbe7;
	margin: 3px auto;

}

#form_sa_doc{
    float: left;
    font-size: 16px;
    font-family: arial;
    color: black;
    overflow: hidden;
    width: 100%;
    resize:none;
    margin: 3px auto;
}

#form_sa_ngang{
    float: left;
    font-size: 16px;
    font-family: arial;
    color: black;
    overflow: hidden;
    width: 100%;
    resize:none;
    margin: 3px auto;

}
.classkl{
	float: left;
	font-size: 14px;
	font-family: arial;
	color: black;
	border: none;
	overflow: hidden;
	width: 100%;
	font-weight:bold;
	resize:none;
}

#ketluan{
	width: 100%;
	color: #e74c3c;
	float: left;
	border: none;
}


.clear {
    clear: both;
};


.custom-file-input::-webkit-file-upload-button {  visibility: hidden;}

.custom-file-input::before {
  content: 'Chọn hình';
  display: inline-block;
  background: -webkit-linear-gradient(top, #f9f9f9, #e3e3e3);
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 13px;
  width: 90px;

}
.custom-file-input:hover::before {  border-color: black;}

.custom-file-input:active::before {  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);}

#table-scroll {  width:35%;  }

td { border: 1px solid; }

.ed {text-align: center;  width: 100%; resize:none; border: none; text-transform: uppercase; }



/* Create an active/current tablink class */
ul.tab li a:focus, .active {
  
}

.tabcontent { display: none; border-top: none; float: center;}


/* Main Navigation */
#nav {
    position:relative;
    width:100%;
    margin:1px auto;
    float: left;
    
}
 
ul#navigation {
    margin:0px auto;
    position:relative;
    float:left;
    border-left:1px solid #c4dbe7;
    border-right:1px solid #c4dbe7;
    -webkit-padding-start: 0px;

}
 
ul#navigation li {
    display:inline;
    font-size:12px;
    font-weight:bold;
    margin:0;
    padding:0;
    float:left;
    position:relative;
    border-top:1px solid #c4dbe7;
    border-bottom:2px solid #c4dbe7;
}
 
ul#navigation li a {
    padding: 4px 20px;
    color:#616161;
    text-shadow:1px 1px 0px #fff;
    text-decoration:none;
    display:inline-block;
    border-right:1px solid #fff;
    border-left:1px solid #C2C2C2;
    border-top:1px solid #fff;
    background: #f5f5f5;
 
    -webkit-transition:color 0.2s linear, background 0.2s linear;
    -moz-transition:color 0.2s linear, background 0.2s linear;
    -o-transition:color 0.2s linear, background 0.2s linear;
    transition:color 0.2s linear, background 0.2s linear;
}
 
ul#navigation li a:hover {
    background:#f8f8f8;
    color:#282828;
}
 
ul#navigation li a.first {
    border-left: 0 none;
}
 
ul#navigation li a.last {
    border-right: 0 none;
}
 
ul#navigation li:hover > a {
    background:#fff;
}

/* Drop-Down Navigation */
ul#navigation li:hover > ul
{
/*these 2 styles are very important,
being the ones which make the drop-down to appear on hover */
    visibility:visible;
    opacity:1;
}
 
ul#navigation ul, ul#navigation ul li ul {
    list-style: none;
    margin: 0;
    padding: 0;
/*the next 2 styles are very important,
being the ones which make the drop-down to stay hidden */
    visibility:hidden;
    opacity:0;
    position: absolute;
    z-index: 99999;
    width:180px;
    background:#f8f8f8;
    box-shadow:1px 1px 3px #ccc;
/* css3 transitions for smooth hover effect */
    -webkit-transition:opacity 0.2s linear, visibility 0.2s linear;
    -moz-transition:opacity 0.2s linear, visibility 0.2s linear;
    -o-transition:opacity 0.2s linear, visibility 0.2s linear;
    transition:opacity 0.2s linear, visibility 0.2s linear;
}
 
ul#navigation ul {
    top: 43px;
    left: 1px;
}
 
ul#navigation ul li ul {
    top: 0;
    left: 180px; /* strong related to width:180px; from above */
}
 
ul#navigation ul li {
    clear:both;
    width:100%;
    border:0 none;
    border-bottom:1px solid #c9c9c9;
}
 
ul#navigation ul li a input{
    background:none;
    padding:7px 15px;
    color:#616161;
    text-shadow:1px 1px 0px #fff;
    text-decoration:none;
    display:inline-block;
    border:0 none;
    float:left;
    clear:both;
    width:150px;
}

.vks{

    width:90%; border:none; font-size:14px; float: right;
}

#table_report_result {
    text-align: center;
    mso-number-format:"\@";
}

#table_form_echograph {
    text-align: center; 
    table-layout: auto;
   
}
#td {mso-number-format:"\@";}

 #colorMenu {
    display: none;
    position: absolute;
    background: #fff;
    border: 1px solid #ccc;
    padding: 5px;
    z-index: 1000;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
    animation: fadeIn 0.3s ease-in-out;
  }
  #colorMenu div {
    padding: 5px 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
  }
  #colorMenu div:hover {
    background: #eee;
  }
  #colorMenu .color-icon {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    display: inline-block;
  }

  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  .color-trigger {
    display: inline-block;
    padding: 2px 6px;
    background: #ddd;
    border-radius: 3px;
    cursor: pointer;
    margin-left: 5px;
  }
 
 
 #logodoc {
	 position: absolute;
	 z-index:-1;}
	 
	 
 .color-menu {
    display: none;
    position: absolute;
    border: 1px solid #ccc;
    background: #fff;
    padding: 8px;
    box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
    z-index: 1000;
    width: max-content;
    font-family: Arial, sans-serif;
    font-size: 13px;
  }
  .color-section { margin-bottom: 8px; }
  .color-grid {
    display: grid;
    gap: 2px;
  }
  .color-cell {
    width: 20px;
    height: 20px;
    border: 1px solid #ccc;
    cursor: pointer;
  }
  .color-cell:hover { border: 2px solid #000; }
  .color-label { margin-bottom: 3px; font-size: 12px; }
  .action-btn {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 4px;
    cursor: pointer;
    border: 1px solid #aaa;
    background: #f9f9f9;
    text-align: center;
  }
  .action-btn:hover { background: #eee; }
/* Giao diện bổ sung: không ảnh hưởng bố cục biểu mẫu khi in */
@media screen {
  input:not([type="radio"]):not([type="checkbox"]):not([type="range"]):not([type="file"]),
  select, textarea {
    border-radius: 4px;
    transition: border-color .15s ease, box-shadow .15s ease;
  }
  input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: #4d91d8 !important;
    box-shadow: 0 0 0 2px rgba(77,145,216,.16);
  }
  a, button, input[type="button"], input[type="submit"] {
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
  }
  button, input[type="button"], input[type="submit"], .nutnhan {
    border-radius: 4px;
    cursor: pointer;
  }
  button:hover, input[type="button"]:hover, input[type="submit"]:hover, .nutnhan:hover {
    filter: brightness(.97);
    box-shadow: 0 1px 3px rgba(0,0,0,.12);
  }
  table { border-collapse: collapse; }
  #table_report_result, #table_customer_list, #table_form_echograph {
    background: #fff;
  }
  @media (max-width: 900px) {
    body { padding: 0 8px; }
    input, select, textarea { max-width: 100%; box-sizing: border-box; }
    #search2 { width: min(100%, 400px) !important; }
  }
}


/* Lịch sử kết quả siêu âm */
#pmsa-history { box-sizing: border-box; }
.pmsa-history-shell { max-width: 1500px; margin: 18px auto; padding: 18px; color: #243247; }
.pmsa-history-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.pmsa-history-heading h1 { margin:0 0 6px; font-size:24px; color:#173d5b; }
.pmsa-history-heading p { margin:0; color:#64748b; }
.pmsa-history-layout { display:grid; grid-template-columns:minmax(270px, 350px) minmax(0, 1fr); gap:18px; align-items:start; }
.pmsa-history-sidebar, .pmsa-history-detail { min-width:0; }
#pmsaHistorySearch { width:100%; box-sizing:border-box; border:1px solid #cbd5e1; border-radius:9px; padding:12px 13px; font-size:14px; margin-bottom:10px; background:#fff; }
.pmsa-history-list { max-height:70vh; overflow:auto; border:1px solid #dbe4ed; border-radius:10px; background:#fff; }
.pmsa-history-item { display:flex; width:100%; align-items:center; justify-content:space-between; gap:10px; padding:13px 14px; text-align:left; border:0; border-bottom:1px solid #edf1f5; background:#fff; cursor:pointer; color:#26384b; }
.pmsa-history-item:last-child { border-bottom:0; }
.pmsa-history-item:hover, .pmsa-history-item:focus { background:#eef7ff; outline:0; }
.pmsa-history-item-main { display:flex; flex-direction:column; gap:4px; min-width:0; }
.pmsa-history-item-main strong { font-size:15px; overflow-wrap:anywhere; }
.pmsa-history-item-main small { color:#64748b; font-size:13px; overflow-wrap:anywhere; }
.pmsa-history-item-arrow { font-size:25px; color:#6b91ad; }
.pmsa-history-detail { min-height:360px; }
.pmsa-history-paper { background:#fff; border:1px solid #dbe4ed; border-radius:12px; padding:16px; box-shadow:0 3px 14px rgba(15, 40, 65, .06); }
.pmsa-history-paper-head { text-align:center; padding-bottom:12px; border-bottom:1px solid #e2e8f0; margin-bottom:14px; line-height:1.5; overflow-wrap:anywhere; }
.pmsa-history-paper-head h2 { margin:8px 0; color:#183d5b; font-size:20px; }
.pmsa-history-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; }
.pmsa-history-field { padding:7px 0; border-bottom:1px solid #edf1f5; min-width:0; }
.pmsa-history-label { color:#64748b; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; margin-bottom:3px; }
.pmsa-history-value { color:#1e293b; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.55; }
.pmsa-history-long-field { grid-column:1 / -1; }
.pmsa-history-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.pmsa-history-actions button, .pmsa-history-clear { border:0; border-radius:8px; padding:10px 14px; background:#176b8e; color:white; cursor:pointer; font-weight:600; }
.pmsa-history-actions button:hover, .pmsa-history-clear:hover { filter:brightness(.94); }
.pmsa-history-actions button.secondary, .pmsa-history-clear { background:#e9eef3; color:#334155; }
.pmsa-history-empty { padding:24px; color:#64748b; background:#f8fafc; border:1px dashed #cbd5e1; border-radius:10px; line-height:1.6; }
.pmsa-history-note { color:#64748b; font-size:12px; line-height:1.5; margin-top:14px; }
@media (max-width: 850px) {
  .pmsa-history-layout { grid-template-columns:1fr; }
  .pmsa-history-list { max-height:280px; }
  .pmsa-history-heading { align-items:flex-start; flex-direction:column; }
  .pmsa-history-fields { grid-template-columns:1fr; }
  .pmsa-history-long-field { grid-column:auto; }
  .pmsa-history-paper { padding:16px; }
}


.pmsa-history-images-section { margin-top:24px; }
.pmsa-history-images-section h3 { margin:0 0 12px; font-size:17px; color:#183d5b; }
.pmsa-history-images { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; }
.pmsa-history-image { margin:0; min-width:0; padding:10px; border:1px solid #dbe4ed; border-radius:10px; background:#fbfdff; }
.pmsa-history-image a { display:block; text-align:center; }
.pmsa-history-image img { display:block; max-width:100%; max-height:300px; width:auto; height:auto; margin:0 auto; object-fit:contain; }
.pmsa-history-image figcaption { color:#64748b; font-size:12px; margin-top:8px; overflow-wrap:anywhere; text-align:center; }

#pmsaHistoryDownloadWord { border:0; border-radius:8px; padding:10px 16px; background:#176b8e; color:#fff; cursor:pointer; font-weight:700; }
#pmsaHistoryDownloadWord:hover { filter:brightness(.94); }
.pmsa-history-edit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.pmsa-history-edit-grid label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:#475569}.pmsa-history-edit-grid input,.pmsa-history-edit-grid textarea{box-sizing:border-box;width:100%;padding:9px;border:1px solid #cbd5e1;border-radius:6px;font:inherit;font-weight:400;color:#1e293b}.pmsa-history-edit-grid label:has(textarea){grid-column:1/-1}@media(max-width:700px){.pmsa-history-edit-grid{grid-template-columns:1fr}.pmsa-history-edit-grid label:has(textarea){grid-column:auto}}
/* Chỉnh sửa trực tiếp ngay tại phần kết quả đang xem */
.pmsa-history-inline-input{box-sizing:border-box;width:100%;min-width:0;padding:8px 10px;border:1px solid #94a3b8;border-radius:6px;background:#fff;color:#1e293b;font:inherit;line-height:1.45}
.pmsa-history-inline-input:focus{outline:2px solid #93c5fd;border-color:#2563eb}
textarea.pmsa-history-inline-input{resize:vertical;min-height:72px}
#pmsaHistoryInlineSave,#pmsaHistoryInlineCancel{margin-left:8px}
@media(max-width:700px){#pmsaHistoryInlineSave,#pmsaHistoryInlineCancel{margin:6px 6px 0 0}}

/* Tự mở rộng ô Mô tả/Kết luận/Đề nghị khi chỉnh sửa trong lịch sử */
textarea.pmsa-history-inline-input{display:block;height:auto;min-height:100px;max-height:none;overflow-y:hidden;white-space:pre-wrap;overflow-wrap:anywhere;}


/* Staff fields with independent persistent checkbox; scoped to these two rows only. */
.pmsa-staff-persist-row{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;margin:2px 0 4px;}
.pmsa-staff-field-label{display:inline-block;flex:0 0 20%;min-width:120px;white-space:nowrap;}
.pmsa-staff-name-input{flex:1 1 auto;min-width:0;width:auto!important;box-sizing:border-box;}
.pmsa-persist-check{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;white-space:nowrap;font-size:12px;font-weight:normal;cursor:pointer;}
.pmsa-persist-check input{margin:0;}