﻿/* ============================================================
   FREE DGN — CHROME STYLES
   Toolbar, tabs, margin controls, page header.
   Document-body styles (.formtable*, .textbox*, .tabletd etc.)
   are intentionally unchanged — they produce the WYSIWYG grid.
   ============================================================ */

/* -- Toolbar buttons ---------------------------------------- */
.freedgn-toolbar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    background: var(--tfs-primary-100, #F2F2F2);
    border: 1px solid var(--tfs-border, #D5D5D5);
    border-radius: 0.5rem;
    margin-bottom: 1rem;
}

.freedgn-toolbar .btn {
    font-family: 'Inter', sans-serif;
    font-size: 0.825rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    padding: 0.375rem 0.85rem;
    border-radius: 0.375rem;
}

/* -- Tab navigation ----------------------------------------- */
#dgnTabs {
    border-bottom: 2px solid var(--tfs-border, #D5D5D5);
}

#dgnTabs .nav-link {
    font-family: 'Inter', sans-serif;
    font-size: 0.825rem;
    font-weight: 500;
    color: var(--tfs-text-muted, #363636);
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 0.4rem 0.4rem 0 0;
    padding: 0.5rem 1rem;
    margin-right: 2px;
    transition: color 0.15s, background 0.15s;
}

#dgnTabs .nav-link:hover,
#dgnTabs .nav-link:focus {
    color: var(--tfs-accent, #C94C08);
    background: #fff;
    border-color: var(--tfs-border, #D5D5D5) var(--tfs-border, #D5D5D5) transparent;
}

#dgnTabs .nav-link.active {
    color: var(--tfs-accent, #C94C08);
    background: #fff;
    border-color: var(--tfs-border, #D5D5D5) var(--tfs-border, #D5D5D5) #fff;
    font-weight: 600;
}

/* -- Tab content panel -------------------------------------- */
.freedgn-tab-content {
    border: 1px solid var(--tfs-border, #D5D5D5);
    border-top: none;
    border-radius: 0 0 0.5rem 0.5rem;
    background: #fff;
    padding: 1rem;
}

/* -- Margin controls bar ------------------------------------ */
.tabtable {
    width: 100%;
    background: var(--tfs-primary-100, #F2F2F2);
    border: 1px solid var(--tfs-border, #D5D5D5);
    border-radius: 0.4rem;
    margin-bottom: 0.75rem;
    padding: 0.25rem 0;
}

.textmargins {
    font-size: 0.7rem;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    text-align: right;
    color: var(--tfs-text-muted, #363636);
    width: 100px;
}

/* -- Document title ----------------------------------------- */
.dgntitle {
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    text-align: left;
    width: 390px;
    color: var(--tfs-text, #111111);
}

.textBoxL
{
    font-size: 12px;
    font-family: 'Courier New' , Courier, monospace;
    width: 380px;
}
.textBoxLL
{
    font-size: 12px;
    font-family: 'Courier New' , Courier, monospace;
    width: 475px;
}
.textBoxN
{
    font-size: 12px;
    font-family: 'Courier New' , Courier, monospace;
}
.footertxt
{
    font-size: 12px;
    font-family: Verdana;
    font-weight: bold;
    width: 652px;
}
.tabletd
{
    border: 1px solid #808080;
}
.formtable
{
    border: 1px solid #808080;
    background-color: #FFFFCC;
    height: 342px;
    width: 428px;
}
.formtable td {
    padding: 0px;
}
.formtable2
{
    background-color: #FFFFCC;
    height: 138px;
    width: 287px;
    margin-top: 0px;
    border-spacing: 3px;
    border-collapse: separate;

}
.formtable2 td {
    padding: 0px;
}
.formtable3
{
    background-color: #FFFFCC;
    height: 41px;
    width: 335px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable3 td {
    padding: 0px;
}
.formtable4
{
    border: 1px solid #808080;
    background-color: #FFFFCC;
    height: 41px;
    width: 380px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable4 td {
    padding: 0px;
}
.formtable5
{
    background-color: #FFFFCC;
    height: 41px;
    width: 397px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable5 td {
    padding: 0px;
}
.formtable6
{
    background-color: #FFFFCC;
    height: 138px;
    width: 235px;
    margin-top: 0px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable6 td {
    padding: 0px;
}
.formtable7
{
    background-color: #FFFFCC;
    height: 41px;
    width: 311px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable7 td {
    padding: 0px;
}
.formtable8
{
    background-color: #FFFFCC;
    height: 138px;
    width: 312px;
    margin-top: 0px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable8 td {
    padding: 0px;
}
.formtable9
{
    background-color: #FFFFCC;
    height: 112px;
    width: 325px;
    margin-top: 0px;
    border-spacing: 0px;
    border-collapse: separate;
}
.formtable9 td {
    padding: 0px;
}
.formtable29
{
    background-color: #FFFFCC;
    border: 1px solid #808080;
    height: 50px;
    width: 100%;
    margin-top: 0px;
    border-spacing: 0px;
    border-collapse: separate;
}
.formtable29 td {
    padding: 0px;
}
.formtable10
{
    background-color: #FFFFCC;
    height: 41px;
    width: 100%;
    border-spacing: 1px;
    border-collapse: separate;
}
.formtable10 td {
    padding: 0px;
}
.formtable20
{
    background-color: #FFFFCC;
    height: 41px;
    width: 100%;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable20 td {
    padding: 0px;
}
.formtable11
{
    background-color: #FFFFCC;
    height: 27px;
    width: 100%;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable11 td {
    padding: 0px;
}
.formtable12
{
    background-color: #FFFFCC;
    height: 41px;
    width: 398px;
    border-spacing: 1px;
    border-collapse: separate;
}
.formtable12 td {
    padding: 0px;
}
.formtable13
{
    background-color: #FFFFCC;
    height: 41px;
    width: 287px;
    border-spacing: 1px;
    border-collapse: separate;
}
.formtable13 td {
    padding: 0px;
}
.formtable14
{
    background-color: #FFFFCC;
    height: 35px;
    width: 700px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable14 td {
    padding: 0px;
}
.formtable15
{
    border: 1px solid #808080;
    background-color: #FFFFCC;
    height: 41px;
    width: 150px;
    border-spacing: 3px;
    border-collapse: separate;
}
.formtable15 td {
    padding: 0px;
}
.textbox1
{
    font-size: 12px;
    font-family: 'Courier New' , Courier, monospace;
    text-align: left;
    height: 17px;
}
.textboxHd
{
    font-size: 9px;
    font-family: Verdana;
    font-weight: bold;
    text-align: left;
    vertical-align: bottom;
}
.textboxHdc
{
    border: 1px solid #808080;
    font-size: 9px;
    font-family: Verdana;
    font-weight: bold;
    text-align: center;
}
.textmargins
{
    font-size: 9px;
    font-family: Verdana;
    font-weight: bold;
    text-align: right;
    width: 140px;
}
.txtDisclaimer
{
    font-size: 9px;
    font-family: Verdana;
    text-align: left;
}
.dgnappbox {
   border-top: 1px solid #a297f7;
   background: #848484;
   background: -webkit-gradient(linear, left top, left bottom, from(#6E6E6E), to(#848484));
   background: -webkit-linear-gradient(top, #6E6E6E, #848484);
   background: -moz-linear-gradient(top, #6E6E6E, #848484);
   background: -ms-linear-gradient(top, #6E6E6E, #848484);
   background: -o-linear-gradient(top, #6E6E6E, #848484);
   padding: 10px 10px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: #f7eff7;
   text-decoration: none;
   vertical-align: middle;
}

.dgnopaimg
{
 opacity:0.6;
 filter:alpha(opacity=60); /* For IE8 and earlier */
}

.dgnopaimg:hover
{
 opacity:1.0;
 filter:alpha(opacity=100); /* For IE8 and earlier */
}

.dgnGreenLink {
   border-top: 1px solid #4dde5e;
   background: #51c251;
   background: -webkit-gradient(linear, left top, left bottom, from(#494b4d), to(#51c251));
   background: -webkit-linear-gradient(top, #494b4d, #51c251);
   background: -moz-linear-gradient(top, #494b4d, #51c251);
   background: -ms-linear-gradient(top, #494b4d, #51c251);
   background: -o-linear-gradient(top, #494b4d, #51c251);
   padding: 2px 2px;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px;
   font-family: Helvetica, Arial, Sans-Serif;
   text-decoration: none;
   vertical-align: middle;
}
.dgnGreenLink:hover {
   border-top-color: #056b26;
   background: #056b26;
   color: #ccc;
}
.dgnGreenLink:active {
   border-top-color: #10ad2f;
   background: #10ad2f;
}

/* ── Inline-style replacements ────────────────────────────────────────────── */

/* Introduction tab layout */
.freedgn-intro-table            { margin-top: 40px; margin-bottom: 40px; }
.freedgn-intro-promo            { width: 35%; text-align: center; vertical-align: top; padding: 10px; }
.freedgn-intro-promo__font      { font-family: Verdana; }
.freedgn-intro-promo__heading   { font-size: 18px; }
.freedgn-intro-promo__sub       { font-size: 12px; }
.freedgn-intro-promo__services  { font-size: 17px; }
.freedgn-intro-promo__list      { font-size: 12px; text-align: left; }
.freedgn-intro-promo__more      { font-size: 18px; }
.freedgn-intro-body             { padding-left: 10px; }
.freedgn-intro-body__table      { width: 100%; }
.freedgn-intro-title            { padding-bottom: 15px; }
.freedgn-intro-title h1         { font-size: 18px; }

/* td vertical-align helpers */
.td-top    { vertical-align: top; }
.td-bottom { vertical-align: bottom; }

/* Fixed-width td headers (label columns) */
.textboxHd-w200 { width: 200px; }

/* Textarea: full-width, standard height variants */
.txa-full-h90   { width: 100%; height: 90px; }
.txa-full-h200  { width: 100%; height: 200px; }

/* Textarea: fixed-width variants */
.txa-w50-h200   { width: 50px;  height: 200px; }
.txa-w95-h200   { width: 95px;  height: 200px; }
.txa-w95-h60    { width: 95px;  height: 60px; }
.txa-w95-h390   { width: 95px;  height: 390px; }
.txa-w185-h90   { width: 185px; height: 90px; }
.txa-w210-h90   { width: 210px; height: 90px; }
.txa-w250-h75   { width: 250px; height: 75px; }
.txa-w280-h30   { width: 280px; height: 30px; }
.txa-w290-h30   { width: 290px; height: 30px; }
.txa-w310-h90   { width: 310px; height: 90px; }
.txa-w315-h90   { width: 315px; height: 90px; }  /* description col in inv */
.txa-w315-h200  { width: 315px; height: 200px; }
.txa-w500-h90   { width: 500px; height: 90px; }
.txa-w755-h60   { width: 755px; height: 60px; }
.txa-w755-h165  { width: 755px; height: 165px; }
.txa-w755-h405  { width: 755px; height: 405px; }
.txa-full-h45   { width: 100%; height: 45px; }
.txa-full-h200  { width: 100%; height: 200px; }

/* textBoxLL textarea with explicit size */
.txa-ll-h200    { width: 475px; height: 200px; }  /* overrides .textBoxLL default height */
.txa-ll-h390    { height: 390px; }

/* Input widths */
.inp-w20   { width: 20px; }
.inp-w30   { width: 30px; }
.inp-w50   { width: 50px; }
.inp-w65   { width: 65px; }
.inp-w95   { width: 95px; }
.inp-w120  { width: 120px; }
.inp-w130  { width: 130px; }
.inp-w170  { width: 170px; }
.inp-w175  { width: 175px; }
.inp-w183  { width: 183px; }
.inp-w184  { width: 184px; }
.inp-w190  { width: 190px; }
.inp-w225  { width: 225px; }
.inp-w265  { width: 265px; }
.inp-w270  { width: 270px; }
.inp-w290  { width: 290px; }
.inp-w360  { width: 360px; }
.inp-w369  { width: 369px; }
.inp-w380  { width: 380px; }
.inp-w384  { width: 384px; }  /* inv remarks */

/* formtable9 full-width override (MM tab) */
.formtable9-full { width: 100%; }

/* td fixed-width helpers */
.textboxHd-w95  { width: 95px; }

/* Textarea width-only helpers (combine with height class) */
.txa-w45  { width: 45px; }
.txa-w60  { width: 60px; }
.txa-w70  { width: 70px; }
.txa-w90  { width: 90px; }
.txa-w100 { width: 100px; }
.txa-w185 { width: 185px; }
.txa-w215 { width: 215px; }